[checklist] Improve checklist extension and user interface
Review Request #6969 — Created Feb. 22, 2015 and submitted — Latest diff uploaded
This change aims to polish up the existing checklist UI as well as its code base.
On the UI:
- Shifted the UI to be fixed at the bottom (better than in the middle of nowhere)
- Uses existing Reviewboard icons as buttons (versus textual buttons)
- Reworked toggling of the interface (using CSS animation)
- Editing an item selects/highlights the entire text (like renaming files)
- Ability to cancel edit via Esc key or button
- Word wrapping of long item descriptions
- Now escapes special characters in the item descriptions
- Trims the string before adding or editing, avoids empty descriptions
In the front end:
- Removed delete checklist functionality (since new checklist is generated upon refresh)
- Moved remove item method from collection view to item view
- So that item ids do not have to be stored in DOM
- Fixed a bug where editing multiple items only picks the value of the first item being edited
- Enforce hyphens for ids and classes, and single quotes for strings
Glass box front end testing on Chrome 40.0.2214. Quick tests for UI on Safari 8.0.2.
- Toggling size works
- Marking an item as done or undone works
- Deleting an item works
- Editing an item works
- Cancelling item editing works
- Adding an item works
- Long text is wrapped
- Special characters are escaped
- Can edit multiple items without conflict
- Whitespace in description is trimmed
Diff Revision 3
This is not the most recent revision of the diff. The latest diff is revision 9. See what's changed.
orig
1
2
3
4
5
6
7
8
9
checklist/checklist/extension.py |
---|
checklist/checklist/resources.py |
---|
checklist/checklist/static/css/style.less |
---|
checklist/checklist/static/js/models/checklistAPI.js |
---|
checklist/checklist/static/js/views/checklistView.js |
---|
checklist/checklist/templates/checklist/template.html |
---|