nestModes/testcodemirror.html at master · plocket/nestModes · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!doctype html>
<html>
    <head>
        <title>YAML mixed mode</title>
        <meta charset="utf-8"/>
        <link rel="stylesheet" href="codemirror/lib/codemirror.css">
        <link rel="stylesheet" href="codemirror/theme/paraiso-light.css">
        <script src="codemirror/lib/codemirror.js"></script>
        <script src="codemirror/mode/yaml/yaml.js"></script>
        <script src="codemirror/mode/python/python.js"></script>

        <!-- <script src="yamlmixed.js"></script> -->
        <script src="nestModes.js"></script>
    </head>
    <body>
        <textarea id="code" name="code" rows="34" cols="80">
---
# Should be formatted as yaml
question: |
  What is your name?
fields:
  - First name: client.name.first
---
code: |  # The below should be python, even with the comment here.
  c = b + a
  for bar in range(5,3):
    d = c - 62
--- # Back to yaml
question: |
  Tell me about yourself.
  code: for x in y  # This line should appear as a yaml string
fields:
  - Hobbies: hobbies
    code: |
      ['hobby of ' + y for y in ['ice skating', 'swimming', 'stamp collecting']]
    code: z = 55
      for x in y  # This is the wrong indentation level and shouldn't be formatted as python or yaml
  - Chores: chores  # yaml again from here on out
---
question: |
  What is your last name?
fields:
  - Last name: client.name.last
        </textarea>
        <script>
          var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
              mode: 'yamlmixed',
              lineNumbers: true,
              tabSize: 2,
              tabindex: 70,
              theme: 'paraiso-light',
          });
        </script>
    </body>
</html>