Javascript API

Introduction

You may use the adia inside Javascript (browser) because we pass all tests with both CPython and Brython environments before each commit.

This page aims to demonstrate how to use the adia inside your javascript project.

For the first you have to grab the adia.bundle.js from https://pylover.github.io/adia/about or generate adia.bundle.js using:

cd path/to/adia
make webclinic

webclinic/build/adia.bundle.js is what you need now.

Copy and paste the generated file inside your Javascript project’s static directory, where you can fetch it by a URL. then load it using:

<html>
<head>
...
<script type="text/javascript" src="adia.bundle.js"></script>
</head>
<body onload="brython()">
<script type="text/python">
from browser import window
import adia

def adia_diagram(source):
  try:
    return adia.diagram(source)
  except adia.BadSyntax as ex:
    return f'Syntax Error: {ex}'
  except adia.BadAttribute as ex:
    return f'Attribute Error: {ex}'

window.adiaDiagram = adia_diagram
</script>

...

</body>
</html>

After the setup above you can use the function window.adiaDiagram(...) anywhere.

Javascript demo page

Let’s make and visit the provided javascript demo page: webclinic/jsdemo.html.

cd path/to/adia
make clean webclinic_serve

Now browse the http://localhost:8000/jsdemo.html.