DataTools3/elements/Connector.js

class Connector {
	static INPUT = 0;
	static OUTPUT = 1;

	direction;
	label;

	connection;

	element;
	circle;

	listeners = [];

	constructor(direction, label = "") {
		this.direction = direction;
		this.element = "";
		this.label = label;

		if (this.label == "") {
			switch (this.direction) {
			case Connector.INPUT:
				this.label = "Input";
				break;
			case Connector.OUTPUT:
				this.label = "Output";
				break;
			}
		}
	}

	buildElement() {
		if (this.element) return this.element;

		this.element = document.createElement("div");
		this.element.classList.add("connector");

		if (this.direction == Connector.INPUT) {
			this.element.classList.add("connectorInput");
		}
		if (this.direction == Connector.OUTPUT) {
			this.element.classList.add("connectorOutput");
		}

		this.circle = document.createElement("span");
		this.circle.classList.add("connectorCircle");

		let label = document.createElement("span");
		label.innerText = this.label;
		label.classList.add("connectorLabel");

		this.element.appendChild(this.circle);
		this.element.appendChild(label);

		this.element.addEventListener("click", () => {
			ConnectionController.clickConnector(this);
		})

		return this.element;
	}

	connect(connector) {
		this.connection = connector;
		this.element.classList.add("connected");
	}

	disconnect() {
		this.connection = null;
		this.element.classList.remove("connected");
	}

	disconnectBoth() {
		if (!this.connection) return;
		this.connection.disconnect();
		this.disconnect();
	}

	send(data) {
		if (!this.connection) return;
		this.connection.receive(data);
	}

	receive(data) {
		for (let listener of this.listeners) {
			listener(data);
		}
	}

	addListener(listener) {
		this.listeners.push(listener);
	}
}