notebook.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. <html>
  2. <head>
  3. <title>Notebook</title>
  4. <script src="../script/jquery.min.js"></script>
  5. <script src="../script/ao_module.js"></script>
  6. <link rel="stylesheet" href="script/SimpleMDE/simplemde.min.css">
  7. <script src="script/SimpleMDE/simplemde.min.js"></script>
  8. <style>
  9. html, body{
  10. background-color:white;
  11. height: calc(100% - 80px);
  12. }
  13. #maintext{
  14. height:100% !important;
  15. }
  16. </style>
  17. </head>
  18. <body>
  19. <textarea id="maintext"></textarea>
  20. <script>
  21. var simplemde; //SimpleMDE editor object
  22. var filepath = ""; //Current editing filepath
  23. var files = ao_module_loadInputFiles();
  24. var originalTitle = "Notebook";
  25. var lastSaveContent = ""; //Content for last saved content
  26. $(window).on("keydown",function(event) {
  27. if (event.which == 83 && event.ctrlKey){
  28. event.preventDefault();
  29. saveText();
  30. }
  31. });
  32. if (files !== null && files.length > 0){
  33. //Set the window name
  34. ao_module_setWindowTitle("Notebook - " + files[0].filename);
  35. originalTitle = "Notebook - " + files[0].filename;
  36. //Check if there are more than 1 text files to be opened. If yes, open new windows.
  37. if (files.length > 1){
  38. for (var i = 1; i < files.length; i++){
  39. var thisFilelist = [{
  40. filename: files[i].filename,
  41. filepath: files[i].filepath
  42. }];
  43. thisFilelist = encodeURIComponent(JSON.stringify(thisFilelist));
  44. ao_module_newfw({
  45. url: "SystemAO/utilities/notebook.html#" + thisFilelist,
  46. width: 1080,
  47. height: 580,
  48. appicon: "SystemAO/utilities/img/notebook.png",
  49. title: "Notebook",
  50. });
  51. }
  52. }
  53. filepath = files[0].filepath;
  54. //Load the file into the textarea
  55. $.get("../../media?file=" + files[0].filepath,function(data){
  56. $("#maintext").text(data);
  57. lastSaveContent = data;
  58. //Load Markdown Editor
  59. simplemde = new SimpleMDE({
  60. autofocus: true,
  61. element: document.getElementById("maintext"),
  62. forceSync: true,
  63. insertTexts: {
  64. horizontalRule: ["", "\n\n-----\n\n"],
  65. image: ["![](http://", ")"],
  66. link: ["[", "](http://)"],
  67. table: ["", "\n\n| Column 1 | Column 2 | Column 3 |\n| -------- | -------- | -------- |\n| Text | Text | Text |\n\n"],
  68. },
  69. placeholder: "(Empty file)",
  70. //promptURLs: true,
  71. renderingConfig: {
  72. singleLineBreaks: true,
  73. codeSyntaxHighlighting: true,
  74. },
  75. toolbar: ["bold","italic","heading","|","code","quote","unordered-list","ordered-list","|","link","image","table","|","preview","side-by-side","fullscreen","|",
  76. {
  77. name: "savebtn",
  78. action: function(){
  79. saveText();
  80. },
  81. className: "fa fa-floppy-o",
  82. title: "Save",
  83. },"guide","|"],
  84. spellChecker: false,
  85. status: ["autosave", "lines", "words", "cursor"], // Optional usage
  86. });
  87. });
  88. }else{
  89. simplemde = new SimpleMDE({ element: document.getElementById("maintext") });
  90. }
  91. function saveText(callback=undefined){
  92. var newcontent = simplemde.value();
  93. ao_module_agirun("Notebook/filesaver.js", {
  94. filepath: filepath,
  95. content: newcontent
  96. }, function(data){
  97. console.log(data);
  98. if (data.error !== undefined){
  99. alert(data.error);
  100. }else{
  101. //Save succeed. Update last saved content
  102. lastSaveContent = newcontent;
  103. //Update the title as well
  104. ao_module_setWindowTitle(originalTitle);
  105. if (callback != undefined){
  106. callback();
  107. }
  108. }
  109. }, function(){
  110. alert("Save File Failed!")
  111. });
  112. /*
  113. $.ajax({
  114. url: "../../system/utils/notebook/save",
  115. data: {filepath: filepath, content: newcontent},
  116. success: function(data){
  117. console.log(data);
  118. if (data.error !== undefined){
  119. alert(data.error);
  120. }
  121. }
  122. });
  123. */
  124. }
  125. setInterval(function(){
  126. //Check if the content from last save matched the current value on simplemde
  127. if (!isSaved()){
  128. ao_module_setWindowTitle(originalTitle + " *");
  129. }else{
  130. //No new changes
  131. ao_module_setWindowTitle(originalTitle);
  132. }
  133. }, 1000);
  134. function isSaved(){
  135. var currentContent = simplemde.value();
  136. return (lastSaveContent == currentContent);
  137. }
  138. //Overwrite the ao_module_close function to allow
  139. if (!ao_module_virtualDesktop){
  140. window.onbeforeunload = function(){
  141. if (!isSaved()){
  142. return "Content is not saved. Confirm Exit?";
  143. }
  144. }
  145. }
  146. //Overwrite the close sequence
  147. function ao_module_close(){
  148. if (!isSaved()){
  149. //Not saved
  150. if (confirm("Some changes are not saved. Save before exit?")){
  151. saveText(function(){
  152. //Exit after save
  153. closeThisWindow();
  154. });
  155. }else{
  156. //User request not to save
  157. closeThisWindow();
  158. }
  159. }else{
  160. //Saved. Exit
  161. closeThisWindow();
  162. }
  163. }
  164. function closeThisWindow(){
  165. if (!ao_module_virtualDesktop){
  166. window.close('','_parent','');
  167. window.location.href = ao_root + "SystemAO/closeTabInsturction.html";
  168. return;
  169. }
  170. parent.closeFwProcess(ao_module_windowID);
  171. }
  172. </script>
  173. </body>
  174. </html>