[skip CI] using TOML instead of YAML

docs/index.html

@@ -4,8 +4,8 @@
     <meta charset="UTF-8">
     <title>fa-diagrams example</title>
     <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/js-yaml@3.13.1/dist/js-yaml.min.js"></script>
     <script src="github-cdn.js"></script>
+    <script src="toml-parser.js"></script>
     <style>
         * {
             padding: 0;
@@ -49,8 +49,10 @@
 <div id="right"></div>
 <script>
   $(document).ready(() => {
-    github('klemek/fa-diagrams').loadScripts('dist/fa-diagrams-data.min.js', 'dist/fa-diagrams.min.js').then(function () {
-      $.get('sample.yml', (data) => {
+
+    github('klemek/fa-diagrams').loadScripts('dist/fa-diagrams-data.min.js', 'dist/fa-diagrams.min.js').then(() => {
+
+      $.get('sample.toml', (data) => {
         $('#input').val(data).trigger('paste');
       });
 
@@ -67,13 +69,16 @@
                   data[key] = data[key].replace(/\\n/gm, '\n');
               });
             };
-            let data = jsyaml.load($('#input').val());
+            const parser = new TOMLParser();
+            parser.parse($('#input').val());
+            let data = parser.finish();
+            console.log(data);
             findLineBreaks(data);
             $('#right').html(faDiagrams.compute(data));
           } catch (err) {
             $('#right').html(`<h2>${err.toString().replace(/\n/gm, '<br>')}</h2>`);
+            console.error(err);
           }
-
         }, 500);
       });
     });

docs/sample.toml

@@ -0,0 +1,73 @@
+[options.placing]
+diagonals = false
+
+[options.rendering.icons]
+color = "#00695C"
+
+[options.rendering.links]
+color = "#26A69A"
+
+[options.rendering.texts]
+color = "#004D40"
+font = "mono"
+font-size = 12
+margin = 0.25
+
+[options.rendering.sub-icons]
+color = "#004D40"
+
+[[nodes]]
+name = "client"
+icon = "laptop"
+bottom = "user"
+
+[[nodes]]
+name = "page"
+icon = "file-code"
+top = "index.html"
+
+[[nodes]]
+name = "js"
+icon = "js-square"
+bottom = "front-end"
+
+[[nodes]]
+name = "server"
+icon = "node"
+bottom = "back-end"
+
+[[nodes]]
+name = "db"
+icon = "database"
+
+[[links]]
+from = "client"
+to = "page"
+
+[[links]]
+from = "page"
+to = "js"
+type = "double"
+bottom = "VueJS"
+direction = "down"
+
+  [links.top]
+  icon = "vuejs"
+
+[[links]]
+from = "js"
+to = "server"
+type = "split-double"
+direction = "right"
+
+  [links.top]
+  text = "Ajax"
+
+  [links.bottom]
+  text = "JSON"
+
+[[links]]
+from = "db"
+to = "server"
+type = "double"
+bottom = "Sequelize"

docs/sample.yml

@@ -1,52 +0,0 @@
-options:
-  placing:
-    diagonals: false
-  rendering:
-    icons:
-      color: '#00695C'
-    links:
-      color: '#26A69A'
-    texts:
-      color: '#004D40'
-      font: mono
-      font-size: 12
-      margin: 0.25
-    sub-icons:
-      color: '#004D40'
-nodes:
-  - name: client
-    icon: laptop
-    bottom: user
-  - name: page
-    icon: file-code
-    top: index.html
-  - name: js
-    icon: js-square
-    bottom: front-end
-  - name: server
-    icon: node
-    bottom: back-end
-  - name: db
-    icon: database
-links:
-  - from: client
-    to: page
-  - from: page
-    to: js
-    type: double
-    top:
-      icon: vuejs
-    bottom: VueJS
-    direction: down
-  - from: js
-    to: server
-    type: split-double
-    direction: right
-    top:
-      text: Ajax
-    bottom:
-      text: JSON
-  - from: db
-    to: server
-    type: double
-    bottom: Sequelize