Spaces:
Running
Running
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>CodeMirror: XML Autocomplete Demo</title> | |
| <link rel="stylesheet" href="../lib/codemirror.css"> | |
| <script src="../lib/codemirror.js"></script> | |
| <script src="../addon/hint/show-hint.js"></script> | |
| <link rel="stylesheet" href="../addon/hint/show-hint.css"> | |
| <script src="../addon/edit/closetag.js"></script> | |
| <script src="../addon/hint/xml-hint.js"></script> | |
| <script src="../mode/xml/xml.js"></script> | |
| <link rel="stylesheet" href="../doc/docs.css"> | |
| <style type="text/css"> | |
| .CodeMirror { border: 1px solid #eee; height: auto; } | |
| .CodeMirror-scroll { overflow-y: hidden; overflow-x: auto; } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>CodeMirror: XML Autocomplete demo</h1> | |
| <form><textarea id="code" name="code"></textarea></form> | |
| <p>Type '<' or space inside tag or | |
| press <strong>ctrl-space</strong> to activate autocompletion. See | |
| the code (<a href="../addon/hint/show-hint.js">here</a> | |
| and <a href="../addon/hint/xml-hint.js">here</a>) to figure out how | |
| it works.</p> | |
| <script> | |
| CodeMirror.xmlHints['<'] = [ | |
| 'levelTop', | |
| 'levelRoot', | |
| 'mainLevel' | |
| ]; | |
| CodeMirror.xmlHints['<levelTop '] = | |
| CodeMirror.xmlHints['<levelRoot '] = | |
| CodeMirror.xmlHints['<mainLevel '] = [ | |
| 'property1111', | |
| 'property2222' | |
| ]; | |
| CodeMirror.xmlHints['<levelTop><'] = | |
| CodeMirror.xmlHints['<levelRoot><'] = | |
| CodeMirror.xmlHints['<mainLevel><'] = [ | |
| 'second', | |
| 'two' | |
| ]; | |
| CodeMirror.xmlHints['<levelTop><second '] = [ | |
| 'secondProperty' | |
| ]; | |
| CodeMirror.xmlHints['<levelTop><second><'] = [ | |
| 'three', | |
| 'x-three' | |
| ]; | |
| CodeMirror.commands.autocomplete = function(cm) { | |
| CodeMirror.showHint(cm, CodeMirror.xmlHint); | |
| } | |
| function passAndHint(cm) { | |
| setTimeout(function() {cm.execCommand("autocomplete");}, 100); | |
| return CodeMirror.Pass; | |
| } | |
| var editor = CodeMirror.fromTextArea(document.getElementById("code"), { | |
| value: '', | |
| mode: 'text/html', | |
| lineNumbers: true, | |
| extraKeys: { | |
| "' '": passAndHint, | |
| "'<'": passAndHint, | |
| "Ctrl-Space": "autocomplete" | |
| }, | |
| autoCloseTags: true | |
| }); | |
| </script> | |
| </body> | |
| </html> | |