Forked from tivnet/ACE Editor: submit, beautify and minify.html
Created
March 25, 2021 22:24
-
-
Save glowinthedark/fcfe96eb0db78f277aee10325ea2375e to your computer and use it in GitHub Desktop.
ACE Editor: submit, beautify and minify
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>ACE Editor: submit, beautify and minify</title> | |
| <style type="text/css" media="screen"> | |
| #ace_js, #ace_css { | |
| width: 95%; | |
| height: 15em; | |
| border: 1px solid silver; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <form onsubmit="return on_submit()"> | |
| JS | |
| <div id="ace_js">function foo(items) { var x = "All this is syntax highlighted"; return x; }</div> | |
| <input type="hidden" id="ace_js_control" name="ace_js" value=""/> | |
| CSS | |
| <div id="ace_css">body{ /*ququ*/ color:blue; /*here*/ | |
| } a{text-decoration:none} | |
| p{width:100%; } | |
| </div> | |
| <button>Go</button> | |
| </form> | |
| <!--suppress JSUnresolvedLibraryURL --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.3.1/ace.js" | |
| integrity="sha256-m7pa1Wh06liKoIDP19avGEdTGo+LoDNxeiHhVkq2hVQ=" crossorigin="anonymous"></script> | |
| <!--suppress JSUnresolvedLibraryURL --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.7.5/beautify.min.js" | |
| integrity="sha256-z3YWAUWq4ZqhJwjqxdTFwmXUOkEPpQUpdxWHCZVADA4=" crossorigin="anonymous"></script> | |
| <!--suppress JSUnresolvedLibraryURL --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.7.5/beautify-css.min.js" | |
| integrity="sha256-j7ahmt6lLS5KOhBLZUivk4/awJlkM8eDP/CYbrCDqRA=" crossorigin="anonymous"></script> | |
| <script> | |
| var editor_js = ace.edit("ace_js", { | |
| mode: "ace/mode/javascript", | |
| minLines: 10, | |
| maxLines: 10, | |
| tabSize: 2, | |
| showPrintMargin: false | |
| }); | |
| var editor_css = ace.edit("ace_css", { | |
| mode: "ace/mode/css", | |
| minLines: 10, | |
| maxLines: 10, | |
| tabSize: 2, | |
| showPrintMargin: false | |
| }); | |
| /** | |
| * @link https://github.com/beautify-web/js-beautify | |
| */ | |
| editor_js.getSession().setValue(js_beautify(editor_js.getValue(), { | |
| indent_size: 2 | |
| })); | |
| editor_css.getSession().setValue(css_beautify(editor_css.getValue(), { | |
| indent_size: 2 | |
| })); | |
| function on_submit() { | |
| document.getElementById("ace_js_control").value = editor_js.getValue().replace(/[\s]+/g, " "); | |
| return true; | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment