Support pinning note in history

This commit is contained in:
Wu Cheng-Han 2015-10-22 17:09:55 +08:00
parent 5ed395122d
commit 2cfcae6db2
3 changed files with 85 additions and 7 deletions

View File

@ -257,6 +257,22 @@ input {
.ui-history-close:hover { .ui-history-close:hover {
opacity: 1; opacity: 1;
} }
.ui-history-pin {
position: absolute;
left: 14px;
top: 15px;
font-size: 16px;
opacity: 0.2;
transition: opacity 0.2s ease-in-out;
-webkit-transition: opacity 0.2s ease-in-out;
}
.item:hover .ui-history-pin:hover {
opacity: 1;
}
.item .ui-history-pin.active {
opacity: 1;
color: #d43f3a;
}
.ui-or { .ui-or {
margin-top: 5px; margin-top: 5px;
margin-bottom: 5px; margin-bottom: 5px;

View File

@ -1,9 +1,10 @@
var options = { var options = {
valueNames: ['id', 'text', 'timestamp', 'fromNow', 'time', 'tags'], valueNames: ['id', 'text', 'timestamp', 'fromNow', 'time', 'tags', 'pinned'],
item: '<li class="col-xs-12 col-sm-6 col-md-6 col-lg-4">\ item: '<li class="col-xs-12 col-sm-6 col-md-6 col-lg-4">\
<span class="id" style="display:none;"></span>\ <span class="id" style="display:none;"></span>\
<a href="#">\ <a href="#">\
<div class="item">\ <div class="item">\
<div class="ui-history-pin fa fa-thumb-tack fa-fw"></div>\
<div class="ui-history-close fa fa-close fa-fw" data-toggle="modal" data-target=".delete-modal"></div>\ <div class="ui-history-close fa fa-close fa-fw" data-toggle="modal" data-target=".delete-modal"></div>\
<div class="content">\ <div class="content">\
<h4 class="text"></h4>\ <h4 class="text"></h4>\
@ -83,17 +84,41 @@ function checkHistoryList() {
function parseHistoryCallback(list, notehistory) { function parseHistoryCallback(list, notehistory) {
checkHistoryList(); checkHistoryList();
list.sort('timestamp', { //sort by pinned then timestamp
order: "desc" list.sort('', {
sortFunction: function (a, b) {
var notea = a.values();
var noteb = b.values();
if (notea.pinned && !noteb.pinned) {
return -1;
} else if (!notea.pinned && noteb.pinned) {
return 1;
} else {
if (notea.timestamp > noteb.timestamp) {
return -1;
} else if (notea.timestamp < noteb.timestamp) {
return 1;
} else {
return 0;
}
}
}
}); });
var filtertags = []; var filtertags = [];
$(".item").each(function (key, value) { $(".item").each(function (key, value) {
var a = $(this).closest("a"); var a = $(this).closest("a");
var pin = $(this).find(".ui-history-pin");
var id = a.siblings("span").html(); var id = a.siblings("span").html();
var tagsEl = $(this).find(".tags"); var tagsEl = $(this).find(".tags");
var item = historyList.get('id', id); var item = historyList.get('id', id);
if (item.length > 0 && item[0]) { if (item.length > 0 && item[0]) {
var values = item[0].values(); var values = item[0].values();
//parse pinned
if (values.pinned) {
pin.addClass('active');
} else {
pin.removeClass('active');
}
//parse link to element a //parse link to element a
a.attr('href', '/' + values.id); a.attr('href', '/' + values.id);
//parse tags //parse tags
@ -124,6 +149,34 @@ function parseHistoryCallback(list, notehistory) {
$('.ui-delete-modal-item').html('<i class="fa fa-file-text"></i> ' + value.text + '<br><i class="fa fa-clock-o"></i> ' + value.time); $('.ui-delete-modal-item').html('<i class="fa fa-file-text"></i> ' + value.text + '<br><i class="fa fa-clock-o"></i> ' + value.time);
clearHistory = false; clearHistory = false;
deleteId = id; deleteId = id;
});
$(".ui-history-pin").click(function (e) {
e.preventDefault();
var $this = $(this);
var id = $this.closest("a").siblings("span").html();
var item = list.get('id', id)[0];
var values = item.values();
var pinned = values.pinned;
if (!values.pinned) {
pinned = true;
item._values.pinned = true;
} else {
pinned = false;
item._values.pinned = false;
}
getHistory(function (notehistory) {
for(var i = 0; i < notehistory.length; i++) {
if (notehistory[i].id == id) {
notehistory[i].pinned = pinned;
break;
}
}
saveHistory(notehistory);
if (pinned)
$this.addClass('active');
else
$this.removeClass('active');
});
}); });
buildTagsFilter(filtertags); buildTagsFilter(filtertags);
} }

View File

@ -111,12 +111,13 @@ function clearDuplicatedHistory(notehistory) {
return newnotehistory; return newnotehistory;
} }
function addHistory(id, text, time, tags, notehistory) { function addHistory(id, text, time, tags, pinned, notehistory) {
notehistory.push({ notehistory.push({
id: id, id: id,
text: text, text: text,
time: time, time: time,
tags: tags tags: tags,
pinned: pinned
}); });
return notehistory; return notehistory;
} }
@ -232,8 +233,16 @@ function renderHistory(view) {
function generateHistory(view, notehistory) { function generateHistory(view, notehistory) {
var info = renderHistory(view); var info = renderHistory(view);
//keep any pinned data
var pinned = false;
for (var i = 0; i < notehistory.length; i++) {
if (notehistory[i].id == info.id && notehistory[i].pinned) {
pinned = true;
break;
}
}
notehistory = removeHistory(info.id, notehistory); notehistory = removeHistory(info.id, notehistory);
notehistory = addHistory(info.id, info.text, info.time, info.tags, notehistory); notehistory = addHistory(info.id, info.text, info.time, info.tags, pinned, notehistory);
notehistory = clearDuplicatedHistory(notehistory); notehistory = clearDuplicatedHistory(notehistory);
return notehistory; return notehistory;
} }