From 25a5ee9467cf954ead94dc592f52e261cbaa6c7b Mon Sep 17 00:00:00 2001
From: Tal Ben-Nun <talbn@inf.ethz.ch>
Date: Tue, 24 Mar 2020 18:27:45 +0100
Subject: [PATCH] Jupyter: Use online javascript files for SDFV if connected

---
 dace/jupyter.py               | 54 ++++++++++++++++++++++++++++++-----
 diode/webclient/renderer.js   | 16 +++++++++--
 diode/webclient/sdfg_utils.js |  4 +--
 3 files changed, 63 insertions(+), 11 deletions(-)

diff --git a/dace/jupyter.py b/dace/jupyter.py
index da12b15e99..04622c9172 100644
--- a/dace/jupyter.py
+++ b/dace/jupyter.py
@@ -1,6 +1,17 @@
 """ Jupyter Notebook support for DaCe. """
 
 import os
+import urllib.request
+import urllib.error
+
+
+def _connected():
+    try:
+        urllib.request.urlopen(
+            'https://spcl.github.io/dace/webclient/sdfv.css', timeout=1)
+        return True
+    except urllib.error.URLError:
+        return False
 
 
 # From https://stackoverflow.com/a/39662359/6489142
@@ -19,23 +30,52 @@ def isnotebook():
 
 def preamble():
     # Emit javascript headers for SDFG renderer
-    sdfv_deps = [
+    sdfv_js_deps = [
         'renderer_dir/dagre.js', 'renderer_dir/global_vars.js',
-        'external_lib/math.min.js', 'renderer_elements.js', 'sdfg_utils.js',
+        'context_menu.js', 'renderer_elements.js', 'sdfg_utils.js',
         'renderer.js'
     ]
+    sdfv_css_deps = ['sdfv.css']
+
     result = ''
 
-    # Load dependencies
+    # Rely on internet connection for Material icons
+    result += '<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">'
+
+    # Try to load dependencies from online sources
+    if _connected():
+        # external_js_deps = [
+        #     'external_lib/pdfkit.standalone.js',
+        #     'external_lib/blob-stream.js',
+        #     'external_lib/canvas2pdf.js',  # 'external_lib/math.min.js'
+        # ]
+        result += '''
+        <script>
+        require.config({
+            paths: {
+                "math": "https://spcl.github.io/dace/webclient/external_lib/math.min"
+            },
+            waitSeconds: 40
+          });
+        require( ["math"], x => window.math = x);
+        </script>'''
+        for dep in sdfv_js_deps:
+            result += '<script src="https://spcl.github.io/dace/webclient/%s"></script>\n' % dep
+        for dep in sdfv_css_deps:
+            result += '<link href="https://spcl.github.io/dace/webclient/%s" rel="stylesheet">\n' % dep
+        return result
+
+    # Load local dependencies
     root_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), '..',
                              'diode', 'webclient')
-    for dep in sdfv_deps:
+    for dep in sdfv_js_deps:
         file = os.path.join(root_path, dep)
         with open(file, 'r') as fp:
             result += '<script>%s</script>\n' % fp.read()
-
-    # Rely on internet connection for Material icons
-    result += '<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">'
+    for dep in sdfv_css_deps:
+        file = os.path.join(root_path, dep)
+        with open(file, 'r') as fp:
+            result += '<style>%s</style>\n' % fp.read()
 
     # Run this code once
     return result
diff --git a/diode/webclient/renderer.js b/diode/webclient/renderer.js
index 3a101e98c7..c1939eb61a 100644
--- a/diode/webclient/renderer.js
+++ b/diode/webclient/renderer.js
@@ -726,8 +726,10 @@ class SDFGRenderer {
                 let rect = this.getBoundingClientRect();
                 let cmenu = new ContextMenu();
                 cmenu.addOption("Save view as PNG", x => that.save_as_png());
-                cmenu.addOption("Save view as PDF", x => that.save_as_pdf());
-                cmenu.addOption("Save all as PDF", x => that.save_as_pdf(true));
+                if (that.has_pdf()) {
+                    cmenu.addOption("Save view as PDF", x => that.save_as_pdf());
+                    cmenu.addOption("Save all as PDF", x => that.save_as_pdf(true));
+                }
                 cmenu.addCheckableOption("Inclusive ranges", that.inclusive_ranges, (x, checked) => {that.inclusive_ranges = checked;});
                 that.menu = cmenu;
                 that.menu.show(rect.left, rect.bottom);
@@ -890,6 +892,16 @@ class SDFGRenderer {
         this.save('sdfg.png', this.canvas.toDataURL('image/png'));
     }
 
+    has_pdf() {
+        try {
+            blobStream;
+            canvas2pdf.PdfContext;
+            return true;
+        } catch(e) {
+            return false;
+        }
+    }
+
     save_as_pdf(save_all=false) {
         let stream = blobStream();
 
diff --git a/diode/webclient/sdfg_utils.js b/diode/webclient/sdfg_utils.js
index 129184f0aa..f3fb07b364 100644
--- a/diode/webclient/sdfg_utils.js
+++ b/diode/webclient/sdfg_utils.js
@@ -78,9 +78,9 @@ function sdfg_range_elem_to_string(range, settings=null) {
             } catch(e) {
                 try { mathjs = math; } catch(e) {}
             }
-            if (mathjs !== undefined)
+            try {
                 endp1 = mathjs.simplify(endp1).toString();
-
+            } catch(e) {}
             preview += sdfg_property_to_string(range.start, settings) + ':' +
                 endp1;
         }