Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

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