From 87f7fd29ed0f76c76020c17618345708a022f250 Mon Sep 17 00:00:00 2001 From: Dandy Cheung Date: Thu, 21 Dec 2017 18:38:19 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=89=8D=E7=AB=AF=20Mark?= =?UTF-8?q?down=20=E7=BC=96=E8=BE=91=E5=99=A8=E8=84=9A=E6=9C=AC=E6=96=87?= =?UTF-8?q?=E4=BB=B6=EF=BC=8C=E7=9B=AE=E7=9A=84=E5=9C=A8=E4=BA=8E=E8=A7=A3?= =?UTF-8?q?=E5=86=B3=E4=BB=A5=E4=B8=8B=E9=97=AE=E9=A2=98=EF=BC=9A=E5=A6=82?= =?UTF-8?q?=E6=9E=9C=E7=82=B9=E5=87=BB=E2=80=9C=E5=8F=91=E5=B8=83=E2=80=9D?= =?UTF-8?q?=E6=8C=89=E9=92=AE=E6=97=B6=E6=96=87=E6=A1=A3=E5=A4=84=E4=BA=8E?= =?UTF-8?q?=E6=9C=AA=E4=BF=9D=E5=AD=98=E7=8A=B6=E6=80=81=EF=BC=8C=E5=88=99?= =?UTF-8?q?=E5=9C=A8=E6=8F=90=E7=A4=BA=E6=A1=86=E4=B8=AD=E9=80=89=E6=8B=A9?= =?UTF-8?q?=E4=BF=9D=E5=AD=98=E5=90=8E=EF=BC=8C=E5=8F=AF=E8=83=BD=E5=87=BA?= =?UTF-8?q?=E7=8E=B0=E5=B9=B6=E6=9C=AA=E5=B0=86=E6=9C=80=E6=96=B0=E7=89=88?= =?UTF-8?q?=E6=9C=AC=E6=88=90=E5=8A=9F=E5=8F=91=E5=B8=83=E7=9A=84=E6=83=85?= =?UTF-8?q?=E5=86=B5=E3=80=82=E6=8E=A8=E6=B5=8B=E5=8E=9F=E5=9B=A0=E5=9C=A8?= =?UTF-8?q?=E4=BA=8E=E5=8F=91=E5=B8=83=E7=9A=84=E5=91=BD=E4=BB=A4=E5=8F=91?= =?UTF-8?q?=E9=80=81=E5=88=B0=E6=9C=8D=E5=8A=A1=E7=AB=AF=E6=97=B6=E4=B9=8B?= =?UTF-8?q?=E5=89=8D=E7=9A=84=E4=BF=9D=E5=AD=98=E6=93=8D=E4=BD=9C=E5=8F=AF?= =?UTF-8?q?=E8=83=BD=E5=B0=9A=E6=9C=AA=E5=AE=8C=E6=88=90=EF=BC=8C=E5=9B=A0?= =?UTF-8?q?=E6=AD=A4=E5=B0=86=E5=8F=91=E5=B8=83=E5=91=BD=E4=BB=A4=E7=BD=AE?= =?UTF-8?q?=E4=BA=8E=E4=BF=9D=E5=AD=98=E5=AE=8C=E6=88=90=E5=90=8E=E7=9A=84?= =?UTF-8?q?=E5=9B=9E=E8=B0=83=E4=B8=AD=E6=89=A7=E8=A1=8C=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- static/js/markdown.js | 258 +++++++++++++++++++++--------------------- 1 file changed, 131 insertions(+), 127 deletions(-) diff --git a/static/js/markdown.js b/static/js/markdown.js index 3cb575c5..55c44fc5 100644 --- a/static/js/markdown.js +++ b/static/js/markdown.js @@ -5,12 +5,12 @@ $(function () { height : "100%", path : "/static/editor.md/lib/", toolbar : true, - placeholder: "本编辑器支持Markdown编辑，左边编写，右边预览", - imageUpload: true, - imageFormats: ["jpg", "jpeg", "gif", "png", "JPG", "JPEG", "GIF", "PNG"], - imageUploadURL: window.imageUploadURL , + placeholder : "本编辑器支持 Markdown 编辑，左边编写，右边预览。", + imageUpload : true, + imageFormats : ["jpg", "jpeg", "gif", "png", "JPG", "JPEG", "GIF", "PNG"], + imageUploadURL : window.imageUploadURL, toolbarModes : "full", - fileUpload: true, + fileUpload : true, fileUploadURL : window.fileUploadURL, taskList : true, flowChart : true, @@ -19,10 +19,11 @@ $(function () { tocStartLevel : 1, tocm : true, saveHTMLToTextarea : true, + onload : function() { this.hideToolbar(); var keyMap = { - "Ctrl-S": function(cm) { + "Ctrl-S" : function(cm) { saveDocument(false); }, "Cmd-S" : function(cm){ @@ -35,7 +36,7 @@ $(function () { this.addKeyMap(keyMap); var $select_node_id = window.treeCatalog.get_selected(); - if($select_node_id) { + if ($select_node_id) { var $select_node = window.treeCatalog.get_node($select_node_id[0]) if ($select_node) { $select_node.node = { @@ -45,13 +46,14 @@ $(function () { loadDocument($select_node); } } - uploadImage("docEditor",function ($state, $res) { - if($state === "before"){ + + uploadImage("docEditor", function ($state, $res) { + if ($state === "before") { return layer.load(1, { - shade: [0.1,'#fff'] //0.1透明度的白色背景 + shade: [0.1,'#fff'] // 0.1 透明度的白色背景 }); - }else if($state === "success"){ - if($res.errcode === 0) { + } else if ($state === "success") { + if ($res.errcode === 0) { var value = '![](' + $res.url + ')'; window.editor.insertValue(value); } @@ -66,62 +68,50 @@ $(function () { /** * 实现标题栏操作 */ - $("#editormd-tools").on("click","a[class!='disabled']",function () { + $("#editormd-tools").on("click", "a[class!='disabled']", function () { var name = $(this).find("i").attr("name"); - if(name === "attachment"){ + if (name === "attachment") { $("#uploadAttachModal").modal("show"); - }else if(name === "history"){ + } else if (name === "history") { window.documentHistory(); - }else if(name === "save"){ + } else if (name === "save") { saveDocument(false); - }else if(name === "template"){ + } else if (name === "template") { $("#documentTemplateModal").modal("show"); - }else if(name === "sidebar"){ - $("#manualCategory").toggle(0,"swing",function () { - + } else if (name === "sidebar") { + $("#manualCategory").toggle(0, "swing", function () { var $then = $("#manualEditorContainer"); var left = parseInt($then.css("left")); - if(left > 0){ + if (left > 0) { window.editorContainerLeft = left; - $then.css("left","0"); - }else{ - $then.css("left",window.editorContainerLeft + "px"); + $then.css("left", "0"); + } else { + $then.css("left", window.editorContainerLeft + "px"); } window.editor.resize(); }); - }else if(name === "release"){ - if(Object.prototype.toString.call(window.documentCategory) === '[object Array]' && window.documentCategory.length > 0){ - if($("#markdown-save").hasClass('change')) { + } else if (name === "release") { + if (Object.prototype.toString.call(window.documentCategory) === '[object Array]' && window.documentCategory.length > 0) { + if ($("#markdown-save").hasClass('change')) { var comfirm_result = confirm("编辑内容未保存，需要保存吗？") - if(comfirm_result) { - saveDocument(); + if (comfirm_result) { + saveDocument(false, releaseBook); + return; } } - $.ajax({ - url : window.releaseURL, - data :{"identify" : window.book.identify }, - type : "post", - dataType : "json", - success : function (res) { - if(res.errcode === 0){ - layer.msg("发布任务已推送到任务队列，稍后将在后台执行。"); - }else{ - layer.msg(res.message); - } - } - }); - }else{ + + releaseBook(); + } else { layer.msg("没有需要发布的文档") } - }else if(name === "tasks") { - //插入GFM任务列表 + } else if (name === "tasks") { + // 插入 GFM 任务列表 var cm = window.editor.cm; var selection = cm.getSelection(); if (selection === "") { cm.replaceSelection("- [x] " + selection); - } - else { + } else { var selectionText = selection.split("\n"); for (var i = 0, len = selectionText.length; i < len; i++) { @@ -129,7 +119,7 @@ $(function () { } cm.replaceSelection(selectionText.join("\n")); } - }else { + } else { var action = window.editor.toolbarHandlers[name]; if (action !== "undefined") { @@ -145,23 +135,23 @@ $(function () { */ window.loadDocument = function($node) { var index = layer.load(1, { - shade: [0.1,'#fff'] //0.1透明度的白色背景 + shade: [0.1,'#fff'] // 0.1 透明度的白色背景 }); $.get(window.editURL + $node.node.id ).done(function (res) { layer.close(index); resetEditor(); - if(res.errcode === 0){ + if (res.errcode === 0) { window.isLoad = true; window.editor.clear(); window.editor.insertValue(res.data.markdown); - window.editor.setCursor({line:0, ch:0}); - var node = { "id" : res.data.doc_id,'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id ,"text" : res.data.doc_name,"identify" : res.data.identify,"version" : res.data.version}; + window.editor.setCursor({ line : 0, ch : 0 }); + var node = { "id" : res.data.doc_id, 'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id, "text" : res.data.doc_name, "identify" : res.data.identify, "version" : res.data.version }; pushDocumentCategory(node); window.selectNode = node; pushVueLists(res.data.attach); - }else{ + } else { layer.msg("文档加载失败"); } }).fail(function () { @@ -174,58 +164,75 @@ $(function () { * 保存文档到服务器 * @param $is_cover 是否强制覆盖 */ - function saveDocument($is_cover,callback) { + function saveDocument($is_cover, callback) { var index = null; var node = window.selectNode; var content = window.editor.getMarkdown(); var html = window.editor.getPreviewedHTML(); var version = ""; - if(!node){ + if (!node) { layer.msg("获取当前文档信息失败"); return; } + var doc_id = parseInt(node.id); - for(var i in window.documentCategory){ + for (var i in window.documentCategory) { var item = window.documentCategory[i]; - if(item.id === doc_id){ + if (item.id === doc_id) { version = item.version; break; } } $.ajax({ beforeSend : function () { - index = layer.load(1, {shade: [0.1,'#fff'] }); + index = layer.load(1, { shade : [0.1,'#fff'] }); }, - url : window.editURL, - data : {"identify" : window.book.identify,"doc_id" : doc_id,"markdown" : content,"html" : html,"cover" : $is_cover ? "yes":"no","version": version}, - type :"post", - dataType :"json", + url : window.editURL, + data : { "identify" : window.book.identify, "doc_id" : doc_id, "markdown" : content, "html" : html, "cover" : $is_cover ? "yes" : "no", "version" : version }, + type : "post", + dataType : "json", success : function (res) { layer.close(index); - if(res.errcode === 0){ + if (res.errcode === 0) { resetEditorChanged(false); - for(var i in window.documentCategory){ + for (var i in window.documentCategory) { var item = window.documentCategory[i]; - if(item.id === doc_id){ + if (item.id === doc_id) { window.documentCategory[i].version = res.data.version; break; } } - if(typeof callback === "function"){ + if (typeof callback === "function") { callback(); } - }else if(res.errcode === 6005){ + } else if(res.errcode === 6005) { var confirmIndex = layer.confirm('文档已被其他人修改确定覆盖已存在的文档吗？', { - btn: ['确定','取消'] //按钮 - }, function(){ + btn: ['确定','取消'] // 按钮 + }, function() { layer.close(confirmIndex); - saveDocument(true,callback); + saveDocument(true, callback); }); - }else{ + } else { + layer.msg(res.message); + } + } + }); + } + + function releaseBook() { + $.ajax({ + url : window.releaseURL, + data : { "identify" : window.book.identify }, + type : "post", + dataType : "json", + success : function (res) { + if (res.errcode === 0) { + layer.msg("发布任务已推送到任务队列，稍后将在后台执行。"); + } else { layer.msg(res.message); } } @@ -233,7 +240,6 @@ $(function () { } function resetEditor($node) { - } /** @@ -241,35 +247,34 @@ $(function () { * @param $is_change */ function resetEditorChanged($is_change) { - if($is_change && !window.isLoad ){ + if ($is_change && !window.isLoad) { $("#markdown-save").removeClass('disabled').addClass('change'); - }else{ + } else { $("#markdown-save").removeClass('change').addClass('disabled'); } window.isLoad = false; } + /** * 添加顶级文档 */ $("#addDocumentForm").ajaxForm({ beforeSubmit : function () { var doc_name = $.trim($("#documentName").val()); - if (doc_name === ""){ - return showError("目录名称不能为空","#add-error-message") + if (doc_name === "") { + return showError("目录名称不能为空", "#add-error-message") } $("#btnSaveDocument").button("loading"); return true; }, success : function (res) { - if(res.errcode === 0){ - - var data = { "id" : res.data.doc_id,'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id ,"text" : res.data.doc_name,"identify" : res.data.identify,"version" : res.data.version}; + if (res.errcode === 0) { + var data = { "id" : res.data.doc_id, 'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id , "text" : res.data.doc_name, "identify" : res.data.identify, "version" : res.data.version }; var node = window.treeCatalog.get_node(data.id); - if(node){ - window.treeCatalog.rename_node({"id":data.id},data.text); - - }else { + if (node) { + window.treeCatalog.rename_node({ "id" : data.id }, data.text); + } else { window.treeCatalog.create_node(data.parent, data); window.treeCatalog.deselect_all(); window.treeCatalog.select_node(data); @@ -277,8 +282,8 @@ $(function () { pushDocumentCategory(data); $("#markdown-save").removeClass('change').addClass('disabled'); $("#addDocumentModal").modal('hide'); - }else{ - showError(res.message,"#add-error-message") + } else { + showError(res.message, "#add-error-message"); } $("#btnSaveDocument").button("reset"); } @@ -288,55 +293,54 @@ $(function () { * 文档目录树 */ $("#sidebar").jstree({ - 'plugins': ["wholerow", "types", 'dnd', 'contextmenu'], - "types": { - "default": { - "icon": false // 删除默认图标 + 'plugins' : ["wholerow", "types", 'dnd', 'contextmenu'], + "types" : { + "default" : { + "icon" : false // 删除默认图标 } }, - 'core': { - 'check_callback': true, - "multiple": false, - 'animation': 0, - "data": window.documentCategory + 'core' : { + 'check_callback' : true, + "multiple" : false, + 'animation' : 0, + "data" : window.documentCategory }, - "contextmenu": { - show_at_node: false, - select_node: false, - "items": { - "添加文档": { - "separator_before": false, - "separator_after": true, - "_disabled": false, - "label": "添加文档", - "icon": "fa fa-plus", - "action": function (data) { - + "contextmenu" : { + show_at_node : false, + select_node : false, + "items" : { + "添加文档" : { + "separator_before" : false, + "separator_after" : true, + "_disabled" : false, + "label" : "添加文档", + "icon" : "fa fa-plus", + "action" : function (data) { var inst = $.jstree.reference(data.reference), node = inst.get_node(data.reference); openCreateCatalogDialog(node); } }, - "编辑": { - "separator_before": false, - "separator_after": true, - "_disabled": false, - "label": "编辑", - "icon": "fa fa-edit", - "action": function (data) { + "编辑" : { + "separator_before" : false, + "separator_after" : true, + "_disabled" : false, + "label" : "编辑", + "icon" : "fa fa-edit", + "action" : function (data) { var inst = $.jstree.reference(data.reference); var node = inst.get_node(data.reference); openEditCatalogDialog(node); } }, - "删除": { - "separator_before": false, - "separator_after": true, - "_disabled": false, - "label": "删除", - "icon": "fa fa-trash-o", - "action": function (data) { + "删除" : { + "separator_before" : false, + "separator_after" : true, + "_disabled" : false, + "label" : "删除", + "icon" : "fa fa-trash-o", + "action" : function (data) { var inst = $.jstree.reference(data.reference); var node = inst.get_node(data.reference); openDeleteDocumentDialog(node); @@ -347,26 +351,26 @@ $(function () { }).on('loaded.jstree', function () { window.treeCatalog = $(this).jstree(); }).on('select_node.jstree', function (node, selected, event) { - if($("#markdown-save").hasClass('change')) { - if(confirm("编辑内容未保存，需要保存吗？")){ - saveDocument(false,function () { + if ($("#markdown-save").hasClass('change')) { + if (confirm("编辑内容未保存，需要保存吗？")) { + saveDocument(false, function () { loadDocument(selected); }); return true; } } + loadDocument(selected); + }).on("move_node.jstree", jstree_save); - }).on("move_node.jstree",jstree_save); - - $("#documentTemplateModal").on("click",".section>a[data-type]",function () { + $("#documentTemplateModal").on("click", ".section>a[data-type]", function () { var $this = $(this).attr("data-type"); var body = $("#template-" + $this).html(); if (body) { window.isLoad = true; window.editor.clear(); window.editor.insertValue(body); - window.editor.setCursor({line: 0, ch: 0}); + window.editor.setCursor({ line : 0, ch : 0 }); resetEditorChanged(true); } $("#documentTemplateModal").modal('hide'); From d0a1c77c430358f0204e8a562826b6f23b6bd926 Mon Sep 17 00:00:00 2001 From: Dandy Cheung Date: Mon, 8 Jan 2018 16:36:30 +0800 Subject: [PATCH 2/3] =?UTF-8?q?1=E3=80=81=E6=A0=BC=E5=BC=8F=E5=8C=96?= =?UTF-8?q?=E4=BA=86=20markdown.js=20=E7=9A=84=E4=BB=A3=E7=A0=81=EF=BC=9B2?= =?UTF-8?q?=E3=80=81=E6=96=87=E6=A1=A3=E9=98=85=E8=AF=BB=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E4=B8=AD=E5=A2=9E=E5=8A=A0=E4=BA=86=E5=88=86=E9=9A=94=E6=9D=A1?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- static/js/markdown.js | 154 ++++++++++++++-------------- static/js/splitbar.js | 176 ++++++++++++++++++++++++++++++++ views/document/default_read.tpl | 11 +- 3 files changed, 259 insertions(+), 82 deletions(-) create mode 100644 static/js/splitbar.js diff --git a/static/js/markdown.js b/static/js/markdown.js index 55c44fc5..a6b7f0c6 100644 --- a/static/js/markdown.js +++ b/static/js/markdown.js @@ -1,32 +1,32 @@ $(function () { window.addDocumentModalFormHtml = $(this).find("form").html(); window.editor = editormd("docEditor", { - width : "100%", - height : "100%", - path : "/static/editor.md/lib/", - toolbar : true, - placeholder : "本编辑器支持 Markdown 编辑，左边编写，右边预览。", - imageUpload : true, - imageFormats : ["jpg", "jpeg", "gif", "png", "JPG", "JPEG", "GIF", "PNG"], - imageUploadURL : window.imageUploadURL, - toolbarModes : "full", - fileUpload : true, - fileUploadURL : window.fileUploadURL, - taskList : true, - flowChart : true, - htmlDecode : "style,script,iframe,title,onmouseover,onmouseout,style", - lineNumbers : false, - tocStartLevel : 1, - tocm : true, - saveHTMLToTextarea : true, + width: "100%", + height: "100%", + path: "/static/editor.md/lib/", + toolbar: true, + placeholder: "本编辑器支持 Markdown 编辑，左边编写，右边预览。", + imageUpload: true, + imageFormats: ["jpg", "jpeg", "gif", "png", "JPG", "JPEG", "GIF", "PNG"], + imageUploadURL: window.imageUploadURL, + toolbarModes: "full", + fileUpload: true, + fileUploadURL: window.fileUploadURL, + taskList: true, + flowChart: true, + htmlDecode: "style,script,iframe,title,onmouseover,onmouseout,style", + lineNumbers: false, + tocStartLevel: 1, + tocm: true, + saveHTMLToTextarea: true, - onload : function() { + onload: function() { this.hideToolbar(); var keyMap = { - "Ctrl-S" : function(cm) { + "Ctrl-S": function(cm) { saveDocument(false); }, - "Cmd-S" : function(cm){ + "Cmd-S": function(cm){ saveDocument(false); }, "Ctrl-A": function(cm) { @@ -50,7 +50,7 @@ $(function () { uploadImage("docEditor", function ($state, $res) { if ($state === "before") { return layer.load(1, { - shade: [0.1,'#fff'] // 0.1 透明度的白色背景 + shade: [0.1, '#fff'] // 0.1 透明度的白色背景 }); } else if ($state === "success") { if ($res.errcode === 0) { @@ -60,7 +60,7 @@ $(function () { } }); }, - onchange : function () { + onchange: function () { resetEditorChanged(true); } }); @@ -135,7 +135,7 @@ $(function () { */ window.loadDocument = function($node) { var index = layer.load(1, { - shade: [0.1,'#fff'] // 0.1 透明度的白色背景 + shade: [0.1, '#fff'] // 0.1 透明度的白色背景 }); $.get(window.editURL + $node.node.id ).done(function (res) { @@ -147,7 +147,7 @@ $(function () { window.editor.clear(); window.editor.insertValue(res.data.markdown); window.editor.setCursor({ line : 0, ch : 0 }); - var node = { "id" : res.data.doc_id, 'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id, "text" : res.data.doc_name, "identify" : res.data.identify, "version" : res.data.version }; + var node = { "id": res.data.doc_id, 'parent': res.data.parent_id === 0 ? '#' : res.data.parent_id, "text": res.data.doc_name, "identify": res.data.identify, "version": res.data.version }; pushDocumentCategory(node); window.selectNode = node; pushVueLists(res.data.attach); @@ -187,14 +187,14 @@ $(function () { } } $.ajax({ - beforeSend : function () { - index = layer.load(1, { shade : [0.1,'#fff'] }); + beforeSend: function () { + index = layer.load(1, { shade: [0.1, '#fff'] }); }, - url : window.editURL, - data : { "identify" : window.book.identify, "doc_id" : doc_id, "markdown" : content, "html" : html, "cover" : $is_cover ? "yes" : "no", "version" : version }, - type : "post", - dataType : "json", - success : function (res) { + url: window.editURL, + data: { "identify": window.book.identify, "doc_id": doc_id, "markdown": content, "html": html, "cover": $is_cover ? "yes" : "no", "version": version }, + type: "post", + dataType: "json", + success: function (res) { layer.close(index); if (res.errcode === 0) { resetEditorChanged(false); @@ -211,7 +211,7 @@ $(function () { } } else if(res.errcode === 6005) { var confirmIndex = layer.confirm('文档已被其他人修改确定覆盖已存在的文档吗？', { - btn: ['确定','取消'] // 按钮 + btn: ['确定', '取消'] // 按钮 }, function() { layer.close(confirmIndex); saveDocument(true, callback); @@ -225,11 +225,11 @@ $(function () { function releaseBook() { $.ajax({ - url : window.releaseURL, - data : { "identify" : window.book.identify }, - type : "post", - dataType : "json", - success : function (res) { + url: window.releaseURL, + data: { "identify": window.book.identify }, + type: "post", + dataType: "json", + success: function (res) { if (res.errcode === 0) { layer.msg("发布任务已推送到任务队列，稍后将在后台执行。"); } else { @@ -259,7 +259,7 @@ $(function () { * 添加顶级文档 */ $("#addDocumentForm").ajaxForm({ - beforeSubmit : function () { + beforeSubmit: function () { var doc_name = $.trim($("#documentName").val()); if (doc_name === "") { return showError("目录名称不能为空", "#add-error-message") @@ -267,13 +267,13 @@ $(function () { $("#btnSaveDocument").button("loading"); return true; }, - success : function (res) { + success: function (res) { if (res.errcode === 0) { - var data = { "id" : res.data.doc_id, 'parent' : res.data.parent_id === 0 ? '#' : res.data.parent_id , "text" : res.data.doc_name, "identify" : res.data.identify, "version" : res.data.version }; + var data = { "id": res.data.doc_id, 'parent': res.data.parent_id === 0 ? '#' : res.data.parent_id , "text": res.data.doc_name, "identify": res.data.identify, "version": res.data.version }; var node = window.treeCatalog.get_node(data.id); if (node) { - window.treeCatalog.rename_node({ "id" : data.id }, data.text); + window.treeCatalog.rename_node({ "id": data.id }, data.text); } else { window.treeCatalog.create_node(data.parent, data); window.treeCatalog.deselect_all(); @@ -293,54 +293,54 @@ $(function () { * 文档目录树 */ $("#sidebar").jstree({ - 'plugins' : ["wholerow", "types", 'dnd', 'contextmenu'], - "types" : { - "default" : { - "icon" : false // 删除默认图标 + 'plugins': ["wholerow", "types", 'dnd', 'contextmenu'], + "types": { + "default": { + "icon": false // 删除默认图标 } }, - 'core' : { - 'check_callback' : true, - "multiple" : false, - 'animation' : 0, - "data" : window.documentCategory + 'core': { + 'check_callback': true, + "multiple": false, + 'animation': 0, + "data": window.documentCategory }, - "contextmenu" : { - show_at_node : false, - select_node : false, - "items" : { - "添加文档" : { - "separator_before" : false, - "separator_after" : true, - "_disabled" : false, - "label" : "添加文档", - "icon" : "fa fa-plus", - "action" : function (data) { + "contextmenu": { + show_at_node: false, + select_node: false, + "items": { + "添加文档": { + "separator_before": false, + "separator_after": true, + "_disabled": false, + "label": "添加文档", + "icon": "fa fa-plus", + "action": function (data) { var inst = $.jstree.reference(data.reference), node = inst.get_node(data.reference); openCreateCatalogDialog(node); } }, - "编辑" : { - "separator_before" : false, - "separator_after" : true, - "_disabled" : false, - "label" : "编辑", - "icon" : "fa fa-edit", - "action" : function (data) { + "编辑": { + "separator_before": false, + "separator_after": true, + "_disabled": false, + "label": "编辑", + "icon": "fa fa-edit", + "action": function (data) { var inst = $.jstree.reference(data.reference); var node = inst.get_node(data.reference); openEditCatalogDialog(node); } }, - "删除" : { - "separator_before" : false, - "separator_after" : true, - "_disabled" : false, - "label" : "删除", - "icon" : "fa fa-trash-o", - "action" : function (data) { + "删除": { + "separator_before": false, + "separator_after": true, + "_disabled": false, + "label": "删除", + "icon": "fa fa-trash-o", + "action": function (data) { var inst = $.jstree.reference(data.reference); var node = inst.get_node(data.reference); openDeleteDocumentDialog(node); @@ -370,7 +370,7 @@ $(function () { window.isLoad = true; window.editor.clear(); window.editor.insertValue(body); - window.editor.setCursor({ line : 0, ch : 0 }); + window.editor.setCursor({ line: 0, ch: 0 }); resetEditorChanged(true); } $("#documentTemplateModal").modal('hide'); diff --git a/static/js/splitbar.js b/static/js/splitbar.js new file mode 100644 index 00000000..c4effcfa --- /dev/null +++ b/static/js/splitbar.js @@ -0,0 +1,176 @@ +$(function () { + var splitBar = { + // 设置当前屏幕为 840px 时将分割条隐藏 + maxWidth: 840, + + // 父元素选择器 + parentSelector: '.manual-body', + + /** + * 初始化分割条 + */ + init: function () { + var self = this; + $(self.parentSelector) + .append( + $('\ +
\ + \ +
\ + ') + .hover( + function (event) { + event.target.style.background = '#8f949ad8'; + }, + function (event) { + event.target.style.background = ''; + } + ) + ); + + self.loadingHtml(); + + // 设置媒体查询 + mediaMatcher.set(); + }, + + /** + * 加载页面时设置分割条是否显示 + */ + loadingHtml: function () { + var self = this; + var htmlWidth = document.body.clientWidth; + if (htmlWidth <= self.maxWidth) $('#manual-vsplitbar').css('display', 'none'); + }, + + /** + * 在打开关闭菜单事初始化左右窗口和分割条 + */ + reset: function () { + if (isFullScreen) { + // 关闭菜单时，初始化左右窗口 + $('#manual-vsplitbar').css('display', 'none'); + splitBar.inMaxWidthReset(); + $('.manual-left').css('width', '0px'); + } else { + // 打开菜单时，初始化左右窗口 + $('#manual-vsplitbar').css('display', 'block'); + splitBar.outMaxWidthReset(); + } + }, + + /** + * 屏幕小于等于 840px，重置左右窗口 + */ + inMaxWidthReset: function () { + $('#manual-vsplitbar').css('display', 'none'); + $('.m-manual.manual-reader .manual-right').css('left', '0'); + $('.manual-left').css('width', '280px'); + }, + + /** + * 屏幕大于 840px，重置左右窗口 + */ + outMaxWidthReset: function () { + $('.manual-right').css('left', '279px'); + $('.manual-left').css('width', '279px'); + $('#manual-vsplitbar').css('left', '275px').css('display', 'block'); + } + } + + /** + * 设置媒体查询 + * 分割条隐藏 + */ + var mediaMatcher = { + mql: window.matchMedia('(max-width:' + splitBar.maxWidth + 'px)'), + + /** + * 添加媒体查询监听事件 + */ + set: function () { + var self = this; + self.mql.addListener(self.mqCallback); + }, + + /** + * 删除媒体查询监听事件 + */ + remove: function () { + var self = this; + self.mql.removeListener(self.mqCallback); + }, + + /** + * 媒体查询回调函数 + */ + mqCallback: function (event) { + if (event.target.matches) { // 宽度小于等于 840 像素 + $(".m-manual").removeClass('manual-fullscreen-active'); + splitBar.inMaxWidthReset(); + } else { // 宽度大于 840 像素 + splitBar.outMaxWidthReset(); + } + } + } + + // 初始化分割条 + splitBar.init(); + + /** + * 控制菜单宽度 + * 最小为 140px + */ + $('#manual-vsplitbar').on('mousedown', function (e) { + var bodyEle = $('.manual-body')[0]; + + var leftPane = $('.manual-left')[0]; + var splitBar = $('#manual-vsplitbar')[0]; + var rightPane = $('.manual-right')[0]; + + var disX = (e || event).clientX; + + splitBar.left = splitBar.offsetLeft; + + var docMouseMove = document.onmousemove; + var docMouseUp = document.onmouseup; + + document.onmousemove = function (e) { + var curPos = splitBar.left + ((e || event).clientX - disX); + var maxPos = bodyEle.clientWidth - splitBar.offsetWidth; + + curPos > maxPos && (curPos = maxPos); + curPos < 140 && (curPos = 140); + + leftPane.style.width = curPos + "px"; + splitBar.style.left = curPos - 3 + "px"; + rightPane.style.left = curPos + 3 + "px"; + + return false; + } + + document.onmouseup = function () { + document.onmousemove = docMouseMove; + document.onmouseup = docMouseUp; + splitBar.releaseCapture && splitBar.releaseCapture(); + }; + + splitBar.setCapture && splitBar.setCapture(); + return false; + }); + + /** + * 关闭侧边栏时，同步分割条； + */ + $(".manual-fullscreen-switch").on("click", splitBar.reset); +}); diff --git a/views/document/default_read.tpl b/views/document/default_read.tpl index c886ea72..d88f59af 100644 --- a/views/document/default_read.tpl +++ b/views/document/default_read.tpl @@ -230,11 +230,12 @@ - - - - - + + + + + +