Very nice, but how to get SVG

[aphilpotts]

I really like the tools and am using them in VSCode, but to convert to SVG, rather than just display it. the SVG download from the web site at https://bramp.github.io/js-sequence-diagrams/ is borked for Edge, the download link does nothing, the link does work in chrome, so not a show-stopper!

[bramp]

I don't have a Windows machine to test on, so I won't be able to investigate. If anyone else is willing to take a look, and propose a solution, that'll be great!

[aphilpotts]

I will look into it, see if I can propose a solution

[aphilpotts]

To elaborate, the issue is in here:

        download_link.click(function(ev) {
          var svg = diagram_div.find('svg')[0];
          var width = parseInt(svg.width.baseVal.value);
          var height = parseInt(svg.height.baseVal.value);
          var data = editor.getValue();
          var xml = '<?xml version="1.0" encoding="utf-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"><svg xmlns="http://www.w3.org/2000/svg" width="' + width + '" height="' + height + '" xmlns:xlink="http://www.w3.org/1999/xlink"><source><![CDATA[' + data + ']]></source>' + svg.innerHTML + '</svg>';

          var a = $(this);
          a.attr("download", "diagram.svg"); // TODO I could put title here
          a.attr("href", "data:image/svg+xml," + encodeURIComponent(xml));
        });

This code was interesting to me, I had not seen the technique before, but is seems, OK, on click you add a data url to be downloaded, but in Edge, this leads to a lockup and a spinning donut.

I will see if I can get some attention from the Edge guys... will keep you posted

[aphilpotts]

By the way, two of the links on the web site are dead, not that it really seems to matter, but I was in the debugger anyway.

HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier). (XHR)GET - https://bramp.github.io/js-sequence-diagrams/js/sequence-diagram-snap.js

HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier). (XHR)GET - https://bramp.github.io/js-sequence-diagrams/js/underscore-min.map

[aphilpotts]

This works in edge, and elsewhere, pretty sure it can be repurposed, it has the disadvantage that the actual link does not appear until the button is clicked...

http://html5-demos.appspot.com/static/a.download.html

the only other options I could think of is to use a future and then calling click

[nocke]

Is there a simple command line use to generate that svg output? Like this:

proj/docs/img $> sequence test.seqdiag -o test.svg

Working in vscode using this preview extension is great. If there just was a command line way to export the resulting .svg...

Next up and readily working would be using watchy to watch all docs/img/*.seqdiag and anything seeing changes leads to re-conversion. And then only linking to those svg's from your client/github facing documentation, so everyone can view them with ease...