* imroved task notes expanding

This commit is contained in:
Max Pozdeev 2009-12-27 19:04:25 +03:00
parent 3ed56a03ce
commit 14df22e55b
2 changed files with 28 additions and 40 deletions

View file

@ -62,14 +62,15 @@ function prepareTaskStr(item, noteExp)
var id = parseInt(item.id);
var prio = parseInt(item.prio);
var readOnly = (flag.needAuth && !flag.isLogged) ? true : false;
return '<li id="taskrow_'+id+'" class="'+(item.compl?'task-completed ':'')+item.dueClass+'" onDblClick="editTask('+id+')">'+
return '<li id="taskrow_'+id+'" class="'+(item.compl?'task-completed ':'')+item.dueClass+(item.note!=''?' task-has-note':'')+
(noteExp?' task-expanded':'')+'" onDblClick="editTask('+id+')">'+
'<div class="task-actions"><a href="#" class="taskactionbtn" onClick="return taskContextMenu(this,'+id+')"></a></div>'+
'<div class="task-left"><div class="mtt-toggle '+(item.note==''?'invisible':(noteExp?'mtt-toggle-expanded':''))+'" onClick="toggleNote('+id+')"></div>'+
'<div class="task-left"><div class="task-toggle" onClick="toggleNote('+id+')"></div>'+
'<input type="checkbox" '+(readOnly?'disabled':'')+' onClick="completeTask('+id+',this)" '+(item.compl?'checked':'')+'></div>'+
'<div class="task-middle">'+prepareDuedate(item.duedate, item.dueClass, item.dueStr)+
'<span class="task-through">'+preparePrio(prio,id)+'<span class="task-title">'+prepareHtml(item.title)+'</span>'+
prepareTagsStr(item.tags)+'<span class="task-date">'+item.dateInline+'</span></span>'+
'<div class="task-note-block '+(item.note!=''&&noteExp?'':'hidden')+'">'+
'<div class="task-through">'+preparePrio(prio,id)+'<span class="task-title">'+prepareHtml(item.title)+'</span>'+
prepareTagsStr(item.tags)+'<span class="task-date">'+item.dateInline+'</span></div>'+
'<div class="task-note-block">'+
'<div id="tasknote'+id+'" class="task-note"><span>'+prepareHtml(item.note)+'</span></div>'+
'<div id="tasknotearea'+id+'" class="task-note-area"><textarea id="notetext'+id+'"></textarea>'+
'<span class="task-note-actions"><a href="#" onClick="return saveTaskNote('+id+')">'+lang.actionNoteSave+
@ -232,10 +233,9 @@ function toggleTaskNote(id)
if($(aArea).css('display') == 'none')
{
$('#notetext'+id).val(taskList[id].noteText);
$('#taskrow_'+id+'>div>div.task-note-block').removeClass('hidden');
$(aArea).css('display', 'block');
$('#tasknote'+id).css('display', 'none');
if(taskList[id].note != '') $('#taskrow_'+id+' .mtt-toggle').addClass('mtt-toggle-expanded');
$(aArea).show();
$('#tasknote'+id).hide();
$('#taskrow_'+id).addClass('task-expanded');
$('#notetext'+id).focus();
} else {
cancelTaskNote(id)
@ -245,11 +245,9 @@ function toggleTaskNote(id)
function cancelTaskNote(id)
{
$('#tasknotearea'+id).css('display', 'none');
$('#tasknote'+id).css('display', 'block');
if($('#tasknote'+id).text() == '') {
$('#taskrow_'+id+'>div>div.task-note-block').addClass('hidden');
}
if(taskList[id].note == '') $('#taskrow_'+id).removeClass('task-expanded');
$('#tasknotearea'+id).hide();
$('#tasknote'+id).show();
return false;
}
@ -264,8 +262,8 @@ function saveTaskNote(id)
taskList[id].note = item.note;
taskList[id].noteText = item.noteText;
$('#tasknote'+item.id+'>span').html(prepareHtml(item.note));
if(item.note == '') $('#taskrow_'+id+' .mtt-toggle').removeClass('mtt-toggle-expanded').addClass('invisible');
else $('#taskrow_'+id+' .mtt-toggle').addClass('mtt-toggle-expanded').removeClass('invisible');
if(item.note == '') $('#taskrow_'+id).removeClass('task-has-note task-expanded');
else $('#taskrow_'+id).addClass('task-has-note task-expanded');
cancelTaskNote(item.id);
}, 'json');
return false;
@ -354,7 +352,7 @@ function saveTask(form)
var item = json.list[0];
if(!taskList[item.id].compl) changeTaskCnt(taskList[item.id].dueClass, -1);
taskList[item.id] = item;
var noteExpanded = (item.note != '' && $('#taskrow_'+item.id+' .mtt-toggle').is('.mtt-toggle-expanded')) ? 1 : 0;
var noteExpanded = (item.note != '' && $('#taskrow_'+item.id).is('.task-expanded')) ? 1 : 0;
$('#taskrow_'+item.id).replaceWith(prepareTaskStr(item, noteExpanded));
if(sortBy != 0) changeTaskOrder(item.id);
cancelEdit();
@ -871,10 +869,7 @@ function btnMenuClose(e)
function toggleNote(id)
{
var o = $('#taskrow_'+id+'>div>div.task-note-block');
if(o.is('.hidden')) $('#taskrow_'+id+' .mtt-toggle').addClass('mtt-toggle-expanded');
else $('#taskrow_'+id+' .mtt-toggle').removeClass('mtt-toggle-expanded');
o.toggleClass('hidden');
$('#taskrow_'+id).toggleClass('task-expanded');
}
function toggleAllNotes(show)
@ -882,14 +877,8 @@ function toggleAllNotes(show)
for(var id in taskList)
{
if(taskList[id].note == '') continue;
if(show) {
$('#taskrow_'+id+' .mtt-toggle').addClass('mtt-toggle-expanded');
$('#taskrow_'+id+'>div>div.task-note-block').removeClass('hidden');
}
else {
$('#taskrow_'+id+' .mtt-toggle').removeClass('mtt-toggle-expanded');
$('#taskrow_'+id+'>div>div.task-note-block').addClass('hidden');
}
if(show) $('#taskrow_'+id).addClass('task-expanded');
else $('#taskrow_'+id).removeClass('task-expanded');
}
}

View file

@ -60,15 +60,14 @@ a { color:#0000ff; }
#rss_icon { float:right;margin-top:4px; }
.task-left { float:left; }
.task-left .mtt-toggle { margin-top:2px; cursor:pointer; width:15px; height:15px; float:left; background:url(images/icons.gif) -32px 0 no-repeat; }
.task-left .mtt-toggle.mtt-toggle-expanded { background-position:-48px 0; }
.task-toggle { visibility:hidden; margin-top:2px; cursor:pointer; width:15px; height:15px; float:left; background:url(images/icons.gif) -32px 0 no-repeat; }
li.task-has-note .task-toggle { visibility:visible; }
li.task-expanded .task-toggle { background-position:-48px 0; }
.task-middle { margin-left:40px; margin-right:25px; }
#tasklist { list-style-type: none; margin: 0; padding: 0;}
#tasklist li { padding:6px 2px 6px 6px; border-bottom:1px solid #DEDEDE; min-height:18px; margin-bottom:1px; background-color:#fff; }
#tasklist li:hover { background-color:#f6f6f6; }
.task-actions { float:right; width:25px; text-align:right; }
.task-actions a { margin-left:2px; margin-right:2px; }
.task-actions img { border:none; width:16px; height:16px; }
.task-date { color:#999999; font-size:8pt; margin-left:4px; display:none; }
.task-title a { color:#000000; }
.task-title a:hover { color:#af0000; }
@ -80,12 +79,11 @@ a { color:#0000ff; }
#tasklist li.soon .duedate { color:#008000; border-color:#008000; }
#tasklist li.today .duedate { color:#FF0000; border-color:#FF0000; }
#tasklist li.past .duedate { color:#A52A2A; border-color:#A52A2A; }
li.task-completed span.task-through { text-decoration:line-through; color:#777777; }
li.task-completed .task-through { text-decoration:line-through; color:#777777; }
li.task-completed .task-title a { color:#777777; }
li.task-completed .task-actions a { color:#7070ff; }
#tasklist li.task-completed .duedate { color:#777777; border-color:#777777; }
li.task-completed { opacity:0.8; }
li.task-completed .mtt-toggle { opacity:0.8; }
li.task-completed .task-toggle { opacity:0.8; }
a.taskactionbtn { display:block; float:right; height:15px; width:15px; text-decoration:none; background:url(images/icons.gif) 0 0 no-repeat; }
li:hover a.taskactionbtn { background-position:-16px 0; }
@ -94,10 +92,11 @@ li:hover a.taskactionbtn { background-position:-16px 0; }
#tasklist.filter-past li.past, #tasklist.filter-today li.today, #tasklist.filter-soon li.soon { display:block; }
#tasklist.filter-past li.task-completed, #tasklist.filter-today li.task-completed, #tasklist.filter-soon li.task-completed { display:none; }
div.task-note-block { margin-left:2px; color:#777777; background:url(images/page_white_text.png) left 2px no-repeat; padding-left:19px; padding-top:2px; min-height:16px; margin-top:2px; }
li.task-completed div.task-note-block div.task-note { text-decoration:line-through; }
div.task-note-area { display:none; margin-bottom:5px; }
div.task-note-area textarea { color:#999999; width:100%; display:block; height:65px; }
.task-note-block { margin-left:2px; color:#777777; background:url(images/page_white_text.png) left 2px no-repeat; padding-left:19px; padding-top:2px; min-height:16px; margin-top:2px; display:none; }
li.task-expanded .task-note-block { display:block; }
li.task-completed .task-note-block .task-note { text-decoration:line-through; }
.task-note-area { display:none; margin-bottom:5px; }
.task-note-area textarea { color:#999999; width:100%; display:block; height:65px; }
.task-note-actions { font-size:8pt; }
.hidden { display:none; }
.invisible { visibility:hidden; }