mirror of
https://github.com/leanote/desktop-app.git
synced 2026-01-13 07:03:04 +08:00
历史记录优化
This commit is contained in:
life
16
src/node_modules/note.js
generated
vendored
16
src/node_modules/note.js
generated
vendored
@@ -197,8 +197,8 @@ var Note = {
|
||||
// 更新之
|
||||
else {
|
||||
var histories = history.Histories;
|
||||
histories.push(content);
|
||||
db.noteHistories.update({_id: noteId}, {$set: {Histories: histories, "UpdatedTime": new Date()}});
|
||||
histories.push({Content: content, UpdatedTime: new Date()});
|
||||
db.noteHistories.update({_id: noteId}, {$set: {Histories: histories}});
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -214,7 +214,17 @@ var Note = {
|
||||
else {
|
||||
var histories = [];
|
||||
for(var i = doc.Histories.length - 1; i >= 0; --i) {
|
||||
histories.push({Content: doc.Histories[i], UpdatedTime: doc.UpdatedTime || new Date()});
|
||||
var history = doc.Histories[i];
|
||||
var content, updatedTime;
|
||||
if (typeof history == 'object') {
|
||||
content = history.Content;
|
||||
updatedTime = history.UpdatedTime;
|
||||
}
|
||||
else {
|
||||
content = history;
|
||||
updatedTime = doc.UpdatedTime || new Date();
|
||||
}
|
||||
histories.push({Content: content, UpdatedTime: updatedTime});
|
||||
}
|
||||
callback(histories);
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<meta name="apple-touch-fullscreen" content="yes">
|
||||
<meta name=”apple-mobile-web-app-capable” content=”yes” />
|
||||
<meta name="keywords" content="leanote,leanote.com">
|
||||
<meta name="description" content="leanote, Not Just A Notepad">
|
||||
<meta name="description" content="leanote, Not Just A Notepad!">
|
||||
<title class="lang">Leanote, Not Just A Notepad</title>
|
||||
|
||||
<link href="public/css/bootstrap.css" rel="stylesheet" />
|
||||
@@ -672,14 +672,12 @@ window.require = undefined;
|
||||
|
||||
<!-- 使用require js -->
|
||||
<script src="public/js/require.js"></script>
|
||||
|
||||
<!-- 导入插件 执行 -->
|
||||
<script src="public/js/main.js"></script>
|
||||
|
||||
<script src="public/tinymce/plugins/leaui_image/public/js/jquery.ui.widget.js"></script>
|
||||
<script src="public/tinymce/plugins/leaui_image/public/js/jquery.fileupload.js"></script>
|
||||
<script src="public/tinymce/plugins/leaui_image/public/js/jquery.iframe-transport.js"></script>
|
||||
|
||||
<!-- markdown editor -->
|
||||
<script src="public/md/main.js"></script>
|
||||
<!-- extra额外 -->
|
||||
<script src="public/js/dec/main.js"></script>
|
||||
|
||||
<script>
|
||||
window.require = window.requireNode;
|
||||
|
||||
@@ -1410,73 +1410,6 @@ Note.shareNote = function(target) {
|
||||
shareNoteOrNotebook(noteId, true);
|
||||
}
|
||||
|
||||
// 历史记录
|
||||
Note.listNoteContentHistories = function() {
|
||||
// 弹框
|
||||
$("#leanoteDialog #modalTitle").html(getMsg("history"));
|
||||
$content = $("#leanoteDialog .modal-body");
|
||||
$content.html("");
|
||||
$("#leanoteDialog .modal-footer").html('<button type="button" class="btn btn-default" data-dismiss="modal">' + getMsg("close") + '</button>');
|
||||
options = {}
|
||||
options.show = true;
|
||||
$("#leanoteDialog").modal(options);
|
||||
|
||||
NoteService.getNoteHistories(Note.curNoteId, function(re) {
|
||||
// console.log("histories.....");
|
||||
// console.log(re);
|
||||
// });
|
||||
// ajaxGet("/noteContentHistory/listHistories", {noteId: Note.curNoteId}, function(re) {
|
||||
if(!isArray(re)) {
|
||||
$content.html(getMsg("noHistories")); return;
|
||||
}
|
||||
// 组装成一个tab
|
||||
var str = /*"<p>" + getMsg("historiesNum") + '</p>' + */'<div id="historyList"><table class="table table-hover">';
|
||||
note = Note.cache[Note.curNoteId];
|
||||
var s = "div"
|
||||
if(note.IsMarkdown) {
|
||||
s = "pre";
|
||||
}
|
||||
for (i in re) {
|
||||
var content = re[i]
|
||||
content.Ab = Note.genAbstract(content.Content, 200);
|
||||
// 为什么不用tt(), 因为content可能含??
|
||||
str += '<tr><td seq="' + i + '">#' + (i+1) +'<' + s + ' class="each-content">' + content.Ab + '</' + s + '> <div class="btns">' + getMsg("datetime") + ': <span class="label label-default">' + goNowToDatetime(content.UpdatedTime) + '</span> <button class="btn btn-default all">' + getMsg("unfold") + '</button> <button class="btn btn-primary back">' + getMsg('restoreFromThisVersion') + '</button></div></td></tr>';
|
||||
}
|
||||
str += "</table></div>";
|
||||
$content.html(str);
|
||||
$("#historyList .all").click(function() {
|
||||
$p = $(this).parent().parent();
|
||||
var seq = $p.attr("seq");
|
||||
var $c = $p.find(".each-content");
|
||||
var info = re[seq];
|
||||
if(!info.unfold) { // 默认是折叠的
|
||||
$(this).text(getMsg("fold")); // 折叠
|
||||
$c.html(info.Content);
|
||||
info.unfold = true;
|
||||
} else {
|
||||
$(this).text(getMsg("unfold")); // 展开
|
||||
$c.html(info.Ab);
|
||||
info.unfold = false
|
||||
}
|
||||
});
|
||||
|
||||
// 还原
|
||||
$("#historyList .back").click(function() {
|
||||
$p = $(this).parent().parent();
|
||||
var seq = $p.attr("seq");
|
||||
if(confirm(getMsg("confirmBackup"))) {
|
||||
// 保存当前版本
|
||||
Note.curChangedSaveIt();
|
||||
// 设置之
|
||||
note = Note.cache[Note.curNoteId];
|
||||
setEditorContent(re[seq].Content, note.IsMarkdown);
|
||||
//
|
||||
hideDialog();
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
//-----------------
|
||||
// read only, 已过时
|
||||
|
||||
@@ -2715,9 +2648,9 @@ $(function() {
|
||||
|
||||
//------------
|
||||
// 文档历史
|
||||
$("#contentHistory").click(function() {
|
||||
Note.listNoteContentHistories()
|
||||
});
|
||||
// $("#contentHistory").click(function() {
|
||||
// Note.listNoteContentHistories()
|
||||
// });
|
||||
|
||||
$("#saveBtn").click(function() {
|
||||
Note.curChangedSaveIt(true);
|
||||
|
||||
162
src/public/js/dec/history.js
Normal file
162
src/public/js/dec/history.js
Normal file
@@ -0,0 +1,162 @@
|
||||
/**
|
||||
* @file 历史记录
|
||||
* @author life
|
||||
*
|
||||
*/
|
||||
define(function() {
|
||||
|
||||
var tpl = ['<div class="modal fade history-modal" tabindex="-1" role="dialog" aria-hidden="true">',
|
||||
'<div class="modal-dialog modal-lg ">',
|
||||
'<div class="modal-content">',
|
||||
'<div class="modal-header">',
|
||||
'<h4 class="modal-title" class="modalTitle">' + + '</h4>',
|
||||
'</div>',
|
||||
'<div class="modal-body clearfix">',
|
||||
'<div class="history-list-wrap pull-left">',
|
||||
'<div class="history-list-header">' + getMsg('history') +' (<span class="history-num"></span>)</div>',
|
||||
'<div class="history-list list-group"></div>',
|
||||
'</div>',
|
||||
'<div class="history-content-wrap pull-left">',
|
||||
'<div class="history-content-header">',
|
||||
'<a class="btn btn-primary back">' + getMsg('restoreFromThisVersion') + '</a>',
|
||||
'<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>',
|
||||
'</div>',
|
||||
'<div class="history-content"></div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="modal-footer hide">',
|
||||
'<button type="button" class="btn btn-default" data-dismiss="modal">' + getMsg('close') + '</button>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'].join('');
|
||||
var $tpl = $(tpl);
|
||||
|
||||
var $historyContent = $tpl.find('.history-content');
|
||||
var $historyList = $tpl.find('.history-list');
|
||||
var $historyNum = $tpl.find('.history-num');
|
||||
var view = {
|
||||
note: null,
|
||||
list: [],
|
||||
curIndex: 0,
|
||||
|
||||
renderContent: function (i) {
|
||||
var content = this.list[i].Content;
|
||||
this.curIndex = i;
|
||||
|
||||
var wrap = '<div>';
|
||||
var wrapEnd = '</div>';
|
||||
if (this.note.IsMarkdown) {
|
||||
wrap = '<pre>';
|
||||
wrapEnd = '</pre>';
|
||||
}
|
||||
$historyContent.html(wrap + content + wrapEnd);
|
||||
|
||||
var as = $historyList.find('a');
|
||||
as.removeClass('active');
|
||||
as.eq(i).addClass('active');
|
||||
},
|
||||
render: function (list) {
|
||||
var navs = '';
|
||||
this.list = list;
|
||||
// console.log(list);
|
||||
if (list) {
|
||||
for(var i = 0; i < list.length; ++i) {
|
||||
var content = list[i];
|
||||
navs += '<a class="list-group-item" data-index="' + i + '"><span class="badge">#' + (i+1)+ '</span>' + goNowToDatetime(content.UpdatedTime) + '</a>';
|
||||
}
|
||||
}
|
||||
$historyList.html(navs);
|
||||
|
||||
this.renderContent(0);
|
||||
$historyNum.html(list.length);
|
||||
// show
|
||||
$tpl.modal({show: true});
|
||||
},
|
||||
|
||||
bind: function () {
|
||||
var me = this;
|
||||
$("#contentHistory").click(function() {
|
||||
me.getHistories();
|
||||
});
|
||||
|
||||
$historyList.on('click', 'a', function () {
|
||||
var index = $(this).data('index');
|
||||
me.renderContent(index);
|
||||
});
|
||||
|
||||
// 还原
|
||||
$tpl.find('.back').click(function() {
|
||||
if(confirm(getMsg("confirmBackup"))) {
|
||||
// 保存当前版本
|
||||
Note.curChangedSaveIt(true);
|
||||
|
||||
// 设置之
|
||||
note = Note.cache[Note.curNoteId];
|
||||
setEditorContent(me.list[me.curIndex].Content, note.IsMarkdown);
|
||||
|
||||
$tpl.modal('hide');
|
||||
// 保存
|
||||
Note.curChangedSaveIt(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
getHistories: function () {
|
||||
var me = this;
|
||||
var note = Note.getCurNote();
|
||||
me.note = note;
|
||||
NoteService.getNoteHistories(Note.curNoteId, function(re) {
|
||||
if(!isArray(re)) {
|
||||
alert(getMsg('noHistories'));
|
||||
return;
|
||||
}
|
||||
|
||||
me.render(re);
|
||||
|
||||
return;
|
||||
|
||||
// 组装成一个tab
|
||||
var str = "<p>" + getMsg("historiesNum") + '</p><div id="historyList"><table class="table table-hover">';
|
||||
note = Note.cache[Note.curNoteId];
|
||||
var s = "div"
|
||||
if(note.IsMarkdown) {
|
||||
s = "pre";
|
||||
}
|
||||
for (i in re) {
|
||||
var content = re[i]
|
||||
content.Ab = Note.genAbstract(content.Content, 200);
|
||||
// 为什么不用tt(), 因为content可能含??
|
||||
str += '<tr><td seq="' + i + '">#' + (i+1) +'<' + s + ' class="each-content">' + content.Ab + '</' + s + '> <div class="btns">' + getMsg("datetime") + ': <span class="label label-default">' + goNowToDatetime(content.UpdatedTime) + '</span> <button class="btn btn-default all">' + getMsg("unfold") + '</button> <button class="btn btn-primary back">' + getMsg('restoreFromThisVersion') + '</button></div></td></tr>';
|
||||
}
|
||||
str += "</table></div>";
|
||||
$content.html(str);
|
||||
$("#historyList .all").click(function() {
|
||||
$p = $(this).parent().parent();
|
||||
var seq = $p.attr("seq");
|
||||
var $c = $p.find(".each-content");
|
||||
var info = re[seq];
|
||||
if(!info.unfold) { // 默认是折叠的
|
||||
$(this).text(getMsg("fold")); // 折叠
|
||||
$c.html(info.Content);
|
||||
info.unfold = true;
|
||||
} else {
|
||||
$(this).text(getMsg("unfold")); // 展开
|
||||
$c.html(info.Ab);
|
||||
info.unfold = false
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
},
|
||||
|
||||
init: function () {
|
||||
var me = this;
|
||||
this.bind();
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
view.init();
|
||||
});
|
||||
16
src/public/js/dec/main.js
Normal file
16
src/public/js/dec/main.js
Normal file
@@ -0,0 +1,16 @@
|
||||
// 装饰, 不是立刻就需要的功能
|
||||
// 1. 历史记录
|
||||
// todo
|
||||
// 2. history
|
||||
// 3. note info
|
||||
// requirejs.config({
|
||||
// paths: {
|
||||
// 'history': 'public/js/dec/history',
|
||||
// }
|
||||
// });
|
||||
|
||||
// 异步加载
|
||||
var requireWeb = require;
|
||||
setTimeout(function () {
|
||||
requireWeb(['public/js/dec/history']);
|
||||
});
|
||||
@@ -2541,3 +2541,96 @@ body,
|
||||
.local #syncProgress {
|
||||
display: none;
|
||||
}
|
||||
.history-modal .modal-dialog {
|
||||
width: auto !important;
|
||||
position: absolute;
|
||||
/* width: 100%; */
|
||||
/* height: 100%; */
|
||||
left: 5px;
|
||||
right: 5px;
|
||||
top: 20px;
|
||||
bottom: 20px;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: scroll;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow-y: auto;
|
||||
width: 200px;
|
||||
border-right: 1px solid #ccc;
|
||||
box-shadow: 1px 1px 10px #ddd;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap .history-list-header {
|
||||
line-height: 50px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
padding-left: 15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
background-color: #ccc;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap .history-list {
|
||||
position: absolute;
|
||||
top: 51px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
overflow-y: auto;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap .list-group-item {
|
||||
border-top: none;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap .list-group-item.active,
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-list-wrap .list-group-item:hover {
|
||||
color: #000;
|
||||
background-color: #eee;
|
||||
border-color: #eee;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-content-wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 200px;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-content-wrap .close {
|
||||
padding: 10px 15px;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-content-wrap .back {
|
||||
margin-left: 10px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-content-wrap .history-content-header {
|
||||
height: 51px;
|
||||
border-bottom: 1px solid #eee;
|
||||
box-shadow: 5px 0px 5px #ccc;
|
||||
}
|
||||
.history-modal .modal-dialog .modal-content .modal-body .history-content-wrap .history-content {
|
||||
position: absolute;
|
||||
top: 51px;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding-top: 5px;
|
||||
padding-right: 5px;
|
||||
padding-left: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@@ -801,3 +801,109 @@ html, body, #page, #pageInner, #noteList, #notebook, #leftNotebook {
|
||||
.local #syncRefresh, .local #syncProgress {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
//===========
|
||||
// history
|
||||
.history-modal .modal-dialog {
|
||||
width: auto !important;
|
||||
position: absolute;
|
||||
/* width: 100%; */
|
||||
/* height: 100%; */
|
||||
left: 5px;
|
||||
right: 5px;
|
||||
top: 20px;
|
||||
bottom: 20px;
|
||||
|
||||
.modal-content {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: scroll;
|
||||
|
||||
.modal-body {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 0;
|
||||
.history-list-wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow-y: auto;
|
||||
width: 200px;
|
||||
border-right: 1px solid #ccc;
|
||||
box-shadow: 1px 1px 10px #ddd;
|
||||
|
||||
.history-list-header {
|
||||
line-height: 50px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
padding-left: 15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
background-color: #ccc;
|
||||
}
|
||||
|
||||
.history-list {
|
||||
position: absolute;
|
||||
top: 51px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
overflow-y: auto;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
border-top: none;
|
||||
&.active, &:hover {
|
||||
color: #000;
|
||||
background-color: #eee;
|
||||
border-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
.history-content-wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 200px;
|
||||
|
||||
.close {
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.back {
|
||||
margin-left: 10px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.history-content-header {
|
||||
// background-color: #eee;
|
||||
height: 51px;
|
||||
border-bottom: 1px solid #eee;
|
||||
box-shadow: 5px 0px 5px #ccc;
|
||||
}
|
||||
|
||||
.history-content {
|
||||
position: absolute;
|
||||
top: 51px;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding-top: 5px;
|
||||
padding-right: 5px;
|
||||
padding-left: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user