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.

94 lines
2.9KB

  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-top: 30px;
  15. position: absolute;
  16. top: 0;
  17. bottom: 0;
  18. left: 0;
  19. right: 0;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div class="wrapper">
  25. <!--<div class="toolbar">
  26. <button id="btnSave" class="btn btn-primary btn-xs">save</button>
  27. <button id="btnUndo" class="btn btn-primary btn-xs">undo</button>
  28. <button id="btnRedo" class="btn btn-primary btn-xs">redo</button>
  29. </div>-->
  30. <div class="inner" id="editor"></div>
  31. </div>
  32. <script src="src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
  33. <script>
  34. var buildDom = ace.require("ace/lib/dom").buildDom;
  35. var editor = ace.edit("editor");
  36. editor.setOptions({
  37. mode: "ace/mode/text",
  38. theme: "ace/theme/twilight",
  39. showPrintMargin: false,
  40. wrap: true,
  41. indentedSoftWrap: true,
  42. showFoldWidgets: false,
  43. showLineNumbers: true,
  44. showGutter: false,
  45. autoScrollEditorIntoView: true
  46. });
  47. function updateToolbar() {
  48. document.getElementById("btnUndo") = !editor.session.getUndoManager().hasUndo();
  49. document.getElementById("btnRedo") = !editor.session.getUndoManager().hasRedo();
  50. }
  51. editor.on("input", updateToolbar);
  52. if (localStorage.getItem("acetest") !== null) {
  53. editor.setValue(localStorage.getItem("acetest"));
  54. editor.clearSelection();
  55. }
  56. editor.getSession().on('change', function () {
  57. localStorage.setItem("acetest", editor.getSession().getValue());
  58. });
  59. function save() {
  60. alert("not yet implemented");
  61. }
  62. editor.commands.addCommand({
  63. name: "save",
  64. exec: save,
  65. bindKey: {
  66. win: "ctrl-s",
  67. mac: "cmd-s"
  68. }
  69. });
  70. $('#btnSave').onClick(function(){
  71. save();
  72. });
  73. $('#btnUndo').onClick(function(){
  74. editor.undo();
  75. });
  76. $('#btnRow').onClick(function(){
  77. editor.redo();
  78. });
  79. window.editor = editor;
  80. </script>
  81. </body>
  82. </html>