Fixed addnote

This commit is contained in:
2016-01-29 09:37:44 +08:00
parent b39d241e2c
commit e099553701
3 changed files with 161 additions and 137 deletions
+2 -1
View File
@@ -5,11 +5,12 @@ define(
function( function(
Backbone Backbone
) { ) {
var TaskModel = Backbone.Model.extend({ var TaskModel = Backbone.Model.extend({
defaults: { defaults: {
parent: 0, parent: 0,
parentId: 0,
content: '', content: '',
isCompleted: 0 isCompleted: 0
}, },
+3 -3
View File
@@ -37,10 +37,10 @@ TaskView
model: task model: task
}); });
var a = taskView.render(); var a = taskView.render();
if (a.model.get('parent')!=0) if (a.model.get('parent')===null||a.model.get('parent')===0)
a.$el.insertAfter($('*[data-id="'+a.model.get('parent')+'"]').parents('li:first'));
else
this.$el.append(a.el); this.$el.append(a.el);
else
a.$el.insertAfter($('*[data-id="'+a.model.get('parent')+'"]').parents('li:first'));
} }
}); });
+156 -133
View File
@@ -1,154 +1,177 @@
define( define(
['jquery', ['jquery',
'backbone', 'backbone',
'socket', 'socket',
'util/constants', 'util/constants',
'text!../../templates/task.html' 'text!../../templates/task.html'
], ],
function( function (
$, $,
Backbone, Backbone,
io, io,
constants, constants,
taskTemplate taskTemplate
) { ) {
var TaskView = Backbone.View.extend({ var TaskView = Backbone.View.extend({
tagName: 'li', tagName: 'li',
template: taskTemplate, template: taskTemplate,
events: { events: {
'click .task': 'edit', 'click .task': 'edit',
'blur .edit': 'close', 'blur .edit': 'close',
'keyup .edit': 'handleKeyup', 'keyup .edit': 'handleKeyup',
'keypress .edit': 'update', 'keypress .edit': 'update',
'mouseover .link':'showOptions', 'mouseover .link': 'showOptions',
'mouseout .link':'hideOptions', 'mouseout .link': 'hideOptions',
'click .complete':'markComplete', 'click .complete': 'markComplete',
'click .uncomplete':'unmarkComlete', 'click .uncomplete': 'unmarkComlete',
'click .note':'addNote' 'click .note': 'addNote'
}, },
initialize: function() { initialize: function () {
this.listenTo(this.model, 'change', this.render); this.listenTo(this.model, 'change', this.render);
this.listenTo(this.model, 'destroy', this.remove); this.listenTo(this.model, 'destroy', this.remove);
this.socket = io.connect(); this.socket = io.connect();
var task = this; var task = this;
this.socket.on('task', function(data){ this.socket.on('task', function (data) {
if (task.model.id == data.id) { if (task.model.id == data.id) {
task.model.set({'content':data.content, 'isCompleted':data.isCompleted}); task.model.set({
} 'content': data.content,
}); 'isCompleted': data.isCompleted
}, });
}
});
},
render: function() { render: function () {
var tmpl = _.template(this.template); var tmpl = _.template(this.template);
var task = this; var task = this;
this.$el.html(tmpl({model:this.model.toJSON()})); this.$el.html(tmpl({
if (this.model.get('parentId')!=0) { model: this.model.toJSON()
this.$el.addClass('shift1'); }));
var className = $('*[data-id="'+this.model.get('parentId')+'"]').parents('li:first').attr('class'); if (this.model.get('parentId') != 0) {
if (className!=undefined && className!=0 && className.substring(0,5) == 'shift') { this.$el.addClass('shift1');
this.$el.removeClass(); var className = $('*[data-id="' + this.model.get('parentId') + '"]').parents('li:first').attr('class');
this.$el.addClass('shift' + (parseInt(className.charAt(5))+1)); if (className != undefined && className != 0 && className.substring(0, 5) == 'shift') {
} this.$el.removeClass();
} this.$el.addClass('shift' + (parseInt(className.charAt(5)) + 1));
this.$input = this.$('.edit:first'); }
}
this.$input = this.$('.edit:first');
return this; return this;
}, },
edit: function() { edit: function () {
this.$el.addClass('editing'); this.$el.addClass('editing');
this.$input.focus(); this.$input.focus();
}, },
handleKeyup: function(e) { handleKeyup: function (e) {
if (e.keyCode == 40) // down arrow
this.$el.next('li').find('input').focus(); if (e.keyCode == 40)
else if (e.keyCode == 38) this.$el.next('li').find('input').focus();
this.$el.prev('li').find('input').focus(); // Up arrow
else if (e.keyCode == 38)
this.$el.prev('li').find('input').focus();
if (e.shiftKey && e.keyCode == 9) { // shift and tab
var model = this.$el.next('li').find('input').data('id'); if (e.shiftKey && e.keyCode == 9) {
model = Tasks.get(model); var model = this.$el.next('li').find('input').data('id');
var old_parent = model.get('parentId'); model = Tasks.get(model);
old_parent = Tasks.get(old_parent); var old_parent = model.get('parentId');
var new_parent = old_parent.get('parentId'); old_parent = Tasks.get(old_parent);
if (new_parent == null) new_parent = 0; var new_parent = old_parent.get('parentId');
model.set('parentId',new_parent); if (new_parent == null) new_parent = 0;
model.save({content: model.get('content'), parentId: model.get('parentId')}); model.set('parentId', new_parent);
} model.save({
else if (e.keyCode == 9) { content: model.get('content'),
var parent = this.$el.prev('li').prev('li').find('input').data('id'); parentId: model.get('parentId')
var current = this.$el.prev('li').find('input').data('id'); });
var model = Tasks.get(current); }
model.set('parentId',parent); // tab
model.save({content: model.get('content'), parentId: model.get('parentId')}); else if (e.keyCode == 9) {
} var parent = this.$el.prev('li').prev('li').find('input').data('id');
this.socket.emit('task', { var current = this.$el.prev('li').find('input').data('id');
id: this.model.id, var model = Tasks.get(current);
parentId: this.model.parentId, model.set('parentId', parent);
content: this.$input.val().trim(), model.save({
isCompleted:this.model.toJSON().isCompleted content: model.get('content'),
}); parentId: model.get('parentId')
}, });
}
update: function(e) { this.socket.emit('task', {
if ( e.which === constants.ENTER_KEY ) { id: this.model.id,
Tasks.add({content:'', parentId: this.model.get('parentId')}); parentId: this.model.parentId,
this.$input.blur(); content: this.$input.val().trim(),
this.$el.next('li').find('input').focus(); isCompleted: this.model.toJSON().isCompleted
} });
}, },
close: function() { update: function (e) {
var value = this.$input.val().trim(); if (e.which === constants.ENTER_KEY) {
if (value === '') { this.addNote(e.currentTarget);
this.model.destroy(); }
}
else {
this.model.save({content: value, parentId: this.model.attributes.parentId});
}
this.$el.removeClass('editing');
},
showOptions:function(){ },
this.$el.find('.options').show(); /** Finish editing an item **/
}, close: function () {
var value = this.$input.val().trim();
if (value === '') {
this.model.destroy();
} else {
this.model.save({
content: value,
parentId: this.model.attributes.parentId
});
}
this.$el.removeClass('editing');
},
hideOptions:function(){ showOptions: function () {
this.$el.find('.options').hide(); this.$el.find('.options').show();
}, },
markComplete:function(){ hideOptions: function () {
this.model.toggelCompletedStatus(true); this.$el.find('.options').hide();
this.socket.emit('task', { },
id: this.model.id,
parentId: this.model.parentId,
content:this.model.toJSON().content,
isCompleted: this.model.toJSON().isCompleted
});
},
unmarkComlete:function(){ markComplete: function () {
this.model.toggelCompletedStatus(false); this.model.toggelCompletedStatus(true);
this.socket.emit('task', { this.socket.emit('task', {
id: this.model.id, id: this.model.id,
parentId: this.model.parentId, parentId: this.model.parentId,
content:this.model.toJSON().content, content: this.model.toJSON().content,
isCompleted: this.model.toJSON().isCompleted isCompleted: this.model.toJSON().isCompleted
}); });
}, },
addNote:function(){ unmarkComlete: function () {
this.$el.find('.divNote').show(); this.model.toggelCompletedStatus(false);
} this.socket.emit('task', {
id: this.model.id,
parentId: this.model.parentId,
content: this.model.toJSON().content,
isCompleted: this.model.toJSON().isCompleted
});
},
}); addNote: function (inputEle) {
var $inputEle = $(inputEle);
Tasks.add({
content: '',
parentId: this.model.get('parentId')
});
$inputEle.blur();
$inputEle.closest('li').next('li').find('input').focus();
}
return TaskView; });
}); return TaskView;
});