index.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <!doctype html>
  2. <title>CodeMirror: Soy (Closure Template) mode</title>
  3. <meta charset="utf-8"/>
  4. <link rel=stylesheet href="../../doc/docs.css">
  5. <link rel="stylesheet" href="../../lib/codemirror.css">
  6. <script src="../../lib/codemirror.js"></script>
  7. <script src="../../addon/edit/matchbrackets.js"></script>
  8. <script src="../htmlmixed/htmlmixed.js"></script>
  9. <script src="../xml/xml.js"></script>
  10. <script src="../javascript/javascript.js"></script>
  11. <script src="../css/css.js"></script>
  12. <script src="soy.js"></script>
  13. <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
  14. <div id=nav>
  15. <a href="https://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>
  16. <ul>
  17. <li><a href="../../index.html">Home</a>
  18. <li><a href="../../doc/manual.html">Manual</a>
  19. <li><a href="https://github.com/codemirror/codemirror">Code</a>
  20. </ul>
  21. <ul>
  22. <li><a href="../index.html">Language modes</a>
  23. <li><a class=active href="#">Soy (Closure Template)</a>
  24. </ul>
  25. </div>
  26. <article>
  27. <h2>Soy (Closure Template) mode</h2>
  28. <form><textarea id="code" name="code">
  29. {namespace example}
  30. /**
  31. * Says hello to the world.
  32. */
  33. {template .helloWorld}
  34. {@param name: string}
  35. {@param? score: number}
  36. Hello <b>{$name}</b>!
  37. <div>
  38. {if $score}
  39. <em>{$score} points</em>
  40. {else}
  41. no score
  42. {/if}
  43. </div>
  44. {/template}
  45. {template .alertHelloWorld kind="js"}
  46. alert('Hello World');
  47. {/template}
  48. </textarea></form>
  49. <script>
  50. var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
  51. lineNumbers: true,
  52. matchBrackets: true,
  53. mode: "text/x-soy",
  54. indentUnit: 2,
  55. indentWithTabs: false
  56. });
  57. </script>
  58. <p>A mode for <a href="https://developers.google.com/closure/templates/">Closure Templates</a> (Soy).</p>
  59. <p><strong>MIME type defined:</strong> <code>text/x-soy</code>.</p>
  60. </article>