github.com/elliott5/community@v0.14.1-0.20160709191136-823126fb026a/app/public/codemirror/mode/elm/index.html (about)

     1  <!doctype html>
     2  
     3  <title>CodeMirror: Elm mode</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="elm.js"></script>
    10  <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
    11  <div id=nav>
    12    <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>
    13  
    14    <ul>
    15      <li><a href="../../index.html">Home</a>
    16      <li><a href="../../doc/manual.html">Manual</a>
    17      <li><a href="https://github.com/codemirror/codemirror">Code</a>
    18    </ul>
    19    <ul>
    20      <li><a href="../index.html">Language modes</a>
    21      <li><a class=active href="#">Elm</a>
    22    </ul>
    23  </div>
    24  
    25  <article>
    26  <h2>Elm mode</h2>
    27  
    28  <div><textarea id="code" name="code">
    29  import Color exposing (..)
    30  import Graphics.Collage exposing (..)
    31  import Graphics.Element exposing (..)
    32  import Time exposing (..)
    33  
    34  main =
    35    Signal.map clock (every second)
    36  
    37  clock t =
    38    collage 400 400
    39      [ filled    lightGrey   (ngon 12 110)
    40      , outlined (solid grey) (ngon 12 110)
    41      , hand orange   100  t
    42      , hand charcoal 100 (t/60)
    43      , hand charcoal 60  (t/720)
    44      ]
    45  
    46  hand clr len time =
    47    let angle = degrees (90 - 6 * inSeconds time)
    48    in
    49        segment (0,0) (fromPolar (len,angle))
    50          |> traced (solid clr)
    51  </textarea></div>
    52  
    53      <script>
    54        var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
    55          lineNumbers: true,
    56          mode: "text/x-elm"
    57        });
    58      </script>
    59  
    60      <p><strong>MIME types defined:</strong> <code>text/x-elm</code>.</p>
    61    </article>