notebook.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. <html>
  2. <head>
  3. <title>Text Reader</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. $(window).on("keydown",function(event) {
  25. if (event.which == 83 && event.ctrlKey){
  26. event.preventDefault();
  27. saveText();
  28. }
  29. });
  30. if (files !== null && files.length > 0){
  31. //Set the window name
  32. ao_module_setWindowTitle("Notebook - " + files[0].filename);
  33. //Check if there are more than 1 text files to be opened. If yes, open new windows.
  34. if (files.length > 1){
  35. for (var i = 1; i < files.length; i++){
  36. var thisFilelist = [{
  37. filename: files[i].filename,
  38. filepath: files[i].filepath
  39. }];
  40. thisFilelist = encodeURIComponent(JSON.stringify(thisFilelist));
  41. ao_module_newfw({
  42. url: "SystemAO/utilities/notebook.html#" + thisFilelist,
  43. width: 1080,
  44. height: 580,
  45. appicon: "SystemAO/utilities/img/notebook.png",
  46. title: "Notebook",
  47. });
  48. }
  49. }
  50. filepath = files[0].filepath;
  51. //Load the file into the textarea
  52. $.get("../../media?file=" + files[0].filepath,function(data){
  53. $("#maintext").text(data);
  54. //Load Markdown Editor
  55. simplemde = new SimpleMDE({
  56. autofocus: true,
  57. element: document.getElementById("maintext"),
  58. forceSync: true,
  59. insertTexts: {
  60. horizontalRule: ["", "\n\n-----\n\n"],
  61. image: ["![](http://", ")"],
  62. link: ["[", "](http://)"],
  63. table: ["", "\n\n| Column 1 | Column 2 | Column 3 |\n| -------- | -------- | -------- |\n| Text | Text | Text |\n\n"],
  64. },
  65. placeholder: "(Empty file)",
  66. //promptURLs: true,
  67. renderingConfig: {
  68. singleLineBreaks: true,
  69. codeSyntaxHighlighting: true,
  70. },
  71. toolbar: ["bold","italic","heading","|","code","quote","unordered-list","ordered-list","|","link","image","table","|","preview","side-by-side","fullscreen","|",
  72. {
  73. name: "savebtn",
  74. action: function(){
  75. saveText();
  76. },
  77. className: "fa fa-floppy-o",
  78. title: "Save",
  79. },"guide","|"],
  80. spellChecker: false,
  81. status: ["autosave", "lines", "words", "cursor"], // Optional usage
  82. });
  83. });
  84. }else{
  85. simplemde = new SimpleMDE({ element: document.getElementById("maintext") });
  86. }
  87. function saveText(){
  88. var newcontent = simplemde.value();
  89. $.ajax({
  90. url: "../../system/utils/notebook/save",
  91. data: {filepath: filepath, content: newcontent},
  92. success: function(data){
  93. console.log(data);
  94. if (data.error !== undefined){
  95. alert(data.error);
  96. }
  97. }
  98. });
  99. }
  100. </script>
  101. </body>
  102. </html>