openrat-cms

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

index.html (1640B)


      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>