Fixed UI issues when editing checklists

This commit is contained in:
Brandon McPhail 2014-01-07 11:55:41 -08:00
parent ec236f36d8
commit 07d4fc1184
2 changed files with 19 additions and 8 deletions

View file

@ -92,7 +92,10 @@ habitrpg.controller("TasksCtrl", ['$scope', '$rootScope', '$location', 'User','N
focusChecklist(task,0);
}
$scope.addChecklistItem = function(task,$event,$index) {
if ($index == task.checklist.length-1){
if (!task.checklist[$index].text) {
// Don't allow creation of an empty checklist item
// TODO Provide UI feedback that this item is still blank
} else if ($index == task.checklist.length-1){
User.user.ops.updateTask({params:{id:task.id},body:task}); // don't preen the new empty item
task.checklist.push({completed:false,text:''});
focusChecklist(task,task.checklist.length-1);
@ -101,13 +104,21 @@ habitrpg.controller("TasksCtrl", ['$scope', '$rootScope', '$location', 'User','N
focusChecklist(task,$index+1);
}
}
$scope.removeChecklistItem = function(task,$index,force){
var backspaced = !force && !task.checklist[$index].text
if (force || backspaced) {
$scope.removeChecklistItem = function(task,$event,$index,force){
// Remove item if clicked on trash icon
if (force) {
task.checklist.splice($index,1);
$scope.saveTask(task,true);
if (backspaced) focusChecklist(task,$index-1);
}
} else if (!task.checklist[$index].text) {
// User deleted all the text and is now wishing to delete the item
// saveTask will prune the empty item
$scope.saveTask(task,true);
// Move focus if the list is still non-empty
if ($index > 0)
focusChecklist(task,$index-1);
// Don't allow the backspace key to navigate back now that the field is gone
$event.preventDefault();
}
}
$scope.navigateChecklist = function(task,$index,$event){
focusChecklist(task, $event.keyCode == '40' ? $index+1 : $index-1);

View file

@ -120,10 +120,10 @@ li(bindonce='list', bo-id='"task-"+task.id', ng-repeat='task in obj[list.type+"s
i.icon.icon-question-sign(popover=env.t('checklistText'),popover-trigger='mouseenter',popover-placement='bottom')
ul.unstyled
li(ng-repeat='item in task.checklist')
a.pull-right.checklist-icons(ng-click='removeChecklistItem(task,$index,true)')
a.pull-right.checklist-icons(ng-click='removeChecklistItem(task,$event,$index,true)')
i.icon-trash(tooltip=env.t('delete'))
input(type='checkbox',ng-model='item.completed',ng-change='saveTask(task,true)')
input.inline-edit(type='text',ng-model='item.text',ui-keyup="{13:'addChecklistItem(task,$event,$index)','8 49':'removeChecklistItem(task,$index)','38 40':'navigateChecklist(task,$index,$event)'}")//-,ng-blur='saveTask(task,true)')
input.inline-edit(type='text',ng-model='item.text',ui-keydown="{'8 46':'removeChecklistItem(task,$event,$index)'}",ui-keyup="{'13':'addChecklistItem(task,$event,$index)','38 40':'navigateChecklist(task,$index,$event)'}")//-,ng-blur='saveTask(task,true)')
form(ng-submit='saveTask(task)')