to-be-integrated/third-party/codemirror-3.15/demo/closebrackets.html

   1 <!doctype html>
   2 <html>
   3   <head>
   4     <meta charset="utf-8">
   5     <title>CodeMirror: Closebrackets Demo</title>
   6     <link rel="stylesheet" href="../lib/codemirror.css">
   7     <script src="../lib/codemirror.js"></script>
   8     <script src="../addon/edit/closebrackets.js"></script>
   9     <script src="../mode/javascript/javascript.js"></script>
  10     <link rel="stylesheet" href="../doc/docs.css">
  11     <style type="text/css">
  12       .CodeMirror {border-top: 1px solid #888; border-bottom: 1px solid #888;}
  13     </style>
  14   </head>
  15   <body>
  16
  17     <h1>CodeMirror: Closebrackets Demo</h1>
  18
  19     <p>Type a bracket like '[', '(', '{', '&quot;', or '''
  20     and <a href="../doc/manual.html#addon_closebrackets">the addon</a>
  21     will auto-close it. Type the closing variant when directly in
  22     front of a matching character and it will overwrite it.</p>
  23
  24     <p>If you backspace over a starting bracket while inside empty brackets
  25     (e.g. <code>{|}</code>), it will delete the closing bracket for you.</p>
  26
  27
  28     <form><textarea id="code" name="code">(function() {
  29   var DEFAULT_BRACKETS = "()[]{}''\"\"";
  30
  31   CodeMirror.defineOption("autoCloseBrackets", false, function(cm, val, old) {
  32     var wasOn = old && old != CodeMirror.Init;
  33     if (val && !wasOn)
  34       cm.addKeyMap(buildKeymap(typeof val == "string" ? val : DEFAULT_BRACKETS));
  35     else if (!val && wasOn)
  36       cm.removeKeyMap("autoCloseBrackets");
  37   });
  38
  39   function buildKeymap(pairs) {
  40     var map = {name : "autoCloseBrackets"};
  41     for (var i = 0; i < pairs.length; i += 2) (function(left, right) {
  42       function maybeOverwrite(cm) {
  43         var cur = cm.getCursor(), ahead = cm.getRange(cur, CodeMirror.Pos(cur.line, cur.ch + 1));
  44         if (ahead != right) return CodeMirror.Pass;
  45         else cm.execCommand("goCharRight");
  46       }
  47       map["'" + left + "'"] = function(cm) {
  48         if (left == right && maybeOverwrite(cm) != CodeMirror.Pass) return;
  49         var cur = cm.getCursor(), ahead = CodeMirror.Pos(cur.line, cur.ch + 1);
  50         cm.replaceSelection(left + right, {head: ahead, anchor: ahead});
  51       };
  52       if (left != right) map["'" + right + "'"] = maybeOverwrite;
  53     })(pairs.charAt(i), pairs.charAt(i + 1));
  54     return map;
  55   }
  56 })();
  57 </textarea></form>
  58
  59     <script type="text/javascript">
  60       var editor = CodeMirror.fromTextArea(document.getElementById("code"), {autoCloseBrackets: true});
  61     </script>
  62   </body>
  63 </html>