Merge branch 'feature/hpcc-wasm'

pom.xml

@@ -11,7 +11,7 @@
   <properties>
     <java.version>11</java.version>
     <reveal.js.version>3.7.0</reveal.js.version>
-    <viz.js.version>2.1.2</viz.js.version>
+    <hpcc.js.wasm.version>1.16.5</hpcc.js.wasm.version>
     <!-- teavm.version>0.6.1</teavm.version -->
     <teavm.version>0.7.0-dev-1207</teavm.version>
     <junit.version>5.7.0</junit.version>
@@ -73,8 +73,8 @@
     </dependency>
     <dependency>
       <groupId>org.webjars.npm</groupId>
-      <artifactId>viz.js</artifactId>
-      <version>${viz.js.version}</version>
+      <artifactId>hpcc-js__wasm</artifactId>
+      <version>${hpcc.js.wasm.version}</version>
       <type>jar</type>
     </dependency>
 

src/main/webapp/index.html

@@ -2902,18 +2902,21 @@ application {
   </div>
   <script src="webjars/reveal.js/lib/js/head.min.js"></script>
   <script src="webjars/reveal.js/js/reveal.js"></script>
-  <script src="webjars/viz.js/2.1.2/viz.js"></script>
-  <script>var viz = new Viz({ workerURL: 'webjars/viz.js/2.1.2/full.render.js'});</script>
+  <script src="webjars/hpcc-js__wasm/1.16.5/dist/index.js"></script>
+  <script src="lib/plugin/graphviz.js"></script>
   <script src="teavm/classes.js"></script>
  
   <script>
+  (async () => {
+    // rendering graphviz diagrams to SVG
+    await allGraphvizToSVG().then(() => { console.log("all graphviz rendered.") });
+
     // Required, even if empty.
     Reveal.initialize({
       transition: 'convex',
 
       // Optional reveal.js plugins
       dependencies: [
-        { src: 'lib/plugin/graphviz.js', async: true },
         { src: 'webjars/reveal.js/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } }
       ]
     });
@@ -2952,7 +2955,7 @@ application {
     });
 
     // inline source files from data-src
-    (function (){
+    Reveal.addEventListener( 'ready', function (){
         var codeDataSrc = document.querySelectorAll('code[data-src]');
         Array.prototype.forEach.call(codeDataSrc, function(element) {
         	var srcUrl = element.getAttribute('data-src');
@@ -2966,7 +2969,7 @@ application {
         	title.innerText = srcUrl;
         	element.parentElement.insertBefore(title, element);
         });
-    })();
+    });
     function loadFile(src, cb) {
     	var xhr = new XMLHttpRequest();
     	xhr.responseType = 'text';
@@ -2985,6 +2988,7 @@ application {
     // force SVG repaint on slidechanged (avoid random svg text misplaced/missized)
     Reveal.addEventListener('slidechanged', (event) => Array.prototype.forEach.call(event.currentSlide.querySelectorAll('svg'), (svg) => svg.innerHTML += ""));
 
+  })();
     </script>
 </body>
 </html>

src/main/webapp/lib/plugin/graphviz.js

-// START CUSTOM VIZ.JS INTEGRATION
-(function() {
-        if( typeof window.addEventListener === 'function' ) {
+// START CUSTOM HPCC-JS/WASM GRAPHVIZ INTEGRATION
+var graphviz = window["@hpcc-js/wasm"].graphviz;
+
+function allGraphvizToSVG() {
                 var graphs = document.querySelectorAll( 'pre.viz, script[type="text/vnd.graphviz"]' );
-                Array.prototype.forEach.call(graphs, function(element) {
+                return Promise.allSettled(Array.prototype.map.call(graphs, graphvizToSVG));
+            }
+
+function graphvizToSVG(element) {
                         if (element.parentNode === null) {
                           console.error('parentNode is null for', element);
-                          return;
+                          throw new Error('parentNode is null');
                         }
 
                         var graph = element.innerHTML;
@@ -20,13 +24,10 @@
                         //        element.innerHTML = element.innerHTML.replace(/</g,"&lt;").replace(/>/g,"&gt;");
                         //}
 
-                        //element.innerHTML = ansi_up.ansi_to_html(element.textContent, { 'use_classes': true });
-                        var options = { format: 'svg' };
-                        if( element.hasAttribute( 'data-engine' )) {
-                           options['engine'] = element.getAttribute('data-engine');
-                        }
-                        viz.renderSVGElement(graph, options)
-                              .then(function(svg) {
+                        return graphviz.layout(graph, 'svg', element.hasAttribute('data-engine')?element.getAttribute('data-engine'):'dot')
+                              .then(function(svgString) {
+                                  var parser = new DOMParser();
+                                  var svg = parser.parseFromString(svgString, "image/svg+xml").documentElement;
                                   // copy attributes
                                   for (var i=0; i<element.attributes.length; i++)
                                     if (!svg.hasAttribute(element.attributes[i].name))
@@ -45,8 +46,6 @@
                                   err_elt.appendChild(err_eltp);
                                   element.parentNode.replaceChild(err_elt, element);
                               });
-                });
-        }
-})();
-// END CUSTOM VIZ.JS INTEGRATION
-// REQUIRE viz.js
+                }
+// END CUSTOM HPCC-JS/WASM GRAPHVIZ INTEGRATION
+// REQUIRE @hpcc-js/wasm