markdown.js 13 KB

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