editor.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <!-- Special modification for NotepadA system, ArOZ Online Beta-->
  4. <head>
  5. <meta charset="UTF-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <title id='pageTitle'>NotepadA - Loading</title>
  8. <script src='../../script/jquery.min.js'></script>
  9. <script>
  10. $('body').css('background-color','white');
  11. function checkIsSaved(){
  12. return true;
  13. }
  14. </script>
  15. <script src="../../script/jquery.min.js"></script>
  16. <style type="text/css" media="screen">
  17. body {
  18. overflow: hidden;
  19. padding-bottom:5px;
  20. background-color:#2b2b2b;
  21. }
  22. #editor {
  23. margin: 0;
  24. position: absolute;
  25. top: 0;
  26. bottom: 15px;
  27. left: 0;
  28. right: 0;
  29. }
  30. </style>
  31. </head>
  32. <body>
  33. <pre id="editor"></pre>
  34. <script src="src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
  35. <script>
  36. //Get the filename, path and other information from the hash
  37. var filename = "";
  38. var filepath = "";
  39. var lastSave = "";
  40. var fontsize = 12;
  41. var theme = "github";
  42. var tabid = "";
  43. var editor = undefined;
  44. window.onhashchange = function(e){
  45. initEditor();
  46. }
  47. initEditor();
  48. function initEditor(){
  49. if (window.location.hash.length > 0){
  50. var payload = window.location.hash.substr(1);
  51. payload = JSON.parse(decodeURIComponent(payload));
  52. filepath = payload.filename;
  53. let basename = payload.filename.split("/").pop();
  54. filename = basename;
  55. fontsize = payload.fontsize;
  56. theme = payload.theme;
  57. tabid = payload.tabid;
  58. console.log("NotepadA editor loaded: ", payload);
  59. //Load the content of the file
  60. $.get("../../media?file=" + filepath, function(fileContent){
  61. if (fileContent.error !== undefined){
  62. //Failed to get file
  63. setTimeout(function(){
  64. parent.removeTab(tabid);
  65. },300);
  66. return
  67. }
  68. $("#editor").text(fileContent);
  69. //Start the editor if not started
  70. if (editor == undefined){
  71. StartEditor();
  72. }
  73. });
  74. }else{
  75. alert("Invalid use of editor!")
  76. }
  77. }
  78. document.addEventListener("mousedown", function(event) {
  79. //When click on this document, focus this
  80. if (parent.ao_module_virtualDesktop){
  81. parent.ao_module_focus();
  82. }
  83. }, true);
  84. function StartEditor(){
  85. //Init editor
  86. editor = ace.edit("editor");
  87. editor.setTheme("ace/theme/" + theme);
  88. var detectMode = getMode(filepath);
  89. //console.log("[NotepadA] Chaning mode to " + detectMode.toLowerCase());
  90. if ( detectMode != undefined){
  91. editor.session.setMode("ace/mode/" + detectMode.toLowerCase());
  92. }else{
  93. //Default mode: php
  94. editor.session.setMode("ace/mode/php");
  95. }
  96. editor.setOptions({
  97. //fontFamily: "tahoma",
  98. fontSize: fontsize + "pt"
  99. });
  100. lastSave = editor.getValue();
  101. }
  102. //Listener for Ctrl+S
  103. $(window).keypress(function(event) {
  104. if (!(event.which == 115 && event.ctrlKey) && !(event.which == 19)) return true;
  105. //console.log(filepath);
  106. Save();
  107. event.preventDefault();
  108. return false;
  109. });
  110. $(document).on("click","#editor",function() {
  111. //Hide the parent window in NotepadA condition
  112. window.parent.hideToggleMenu();
  113. });
  114. function Print() {
  115. try {
  116. var printWindow = window.open("", "", "height=400,width=800");
  117. printWindow.document.write(`<html><head><title>${filename} ${new Date().toLocaleString()}</title>`);
  118. printWindow.document.write("</head><xmp>");
  119. printWindow.document.write(editor.getSession().getDocument().getValue());
  120. printWindow.document.write("</xmp></html>");
  121. printWindow.document.close();
  122. printWindow.print();
  123. }catch (ex) {
  124. console.error("Error: " + ex.message);
  125. }
  126. }
  127. //Absolute path is used for saving. So no need to worry about the relative path over php issues
  128. function Save(){
  129. code = editor.getValue();
  130. parent.ao_module_agirun(parent.moduleRootPath + "backend/filesaver.js", {
  131. filepath: filepath,
  132. content: code
  133. }, function(data){
  134. if (data.error == undefined){
  135. //Finish writting to the file
  136. console.log("%c[NotepadA] " + filename + " -> Saved!","color:#1265ea");
  137. lastSave = code;
  138. }else{
  139. alert(data.error);
  140. console.log(data);
  141. }
  142. })
  143. /*
  144. $.post("../writeCode.php", { filename: filepath, content: code })
  145. .done(function( data ) {
  146. if (data.includes("ERROR") == false){
  147. console.log("%c[NotepadA] " + filename + " -> Saved!","color:#1265ea");
  148. lastSave = code;
  149. }else{
  150. console.log(data);
  151. }
  152. });
  153. */
  154. }
  155. function getDocWidth(){
  156. return $(document).width();
  157. }
  158. function checkIsSaved(){
  159. if (typeof(editor) == "undefined"){
  160. //Editor not started
  161. return
  162. }
  163. if (lastSave == editor.getValue()){
  164. return true;
  165. }else{
  166. return false;
  167. }
  168. }
  169. function insertChar(text){
  170. editor.session.insert(editor.getCursorPosition(), text);
  171. }
  172. function getEditorContenet(){
  173. return editor.getValue();
  174. }
  175. function getFilepath(){
  176. return (filepath);
  177. }
  178. function openInNewTab(){
  179. window.open("../../media?file=" + filepath);
  180. }
  181. function getSelectedText(){
  182. return editor.getSession().doc.getTextRange(editor.selection.getRange());
  183. }
  184. function insertGivenText(text){
  185. editor.session.insert(editor.getCursorPosition(), text);
  186. }
  187. function callUndo(){
  188. editor.getSession().getUndoManager().undo();
  189. }
  190. function callRedo(){
  191. editor.getSession().getUndoManager().redo();
  192. }
  193. var nameOverrides = {
  194. ObjectiveC: "Objective-C",
  195. CSharp: "C#",
  196. golang: "Go",
  197. C_Cpp: "C and C++",
  198. Csound_Document: "Csound Document",
  199. Csound_Orchestra: "Csound",
  200. Csound_Score: "Csound Score",
  201. coffee: "CoffeeScript",
  202. HTML_Ruby: "HTML (Ruby)",
  203. HTML_Elixir: "HTML (Elixir)",
  204. FTL: "FreeMarker"
  205. };
  206. function startSearchBox(){
  207. editor.execCommand("find");
  208. }
  209. function getMode(filePath){
  210. var ext = filePath.split(".").pop();
  211. var supportedModes = {
  212. ABAP: ["abap"],
  213. ABC: ["abc"],
  214. ActionScript:["as"],
  215. ADA: ["ada|adb"],
  216. Apache_Conf: ["^htaccess|^htgroups|^htpasswd|^conf|htaccess|htgroups|htpasswd"],
  217. AsciiDoc: ["asciidoc|adoc"],
  218. ASL: ["dsl|asl"],
  219. Assembly_x86:["asm|a"],
  220. AutoHotKey: ["ahk"],
  221. BatchFile: ["bat|cmd"],
  222. Bro: ["bro"],
  223. C_Cpp: ["cpp|c|cc|cxx|h|hh|hpp|ino"],
  224. C9Search: ["c9search_results"],
  225. Cirru: ["cirru|cr"],
  226. Clojure: ["clj|cljs"],
  227. Cobol: ["CBL|COB"],
  228. coffee: ["coffee|cf|cson|^Cakefile"],
  229. ColdFusion: ["cfm"],
  230. CSharp: ["cs"],
  231. Csound_Document: ["csd"],
  232. Csound_Orchestra: ["orc"],
  233. Csound_Score: ["sco"],
  234. CSS: ["css"],
  235. Curly: ["curly"],
  236. D: ["d|di"],
  237. Dart: ["dart"],
  238. Diff: ["diff|patch"],
  239. Dockerfile: ["^Dockerfile"],
  240. Dot: ["dot"],
  241. Drools: ["drl"],
  242. Edifact: ["edi"],
  243. Eiffel: ["e|ge"],
  244. EJS: ["ejs"],
  245. Elixir: ["ex|exs"],
  246. Elm: ["elm"],
  247. Erlang: ["erl|hrl"],
  248. Forth: ["frt|fs|ldr|fth|4th"],
  249. Fortran: ["f|f90"],
  250. FTL: ["ftl"],
  251. Gcode: ["gcode"],
  252. Gherkin: ["feature"],
  253. Gitignore: ["^.gitignore"],
  254. Glsl: ["glsl|frag|vert"],
  255. Gobstones: ["gbs"],
  256. golang: ["go"],
  257. GraphQLSchema: ["gql"],
  258. Groovy: ["groovy"],
  259. HAML: ["haml"],
  260. Handlebars: ["hbs|handlebars|tpl|mustache"],
  261. Haskell: ["hs"],
  262. Haskell_Cabal: ["cabal"],
  263. haXe: ["hx"],
  264. Hjson: ["hjson"],
  265. HTML: ["html|htm|xhtml|vue|we|wpy"],
  266. HTML_Elixir: ["eex|html.eex"],
  267. HTML_Ruby: ["erb|rhtml|html.erb"],
  268. INI: ["ini|conf|cfg|prefs"],
  269. Io: ["io"],
  270. Jack: ["jack"],
  271. Jade: ["jade|pug"],
  272. Java: ["java"],
  273. JavaScript: ["js|jsm|jsx"],
  274. JSON: ["json"],
  275. JSONiq: ["jq"],
  276. JSP: ["jsp"],
  277. JSSM: ["jssm|jssm_state"],
  278. JSX: ["jsx"],
  279. Julia: ["jl"],
  280. Kotlin: ["kt|kts"],
  281. LaTeX: ["tex|latex|ltx|bib"],
  282. LESS: ["less"],
  283. Liquid: ["liquid"],
  284. Lisp: ["lisp"],
  285. LiveScript: ["ls"],
  286. LogiQL: ["logic|lql"],
  287. LSL: ["lsl"],
  288. Lua: ["lua"],
  289. LuaPage: ["lp"],
  290. Lucene: ["lucene"],
  291. Makefile: ["^Makefile|^GNUmakefile|^makefile|^OCamlMakefile|make"],
  292. Markdown: ["md|markdown"],
  293. Mask: ["mask"],
  294. MATLAB: ["matlab"],
  295. Maze: ["mz"],
  296. MEL: ["mel"],
  297. MIXAL: ["mixal"],
  298. MUSHCode: ["mc|mush"],
  299. MySQL: ["mysql"],
  300. Nix: ["nix"],
  301. NSIS: ["nsi|nsh"],
  302. ObjectiveC: ["m|mm"],
  303. OCaml: ["ml|mli"],
  304. Pascal: ["pas|p"],
  305. Perl: ["pl|pm"],
  306. pgSQL: ["pgsql"],
  307. PHP: ["php|phtml|shtml|php3|php4|php5|phps|phpt|aw|ctp|module"],
  308. Pig: ["pig"],
  309. Powershell: ["ps1"],
  310. Praat: ["praat|praatscript|psc|proc"],
  311. Prolog: ["plg|prolog"],
  312. Properties: ["properties"],
  313. Protobuf: ["proto"],
  314. Python: ["py"],
  315. R: ["r"],
  316. Razor: ["cshtml|asp"],
  317. RDoc: ["Rd"],
  318. Red: ["red|reds"],
  319. RHTML: ["Rhtml"],
  320. RST: ["rst"],
  321. Ruby: ["rb|ru|gemspec|rake|^Guardfile|^Rakefile|^Gemfile"],
  322. Rust: ["rs"],
  323. SASS: ["sass"],
  324. SCAD: ["scad"],
  325. Scala: ["scala"],
  326. Scheme: ["scm|sm|rkt|oak|scheme"],
  327. SCSS: ["scss"],
  328. SH: ["sh|bash|^.bashrc"],
  329. SJS: ["sjs"],
  330. Smarty: ["smarty|tpl"],
  331. snippets: ["snippets"],
  332. Soy_Template:["soy"],
  333. Space: ["space"],
  334. SQL: ["sql"],
  335. SQLServer: ["sqlserver"],
  336. Stylus: ["styl|stylus"],
  337. SVG: ["svg"],
  338. Swift: ["swift"],
  339. Tcl: ["tcl"],
  340. Tex: ["tex"],
  341. Text: ["txt"],
  342. Textile: ["textile"],
  343. Toml: ["toml"],
  344. TSX: ["tsx"],
  345. Twig: ["twig|swig"],
  346. Typescript: ["ts|typescript|str"],
  347. Vala: ["vala"],
  348. VBScript: ["vbs|vb"],
  349. Velocity: ["vm"],
  350. Verilog: ["v|vh|sv|svh"],
  351. VHDL: ["vhd|vhdl"],
  352. Wollok: ["wlk|wpgm|wtest"],
  353. XML: ["xml|rdf|rss|wsdl|xslt|atom|mathml|mml|xul|xbl|xaml"],
  354. XQuery: ["xq"],
  355. YAML: ["yaml|yml"],
  356. Django: ["html"]
  357. };
  358. for (var key in supportedModes) {
  359. if (supportedModes.hasOwnProperty(key)) {
  360. var thisExtension = supportedModes[key][0].split("|");
  361. if (thisExtension.length == 1){
  362. if (ext == thisExtension[0]){
  363. return key;
  364. }
  365. }else{
  366. for(var i =0; i < thisExtension.length;i++){
  367. if (ext == thisExtension[i]){
  368. return key;
  369. }
  370. }
  371. }
  372. }
  373. }
  374. }
  375. $(window).bind('keydown', function(event) {
  376. if (event.ctrlKey || event.metaKey) {
  377. switch (String.fromCharCode(event.which).toLowerCase()) {
  378. case 's':
  379. event.preventDefault();
  380. Save();
  381. break;
  382. }
  383. }
  384. });
  385. </script>
  386. </body>
  387. </html>