diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..61e9031
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,3 @@
+dist/
+build/
+node_modules/
\ No newline at end of file
diff --git a/graphics.js b/graphics.js
deleted file mode 100644
index 608b82e..0000000
--- a/graphics.js
+++ /dev/null
@@ -1,166 +0,0 @@
-class Tragable {
- initTrag(element, cb) {
- let selected = false;
- element.addEventListener('mousedown', () => {
- selected = true;
- });
- svg.addEventListener('mousemove', event => {
- if (selected) cb(event.x, event.y);
- });
- svg.addEventListener('mouseup', () => {
- selected = false;
- });
- svg.addEventListener('mouseleave', event => {
- selected = false;
- });
- }
-}
-
-
-class SVGNode extends Tragable {
- group;
- circle;
- circleText;
- aboveText;
- constructor(node) {
- super();
- // Create the group element
- this.group = document.createElementNS(svgNamespace, 'g');
- this.group.classList.add("PNode");
- this.group.setAttribute('transform', `translate(${node.x}, ${node.y})`);
-
- // Create the circle
- this.circle = document.createElementNS(svgNamespace, 'circle');
- this.circle.setAttribute('cx', '0');
- this.circle.setAttribute('cy', '0');
- this.circle.setAttribute('r', '25');
-
- // Create the text inside the circle
- this.circleText = document.createElementNS(svgNamespace, 'text');
- this.circleText.classList.add("circleText");
- this.circleText.setAttribute('x', '0');
- this.circleText.setAttribute('y', '5');
- this.circleText.textContent = '0/1';
-
- // Create the text above the circle
- this.aboveText = document.createElementNS(svgNamespace, 'text');
- this.aboveText.classList.add("aboveText");
- this.aboveText.setAttribute('x', '0');
- this.aboveText.setAttribute('y', '-35');
- this.aboveText.textContent = node.name;
-
- // Append the circle and texts to the group
- this.group.appendChild(this.circle);
- this.group.appendChild(this.circleText);
- this.group.appendChild(this.aboveText);
-
- this.initTrag(this.group, (x, y) => node.updatePosition(x, y));
- }
-
- appendIt(svg) {
- svg.appendChild(this.group);
- }
-
- translate(x, y) {
- this.group.setAttribute('transform', `translate(${x}, ${y})`);
- }
- setName(name) {
- this.aboveText.textContent = name;
- }
- setMarks(amount, max) {
- this.circleText.textContent = `${amount}/${max}`;
- }
-}
-
-class SVGTRansition extends Tragable {
- group;
- rect;
- rectText;
- constructor(trans) {
- super();
- // Create the group element
- this.group = document.createElementNS(svgNamespace, 'g');
- this.group.classList.add("PTransition");
- this.group.setAttribute('transform', `translate(${trans.x}, ${trans.y})`);
-
- // Create the circle
- this.rect = document.createElementNS(svgNamespace, 'rect');
- this.rect.setAttribute('x', '-12.5');
- this.rect.setAttribute('y', '-25');
- this.rect.setAttribute('height', '50');
- this.rect.setAttribute('width', '25');
-
- // Create the text inside the circle
- this.rectText = document.createElementNS(svgNamespace, 'text');
- this.rectText.classList.add("rectText");
- this.rectText.setAttribute('x', '-5');
- this.rectText.setAttribute('y', '-35');
- this.rectText.textContent = trans.name;
-
- // Append the circle and texts to the group
- this.group.appendChild(this.rect);
- this.group.appendChild(this.rectText);
- this.initTrag(this.group, (x, y) => trans.updatePosition(x, y));
- }
-
- appendIt(svg) {
- svg.appendChild(this.group);
- }
-
- translate(x, y) {
- this.group.setAttribute('transform', `translate(${x}, ${y})`);
- }
- setName(name) {
- this.aboveText.textContent = name;
- }
-
- setCanFire(can){
- if (can)this.group.classList.add("canFire");
- else this.group.classList.remove("canFire");
- }
-}
-
-class SVGArrow {
- group;
- lineText;
- line;
- from;
- to;
- constructor(from, to) {
- this.from = from;
- this.to = to;
- this.group = document.createElementNS(svgNamespace, 'g');
- this.group.classList.add("PEdge");
-
- this.line = document.createElementNS(svgNamespace, 'line');
- this.line.setAttribute('marker-end', "url(#arrowhead)");
- this.group.setAttribute('transform', `translate(0, 0)`);
-
- // Create the text inside the circle
- this.lineText = document.createElementNS(svgNamespace, 'text');
- this.lineText.classList.add("lineText");
- this.lineText.setAttribute('x', '0');
- this.lineText.setAttribute('y', '0');
- this.lineText.textContent = "";
-
- this.group.appendChild(this.line);
- this.group.appendChild(this.lineText);
-
- this.updatePosition();
- }
- updatePosition() {
- let dx = this.to.x - this.from.x;
- let dy = this.to.y - this.from.y;
- let l = Math.sqrt(dx * dx + dy * dy);
- dx /= l;
- dy /= l;
- this.line.setAttribute('x1', this.from.x + dx * 30);
- this.line.setAttribute('y1', this.from.y + dy * 30);
- this.line.setAttribute('x2', this.to.x - dx * 40);
- this.line.setAttribute('y2', this.to.y - dy * 40);
- }
- appendIt(svg) {
- svg.appendChild(this.group);
- }
-
-}
diff --git a/index.html b/html/index.html
similarity index 92%
rename from index.html
rename to html/index.html
index c95495c..32a7469 100644
--- a/index.html
+++ b/html/index.html
@@ -83,9 +83,7 @@
-
-
-
+