markdown.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377
  1. $(function () {
  2. editormd.katexURL = {
  3. js : "/static/katex/katex",
  4. css : "/static/katex/katex"
  5. };
  6. window.addDocumentModalFormHtml = $(this).find("form").html();
  7. window.editor = editormd("docEditor", {
  8. width: "100%",
  9. height: "100%",
  10. path: "/static/editor.md/lib/",
  11. toolbar: true,
  12. placeholder: "本编辑器支持 Markdown 编辑,左边编写,右边预览。",
  13. imageUpload: true,
  14. imageFormats: ["jpg", "jpeg", "gif", "png", "JPG", "JPEG", "GIF", "PNG"],
  15. imageUploadURL: window.imageUploadURL,
  16. toolbarModes: "full",
  17. fileUpload: true,
  18. fileUploadURL: window.fileUploadURL,
  19. taskList: true,
  20. flowChart: true,
  21. htmlDecode: "style,script,iframe,title,onmouseover,onmouseout,style",
  22. lineNumbers: false,
  23. sequenceDiagram: true,
  24. tocStartLevel: 1,
  25. tocm: true,
  26. tex:true,
  27. saveHTMLToTextarea: true,
  28. onload: function() {
  29. this.hideToolbar();
  30. var keyMap = {
  31. "Ctrl-S": function(cm) {
  32. saveDocument(false);
  33. },
  34. "Cmd-S": function(cm){
  35. saveDocument(false);
  36. },
  37. "Ctrl-A": function(cm) {
  38. cm.execCommand("selectAll");
  39. }
  40. };
  41. this.addKeyMap(keyMap);
  42. var $select_node_id = window.treeCatalog.get_selected();
  43. if ($select_node_id) {
  44. var $select_node = window.treeCatalog.get_node($select_node_id[0])
  45. if ($select_node) {
  46. $select_node.node = {
  47. id: $select_node.id
  48. };
  49. loadDocument($select_node);
  50. }
  51. }
  52. uploadImage("docEditor", function ($state, $res) {
  53. if ($state === "before") {
  54. return layer.load(1, {
  55. shade: [0.1, '#fff'] // 0.1 透明度的白色背景
  56. });
  57. } else if ($state === "success") {
  58. if ($res.errcode === 0) {
  59. var value = '![](' + $res.url + ')';
  60. window.editor.insertValue(value);
  61. }
  62. }
  63. });
  64. },
  65. onchange: function () {
  66. resetEditorChanged(true);
  67. }
  68. });
  69. /**
  70. * 实现标题栏操作
  71. */
  72. $("#editormd-tools").on("click", "a[class!='disabled']", function () {
  73. var name = $(this).find("i").attr("name");
  74. if (name === "attachment") {
  75. $("#uploadAttachModal").modal("show");
  76. } else if (name === "history") {
  77. window.documentHistory();
  78. } else if (name === "save") {
  79. saveDocument(false);
  80. } else if (name === "template") {
  81. $("#documentTemplateModal").modal("show");
  82. } else if (name === "sidebar") {
  83. $("#manualCategory").toggle(0, "swing", function () {
  84. var $then = $("#manualEditorContainer");
  85. var left = parseInt($then.css("left"));
  86. if (left > 0) {
  87. window.editorContainerLeft = left;
  88. $then.css("left", "0");
  89. } else {
  90. $then.css("left", window.editorContainerLeft + "px");
  91. }
  92. window.editor.resize();
  93. });
  94. } else if (name === "release") {
  95. if (Object.prototype.toString.call(window.documentCategory) === '[object Array]' && window.documentCategory.length > 0) {
  96. if ($("#markdown-save").hasClass('change')) {
  97. var comfirm_result = confirm("编辑内容未保存,需要保存吗?")
  98. if (comfirm_result) {
  99. saveDocument(false, releaseBook);
  100. return;
  101. }
  102. }
  103. releaseBook();
  104. } else {
  105. layer.msg("没有需要发布的文档")
  106. }
  107. } else if (name === "tasks") {
  108. // 插入 GFM 任务列表
  109. var cm = window.editor.cm;
  110. var selection = cm.getSelection();
  111. if (selection === "") {
  112. cm.replaceSelection("- [x] " + selection);
  113. } else {
  114. var selectionText = selection.split("\n");
  115. for (var i = 0, len = selectionText.length; i < len; i++) {
  116. selectionText[i] = (selectionText[i] === "") ? "" : "- [x] " + selectionText[i];
  117. }
  118. cm.replaceSelection(selectionText.join("\n"));
  119. }
  120. } else {
  121. var action = window.editor.toolbarHandlers[name];
  122. if (action !== "undefined") {
  123. $.proxy(action, window.editor)();
  124. window.editor.focus();
  125. }
  126. }
  127. }) ;
  128. /***
  129. * 加载指定的文档到编辑器中
  130. * @param $node
  131. */
  132. window.loadDocument = function($node) {
  133. var index = layer.load(1, {
  134. shade: [0.1, '#fff'] // 0.1 透明度的白色背景
  135. });
  136. $.get(window.editURL + $node.node.id ).done(function (res) {
  137. layer.close(index);
  138. if (res.errcode === 0) {
  139. window.isLoad = true;
  140. try {
  141. window.editor.clear();
  142. window.editor.insertValue(res.data.markdown);
  143. window.editor.setCursor({line: 0, ch: 0});
  144. }catch(e){
  145. console.log(e);
  146. }
  147. 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 };
  148. pushDocumentCategory(node);
  149. window.selectNode = node;
  150. pushVueLists(res.data.attach);
  151. } else {
  152. layer.msg("文档加载失败");
  153. }
  154. }).fail(function () {
  155. layer.close(index);
  156. layer.msg("文档加载失败");
  157. });
  158. };
  159. /**
  160. * 保存文档到服务器
  161. * @param $is_cover 是否强制覆盖
  162. */
  163. function saveDocument($is_cover, callback) {
  164. var index = null;
  165. var node = window.selectNode;
  166. var content = window.editor.getMarkdown();
  167. var html = window.editor.getPreviewedHTML();
  168. var version = "";
  169. if (!node) {
  170. layer.msg("获取当前文档信息失败");
  171. return;
  172. }
  173. var doc_id = parseInt(node.id);
  174. for (var i in window.documentCategory) {
  175. var item = window.documentCategory[i];
  176. if (item.id === doc_id) {
  177. version = item.version;
  178. break;
  179. }
  180. }
  181. $.ajax({
  182. beforeSend: function () {
  183. index = layer.load(1, { shade: [0.1, '#fff'] });
  184. },
  185. url: window.editURL,
  186. data: { "identify": window.book.identify, "doc_id": doc_id, "markdown": content, "html": html, "cover": $is_cover ? "yes" : "no", "version": version },
  187. type: "post",
  188. timeout : 30000,
  189. dataType: "json",
  190. success: function (res) {
  191. layer.close(index);
  192. if (res.errcode === 0) {
  193. resetEditorChanged(false);
  194. for (var i in window.documentCategory) {
  195. var item = window.documentCategory[i];
  196. if (item.id === doc_id) {
  197. window.documentCategory[i].version = res.data.version;
  198. break;
  199. }
  200. }
  201. if (typeof callback === "function") {
  202. callback();
  203. }
  204. } else if(res.errcode === 6005) {
  205. var confirmIndex = layer.confirm('文档已被其他人修改确定覆盖已存在的文档吗?', {
  206. btn: ['确定', '取消'] // 按钮
  207. }, function() {
  208. layer.close(confirmIndex);
  209. saveDocument(true, callback);
  210. });
  211. } else {
  212. layer.msg(res.message);
  213. }
  214. },
  215. error : function (XMLHttpRequest, textStatus, errorThrown) {
  216. layer.close(index);
  217. layer.msg("服务器错误:" + errorThrown);
  218. }
  219. });
  220. }
  221. /**
  222. * 设置编辑器变更状态
  223. * @param $is_change
  224. */
  225. function resetEditorChanged($is_change) {
  226. if ($is_change && !window.isLoad) {
  227. $("#markdown-save").removeClass('disabled').addClass('change');
  228. } else {
  229. $("#markdown-save").removeClass('change').addClass('disabled');
  230. }
  231. window.isLoad = false;
  232. }
  233. /**
  234. * 添加顶级文档
  235. */
  236. $("#addDocumentForm").ajaxForm({
  237. beforeSubmit: function () {
  238. var doc_name = $.trim($("#documentName").val());
  239. if (doc_name === "") {
  240. return showError("目录名称不能为空", "#add-error-message")
  241. }
  242. $("#btnSaveDocument").button("loading");
  243. return true;
  244. },
  245. success: function (res) {
  246. if (res.errcode === 0) {
  247. 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 };
  248. var node = window.treeCatalog.get_node(data.id);
  249. if (node) {
  250. window.treeCatalog.rename_node({ "id": data.id }, data.text);
  251. } else {
  252. window.treeCatalog.create_node(data.parent, data);
  253. window.treeCatalog.deselect_all();
  254. window.treeCatalog.select_node(data);
  255. }
  256. pushDocumentCategory(data);
  257. $("#markdown-save").removeClass('change').addClass('disabled');
  258. $("#addDocumentModal").modal('hide');
  259. } else {
  260. showError(res.message, "#add-error-message");
  261. }
  262. $("#btnSaveDocument").button("reset");
  263. }
  264. });
  265. /**
  266. * 文档目录树
  267. */
  268. $("#sidebar").jstree({
  269. 'plugins': ["wholerow", "types", 'dnd', 'contextmenu'],
  270. "types": {
  271. "default": {
  272. "icon": false // 删除默认图标
  273. }
  274. },
  275. 'core': {
  276. 'check_callback': true,
  277. "multiple": false,
  278. 'animation': 0,
  279. "data": window.documentCategory
  280. },
  281. "contextmenu": {
  282. show_at_node: false,
  283. select_node: false,
  284. "items": {
  285. "添加文档": {
  286. "separator_before": false,
  287. "separator_after": true,
  288. "_disabled": false,
  289. "label": "添加文档",
  290. "icon": "fa fa-plus",
  291. "action": function (data) {
  292. var inst = $.jstree.reference(data.reference),
  293. node = inst.get_node(data.reference);
  294. openCreateCatalogDialog(node);
  295. }
  296. },
  297. "编辑": {
  298. "separator_before": false,
  299. "separator_after": true,
  300. "_disabled": false,
  301. "label": "编辑",
  302. "icon": "fa fa-edit",
  303. "action": function (data) {
  304. var inst = $.jstree.reference(data.reference);
  305. var node = inst.get_node(data.reference);
  306. openEditCatalogDialog(node);
  307. }
  308. },
  309. "删除": {
  310. "separator_before": false,
  311. "separator_after": true,
  312. "_disabled": false,
  313. "label": "删除",
  314. "icon": "fa fa-trash-o",
  315. "action": function (data) {
  316. var inst = $.jstree.reference(data.reference);
  317. var node = inst.get_node(data.reference);
  318. openDeleteDocumentDialog(node);
  319. }
  320. }
  321. }
  322. }
  323. }).on('loaded.jstree', function () {
  324. window.treeCatalog = $(this).jstree();
  325. }).on('select_node.jstree', function (node, selected, event) {
  326. if ($("#markdown-save").hasClass('change')) {
  327. if (confirm("编辑内容未保存,需要保存吗?")) {
  328. saveDocument(false, function () {
  329. loadDocument(selected);
  330. });
  331. return true;
  332. }
  333. }
  334. loadDocument(selected);
  335. }).on("move_node.jstree", jstree_save);
  336. /**
  337. * 打开文档模板
  338. */
  339. $("#documentTemplateModal").on("click", ".section>a[data-type]", function () {
  340. var $this = $(this).attr("data-type");
  341. var body = $("#template-" + $this).html();
  342. if (body) {
  343. window.isLoad = true;
  344. window.editor.clear();
  345. window.editor.insertValue(body);
  346. window.editor.setCursor({ line: 0, ch: 0 });
  347. resetEditorChanged(true);
  348. }
  349. $("#documentTemplateModal").modal('hide');
  350. });
  351. });