<html>
<body>
<div style="font-family: Verdana, Arial, Helvetica, Sans-Serif;">
<table bgcolor="#f9f3c9" width="100%" cellpadding="12" style="border: 1px #c9c399 solid; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;">
<tr>
<td>
This is an automatically generated e-mail. To reply, visit:
<a href="https://git.reviewboard.kde.org/r/127891/">https://git.reviewboard.kde.org/r/127891/</a>
</td>
</tr>
</table>
<br />
<table bgcolor="#fefadf" width="100%" cellspacing="0" cellpadding="12" style="border: 1px #888a85 solid; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;">
<tr>
<td>
<div>Review request for KDE Edu and KDE Usability.</div>
<div>By Julian Helfferich.</div>
<div style="margin-top: 1.5em;">
<b style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Bugs: </b>
<a href="http://bugs.kde.org/show_bug.cgi?id=170534">170534</a>
</div>
<div style="margin-top: 1.5em;">
<b style="color: #575012; font-size: 10pt;">Repository: </b>
parley
</div>
<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Description </h1>
<table width="100%" bgcolor="#ffffff" cellspacing="0" cellpadding="10" style="border: 1px solid #b8b5a0">
<tr>
<td>
<pre style="margin: 0; padding: 0; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;"><p style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: inherit;">I have implemented a wish request (bug 170534) I would very much see in Parley: Add an option to edit the vocabulary during practice. To keep the review request small, I have implemented the quick edit option only for Flashcard practice. However, the approach is easy to extend.</p>
<p style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: inherit;">I took the following approach:</p>
<ul style="padding: 0;text-rendering: inherit;margin: 0 0 0 1em;line-height: inherit;white-space: normal;">
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">The QLabel displaying the question/solution is replaced by a custom widget.</li>
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">The widget is designed to behave similar to a QLabel, but it adds an additional action to the right-click context menu: "Edit vocabulary entry" (see screenshot 1).</li>
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">When this option is selected, the QLabel is swapped with a QLineEdit and two ToolButtons for "Accept" and "Cancel" (see screenshot 2).</li>
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">Clicking the "Cancel" button brings back the Label displaying the question/solution.</li>
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">Clicking the "Accept" button or pressing enter brings back the question/solution label and emits the entryEdited() signal.</li>
<li style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: normal;">This signal is passed on to Practice State Machine as questionEdited() or solutionEdited() which modifies the vocabulary entry.</li>
</ul>
<p style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: inherit;">The approach does not make the quick edit option very obvious. Instead, I have opted for not changing the look and feel of the application. Another option would be to add an "edit" ToolButton (see screenshot 3).</p></pre>
</td>
</tr>
</table>
<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Testing </h1>
<table width="100%" bgcolor="#ffffff" cellspacing="0" cellpadding="10" style="border: 1px solid #b8b5a0">
<tr>
<td>
<pre style="margin: 0; padding: 0; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;"><p style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: inherit;">Flashcard practice.</p>
<p style="padding: 0;text-rendering: inherit;margin: 0;line-height: inherit;white-space: inherit;">Started editing -> Canceled edit
Started editing -> Accepted edit -> Confirmed that vocabulary was modified
Started editing -> Pressed continue/Answer later/Hint</p></pre>
</td>
</tr>
</table>
<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">Diffs</b> </h1>
<ul style="margin-left: 3em; padding-left: 0;">
<li>src/CMakeLists.txt <span style="color: grey">(fd352de)</span></li>
<li>src/practice/abstractfrontend.h <span style="color: grey">(f5f9552)</span></li>
<li>src/practice/editable_label.ui <span style="color: grey">(PRE-CREATION)</span></li>
<li>src/practice/editablelabel.h <span style="color: grey">(PRE-CREATION)</span></li>
<li>src/practice/editablelabel.cpp <span style="color: grey">(PRE-CREATION)</span></li>
<li>src/practice/flashcardmodewidget.cpp <span style="color: grey">(ced6ca6)</span></li>
<li>src/practice/practice_widget_flashcard.ui <span style="color: grey">(e1aa099)</span></li>
<li>src/practice/practicestatemachine.h <span style="color: grey">(b67ba32)</span></li>
<li>src/practice/practicestatemachine.cpp <span style="color: grey">(8756592)</span></li>
<li>src/practice/rightclickeditlabel.h <span style="color: grey">(PRE-CREATION)</span></li>
<li>src/practice/rightclickeditlabel.cpp <span style="color: grey">(PRE-CREATION)</span></li>
</ul>
<p><a href="https://git.reviewboard.kde.org/r/127891/diff/" style="margin-left: 3em;">View Diff</a></p>
<h1 style="color: #575012; font-size: 10pt; margin-top: 1.5em;">File Attachments </h1>
<li><a href="https://git.reviewboard.kde.org/media/uploaded/files/2016/05/11/f2db895e-c290-4548-9547-fd978c368893__context_menu.png">Additional context menu entry</a></li>
<li><a href="https://git.reviewboard.kde.org/media/uploaded/files/2016/05/11/6b602f41-fb17-43ec-a98e-7155f6721489__edit_entry.png">Edit vocabulary entry</a></li>
<li><a href="https://git.reviewboard.kde.org/media/uploaded/files/2016/05/11/8098a66e-eb34-430a-951a-1da21529b4ba__toolbutton.png">Edit tool button</a></li>
</ul>
</td>
</tr>
</table>
</div>
</body>
</html>