File modules/editor/codemirror/demo/indentwrap.html

Last commit: Tue May 22 22:39:53 2018 +0200	Jan Dankert	Fix für PHP 7.2: 'Object' darf nun nicht mehr als Klassennamen verwendet werden. AUCH NICHT IN EINEM NAMESPACE! WTF, wozu habe ich das in einen verfickten Namespace gepackt? Wozu soll der sonst da sein??? Amateure. Daher nun notgedrungen unbenannt in 'BaseObject'.


     1 <!doctype html>
     2 
     3 <title>CodeMirror: Indented wrapped line demo</title>
     4 <meta charset="utf-8"/>
     5 <link rel=stylesheet href="../doc/docs.css">
     6 
     7 <link rel="stylesheet" href="../lib/codemirror.css">
     8 <script src="../lib/codemirror.js"></script>
     9 <script src="../mode/xml/xml.js"></script>
    10 <style type="text/css">
    11       .CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
    12       .CodeMirror pre > * { text-indent: 0px; }
    13     </style>
    14 <div id=nav>
    15   <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../doc/logo.png"></a>
    16 
    17   <ul>
    18     <li><a href="../index.html">Home</a>
    19     <li><a href="../doc/manual.html">Manual</a>
    20     <li><a href="https://github.com/codemirror/codemirror">Code</a>
    21   </ul>
    22   <ul>
    23     <li><a class=active href="#">Indented wrapped line</a>
    24   </ul>
    25 </div>
    26 
    27 <article>
    28 <h2>Indented wrapped line demo</h2>
    29 <form><textarea id="code" name="code">
    30 <!doctype html>
    31 <body>
    32   <h2 id="overview">Overview</h2>
    33 
    34   <p>CodeMirror is a code-editor component that can be embedded in Web pages. The core library provides <em>only</em> the editor component, no accompanying buttons, auto-completion, or other IDE functionality. It does provide a rich API on top of which such functionality can be straightforwardly implemented. See the <a href="#addons">add-ons</a> included in the distribution, and the <a href="https://github.com/jagthedrummer/codemirror-ui">CodeMirror UI</a> project, for reusable implementations of extra features.</p>
    35 
    36   <p>CodeMirror works with language-specific modes. Modes are JavaScript programs that help color (and optionally indent) text written in a given language. The distribution comes with a number of modes (see the <a href="../mode/"><code>mode/</code></a> directory), and it isn't hard to <a href="#modeapi">write new ones</a> for other languages.</p>
    37 </body>
    38 </textarea></form>
    39 
    40     <p>This page uses a hack on top of the <code>"renderLine"</code>
    41     event to make wrapped text line up with the base indentation of
    42     the line.</p>
    43 
    44     <script>
    45       var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
    46         lineNumbers: true,
    47         lineWrapping: true,
    48         mode: "text/html"
    49       });
    50       var charWidth = editor.defaultCharWidth(), basePadding = 4;
    51       editor.on("renderLine", function(cm, line, elt) {
    52         var off = CodeMirror.countColumn(line.text, null, cm.getOption("tabSize")) * charWidth;
    53         elt.style.textIndent = "-" + off + "px";
    54         elt.style.paddingLeft = (basePadding + off) + "px";
    55       });
    56       editor.refresh();
    57     </script>
    58 
    59   </article>



Download modules/editor/codemirror/demo/indentwrap.html


History
Tue, 22 May 2018 22:39:53 +0200	Jan Dankert	Fix für PHP 7.2: 'Object' darf nun nicht mehr als Klassennamen verwendet werden. AUCH NICHT IN EINEM NAMESPACE! WTF, wozu habe ich das in einen verfickten Namespace gepackt? Wozu soll der sonst da sein??? Amateure. Daher nun notgedrungen unbenannt in 'BaseObject'.