/web-workflow-viewer

HTML Workflow viewer based on workflow json files exported from Scipion.

Primary LanguageJavaScript

web-workflow-viewer

HTML Workflow viewer for workflow json files exported from Scipion. Developed as a web component - see demo in index.html.

To use the web component we need to:

  1. Link to webcomponents-loader.js to manage polyfills for browser support. More about polyfills here
<script src="js/webcomponents/webcomponents-loader.js"></script>
  1. Link to the component itself:
<link rel="import" href="scipion-workflow.html">
  1. Place the viewer wherever it suits best, linking its json file:
<scipion-workflow src="workflow.json"></scipion-workflow>
  1. If you want to see the Scipion representation output images (which is highly recommended), you must paste at project level the "images_representation" folder previously obtained with the scipion-em-empiar plugin

To view the demo, get inside this repo's dir and serve index.html via http:

$ cd web-workflow-viewer
$ python -m http.server 8009

Open file on http://localhost:8009 on your browser, you should see something like this: viewer-demo

Learn more about web components here and here.