You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

99 lines
3.0KB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
  7. <meta name="HandheldFriendly" content="True" />
  8. <title>Editor</title>
  9. <style type="text/css" media="screen">
  10. body {
  11. overflow: hidden;
  12. }
  13. #editor {
  14. margin: 0;
  15. position: absolute;
  16. top: 0;
  17. bottom: 0;
  18. left: 0;
  19. right: 0;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <pre id="editor"></pre>
  25. <script src="src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
  26. <script>
  27. var buildDom = ace.require("ace/lib/dom").buildDom;
  28. var editor = ace.edit("editor");
  29. editor.setOptions({
  30. mode: "ace/mode/text",
  31. theme: "ace/theme/twilight",
  32. showPrintMargin: false,
  33. wrap: true,
  34. indentedSoftWrap: true,
  35. showFoldWidgets: false,
  36. showLineNumbers: true,
  37. showGutter: false,
  38. autoScrollEditorIntoView: true
  39. });
  40. var refs = {};
  41. function updateToolbar() {
  42. refs.undoButton.disabled = !editor.session.getUndoManager().hasUndo();
  43. refs.redoButton.disabled = !editor.session.getUndoManager().hasRedo();
  44. }
  45. editor.on("input", updateToolbar);
  46. if (localStorage.getItem("acetest") !== null) {
  47. editor.setValue(localStorage.getItem("acetest"));
  48. editor.clearSelection();
  49. }
  50. editor.getSession().on('change', function () {
  51. localStorage.setItem("acetest", editor.getSession().getValue());
  52. });
  53. function save() {
  54. alert("not yet implemented");
  55. }
  56. editor.commands.addCommand({
  57. name: "save",
  58. exec: save,
  59. bindKey: {
  60. win: "ctrl-s",
  61. mac: "cmd-s"
  62. }
  63. });
  64. buildDom(["div", {
  65. class: "toolbar"
  66. },
  67. ["button", {
  68. ref: "saveButton",
  69. onclick: save
  70. }, "save"],
  71. ["button", {
  72. ref: "undoButton",
  73. onclick: function() {
  74. editor.undo();
  75. }
  76. }, "undo"],
  77. ["button", {
  78. ref: "redoButton",
  79. onclick: function() {
  80. editor.redo();
  81. }
  82. }, "redo"]
  83. ], document.body, refs);
  84. document.body.appendChild(editor.container)
  85. window.editor = editor;
  86. </script>
  87. </body>
  88. </html>