var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __values = (this && this.__values) || function(o) {
    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
    if (m) return m.call(o);
    if (o && typeof o.length === "number") return {
        next: function () {
            if (o && i >= o.length) o = void 0;
            return { value: o && o[i++], done: !o };
        }
    };
    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
};
var CanvasObject = (function () {
    function CanvasObject(x, y, width, height) {
        this.x = x;
        this.y = y;
        this.width = width;
        this.height = height;
        this.hover = false;
    }
    CanvasObject.prototype.pointInObject = function (p) {
        if (p.x < this.x) {
            return false;
        }
        if (p.y < this.y) {
            return false;
        }
        if (p.x > this.x + this.width) {
            return false;
        }
        if (p.y > this.y + this.height) {
            return false;
        }
        return true;
    };
    return CanvasObject;
}());
var Button = (function (_super) {
    __extends(Button, _super);
    function Button(x, y, label, ctx, callback, node) {
        var _this = _super.call(this, x, y, 0, 0) || this;
        _this.callback = function () { };
        _this.label = label;
        _this.callback = callback;
        _this.node = node;
        _this.resize(ctx);
        return _this;
    }
    Button.prototype.update = function (ms) {
        this.hover = this.pointInObject(new Point(ms.world.x + ms.offset.x, ms.world.y + ms.offset.y));
        if (ms.click && this.hover) {
            this.callback(this.node);
            ms.click = false;
        }
    };
    Button.prototype.draw = function (ctx, ms) {
        ctx.fillStyle = this.hover ? "black" : "#6B6B6B";
        ctx.font = "15px Helvetica";
        ctx.fillText(this.label, this.x + 3, this.y + this.labelHeight + 3);
    };
    Button.prototype.resize = function (ctx) {
        ctx.font = "15px Helvetica";
        var labelSize = ctx.measureText(this.label);
        this.labelWidth = labelSize.width;
        this.width = this.labelWidth + 6;
        this.labelHeight = labelSize.actualBoundingBoxAscent + labelSize.actualBoundingBoxDescent;
        this.height = this.labelHeight + 6;
    };
    return Button;
}(CanvasObject));
var circleTopRadians = Math.PI / 2;
var circleRightRadians = (Math.PI * 3) / 2;
var circleBottomRadians = Math.PI + (Math.PI * 3);
var circleLeftRadians = Math.PI;
var NodeIO = (function (_super) {
    __extends(NodeIO, _super);
    function NodeIO(node, input) {
        var _this = _super.call(this, 0, 0, 0, 0) || this;
        _this.input = false;
        _this.radius = 15;
        _this.input = input;
        _this.node = node;
        _this.reposition();
        return _this;
    }
    NodeIO.prototype.update = function (ms) {
        if (!ms.draggingConnection && !this.input && this.pointInObject(ms.world) && ms.leftDown) {
            ms.draggingConnection = true;
            _diagram.newConnection = new NewConnection(this.node);
        }
    };
    NodeIO.prototype.draw = function (ctx, ms) {
        ctx.fillStyle = this.input ? "#ED575A" : "#66A7C5";
        ctx.beginPath();
        ctx.arc(ms.offset.x + this.x, ms.offset.y + this.y, this.radius, circleRightRadians, circleTopRadians, this.input);
        ctx.fill();
    };
    NodeIO.prototype.reposition = function () {
        if (this.input) {
            this.x = this.node.x;
            this.y = this.node.y + this.node.height / 2;
        }
        else {
            this.x = this.node.x + this.node.width;
            this.y = this.node.y + this.node.height / 2;
        }
    };
    NodeIO.prototype.pointInObject = function (p) {
        var inCircle = Math.pow(p.x - this.x, 2) + Math.pow(p.y - this.y, 2) <= this.radius * this.radius;
        if (!inCircle) {
            this.hover = false;
        }
        else {
            this.hover = this.input ? p.x < this.x : p.x > this.x;
        }
        return this.hover;
    };
    return NodeIO;
}(CanvasObject));
var NodeConnection = (function (_super) {
    __extends(NodeConnection, _super);
    function NodeConnection(output, input) {
        var _this = _super.call(this, 0, 0, 0, 0) || this;
        _this.controlPoints = {
            dX: 0,
            outputX: 0,
            outputY: 0,
            inputX: 0,
            inputY: 0,
            cp1x: 0,
            cp1y: 0,
            cp2x: 0,
            cp2y: 0,
        };
        _this.halfWayPoint = new Point();
        _this.output = output;
        _this.input = input;
        return _this;
    }
    NodeConnection.prototype.update = function (ms) {
        this.controlPoints.outputX = ms.offset.x + this.output.output.x;
        this.controlPoints.outputY = ms.offset.y + this.output.output.y;
        this.controlPoints.inputX = ms.offset.x + this.input.input.x;
        this.controlPoints.inputY = ms.offset.y + this.input.input.y;
        this.controlPoints.dX = Math.abs(this.controlPoints.outputX - this.controlPoints.inputX);
        this.controlPoints.cp1x = (this.controlPoints.outputX + this.controlPoints.dX);
        this.controlPoints.cp1y = this.controlPoints.outputY;
        this.controlPoints.cp2x = (this.controlPoints.inputX - this.controlPoints.dX);
        this.controlPoints.cp2y = this.controlPoints.inputY;
        this.halfWayPoint = getBezierXY(0.5, this.controlPoints.outputX, this.controlPoints.outputY, this.controlPoints.cp1x, this.controlPoints.cp1y, this.controlPoints.cp2x, this.controlPoints.cp2y, this.controlPoints.inputX, this.controlPoints.inputY);
        this.hover = Math.pow(this.halfWayPoint.x - ms.canvas.x, 2) + Math.pow(this.halfWayPoint.y - ms.canvas.y, 2) <= 15 * 15;
        if (this.hover && ms.click) {
            _diagram.removeConnection(this.output, this.input);
            ms.click = false;
        }
    };
    NodeConnection.prototype.draw = function (ctx, ms) {
        ctx.beginPath();
        ctx.moveTo(this.controlPoints.outputX, this.controlPoints.outputY);
        ctx.strokeStyle = "#757575";
        ctx.lineWidth = 5;
        ctx.bezierCurveTo(this.controlPoints.cp1x, this.controlPoints.cp1y, this.controlPoints.cp2x, this.controlPoints.cp2y, this.controlPoints.inputX, this.controlPoints.inputY);
        ctx.stroke();
        ctx.closePath();
        ctx.beginPath();
        ctx.strokeStyle = this.hover ? "red" : "rgba(200, 200, 200, 0.8)";
        ctx.moveTo(this.halfWayPoint.x - 10, this.halfWayPoint.y - 10);
        ctx.lineTo(this.halfWayPoint.x + 10, this.halfWayPoint.y + 10);
        ctx.moveTo(this.halfWayPoint.x + 10, this.halfWayPoint.y - 10);
        ctx.lineTo(this.halfWayPoint.x - 10, this.halfWayPoint.y + 10);
        ctx.stroke();
        ctx.closePath();
    };
    return NodeConnection;
}(CanvasObject));
var NewConnection = (function (_super) {
    __extends(NewConnection, _super);
    function NewConnection(output) {
        var _this = _super.call(this, 0, 0, 0, 0) || this;
        _this.controlPoints = {
            dX: 0,
            outputX: 0,
            outputY: 0,
            inputX: 0,
            inputY: 0,
            cp1x: 0,
            cp1y: 0,
            cp2x: 0,
            cp2y: 0,
        };
        _this.output = output;
        return _this;
    }
    NewConnection.prototype.update = function (ms) {
        var e_1, _a;
        this.input = null;
        try {
            for (var _b = __values(_diagram.nodes.values()), _c = _b.next(); !_c.done; _c = _b.next()) {
                var node = _c.value;
                if (this.output.id != node.id && node.pointNearNode(ms.world)) {
                    this.input = node;
                }
            }
        }
        catch (e_1_1) { e_1 = { error: e_1_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_1) throw e_1.error; }
        }
        if (this.input == null) {
            this.controlPoints.outputX = ms.offset.x + this.output.output.x;
            this.controlPoints.outputY = ms.offset.y + this.output.output.y;
            this.controlPoints.inputX = ms.offset.x + ms.world.x;
            this.controlPoints.inputY = ms.offset.y + ms.world.y;
            this.controlPoints.dX = Math.abs(this.controlPoints.outputX - this.controlPoints.inputX);
        }
        else {
            this.controlPoints.outputX = ms.offset.x + this.output.output.x;
            this.controlPoints.outputY = ms.offset.y + this.output.output.y;
            this.controlPoints.inputX = ms.offset.x + this.input.input.x;
            this.controlPoints.inputY = ms.offset.y + this.input.input.y;
            this.controlPoints.dX = Math.abs(this.controlPoints.outputX - this.controlPoints.inputX);
        }
        this.controlPoints.cp1x = (this.controlPoints.outputX + this.controlPoints.dX);
        this.controlPoints.cp1y = this.controlPoints.outputY;
        this.controlPoints.cp2x = (this.controlPoints.inputX - this.controlPoints.dX);
        this.controlPoints.cp2y = this.controlPoints.inputY;
    };
    NewConnection.prototype.draw = function (ctx, ms) {
        ctx.beginPath();
        ctx.moveTo(this.controlPoints.outputX, this.controlPoints.outputY);
        ctx.strokeStyle = "#7575A5";
        ctx.lineWidth = 5;
        ctx.bezierCurveTo(this.controlPoints.cp1x, this.controlPoints.cp1y, this.controlPoints.cp2x, this.controlPoints.cp2y, this.controlPoints.inputX, this.controlPoints.inputY);
        ctx.stroke();
        ctx.closePath();
    };
    return NewConnection;
}(CanvasObject));
var DiagramNode = (function (_super) {
    __extends(DiagramNode, _super);
    function DiagramNode(id, x, y, label, ctx, meta, results, logs) {
        if (meta === void 0) { meta = {}; }
        if (results === void 0) { results = new Array(); }
        if (logs === void 0) { logs = new Array(); }
        var _this = _super.call(this, x, y, 0, 0) || this;
        _this.dragging = false;
        _this.dragOrigin = new Point();
        _this.meta = {};
        _this.id = id;
        _this.label = label;
        _this.meta = meta;
        _this.fixType();
        _this.resize(ctx);
        _this.deleteButton = new Button(0, 0, "Del", ctx, _diagram.deleteNodeCallback, _this);
        _this.editButton = new Button(0, 0, "Edit", ctx, _diagram.editNodeCallback, _this);
        _this.input = new NodeIO(_this, true);
        _this.output = new NodeIO(_this, false);
        _this.results = results;
        _this.logs = logs;
        return _this;
    }
    DiagramNode.prototype.update = function (ms) {
        if (this.pointNearNode(ms.world)) {
            this.input.update(ms);
            this.output.update(ms);
        }
        this.hover = (!ms.draggingNode || this.dragging) && _super.prototype.pointInObject.call(this, ms.world);
        if (this.hover) {
            this.deleteButton.update(ms);
            this.editButton.update(ms);
            var onButtons = this.deleteButton.hover || this.editButton.hover;
            if (!this.dragging && ms.leftDown && !ms.draggingNode && !ms.draggingConnection && !onButtons) {
                this.dragging = true;
                ms.draggingNode = true;
                this.dragOrigin.x = this.x - ms.world.x;
                this.dragOrigin.y = this.y - ms.world.y;
            }
        }
        else {
            this.deleteButton.hover = false;
            this.editButton.hover = false;
        }
        if (!ms.leftDown) {
            this.dragging = false;
            ms.draggingNode = false;
        }
        if (this.dragging) {
            this.x = ms.world.x + this.dragOrigin.x;
            this.y = ms.world.y + this.dragOrigin.y;
            this.input.reposition();
            this.output.reposition();
        }
        this.input.update(ms);
        this.output.update(ms);
    };
    DiagramNode.prototype.draw = function (ctx, ms) {
        ctx.fillStyle = this.hover ? "#DDDDDD" : "#BFBFBF";
        ctx.fillRect(ms.offset.x + this.x, ms.offset.y + this.y, this.width, this.height);
        ctx.font = "20px Helvetica";
        ctx.fillStyle = "black";
        var labelX = ms.offset.x + this.x + this.width / 2 - this.labelWidth / 2;
        var labelY = ms.offset.y + this.y + 3 * 2 + this.labelHeight;
        ctx.fillText(this.label, labelX, labelY);
        ctx.font = "15px Helvetica";
        ctx.fillStyle = "#898989";
        var typeX = ms.offset.x + this.x + this.width / 2 - this.typeWidth / 2;
        var typeY = ms.offset.y + this.y + this.height - 3;
        ctx.fillText(this.type, typeX, typeY);
        var resultCount = "" + this.results.length;
        var resultCountSize = ctx.measureText(resultCount);
        var resultCountWidth = resultCountSize.width;
        var resultCountHeight = resultCountSize.actualBoundingBoxAscent + resultCountSize.actualBoundingBoxDescent;
        var resultCountX = ms.offset.x + this.x + this.width - resultCountWidth - 3 * 3;
        var resultCountY = ms.offset.y + this.y + resultCountHeight + 3 * 3;
        ctx.fillText(resultCount, resultCountX, resultCountY);
        this.deleteButton.x = ms.offset.x + this.x;
        this.deleteButton.y = ms.offset.y + this.y + this.height - this.deleteButton.height;
        this.deleteButton.draw(ctx, ms);
        this.editButton.x = ms.offset.x + this.x + this.width - this.editButton.width;
        this.editButton.y = ms.offset.y + this.y + this.height - this.editButton.height;
        this.editButton.draw(ctx, ms);
        this.input.draw(ctx, ms);
        this.output.draw(ctx, ms);
        if (this.logs.length > 0) {
            ctx.moveTo(ms.offset.x + this.x + 21, ms.offset.y + this.y + 6);
            ctx.fillStyle = "orange";
            ctx.beginPath();
            ctx.lineTo(ms.offset.x + this.x + 23, ms.offset.y + this.y + 21);
            ctx.lineTo(ms.offset.x + this.x + 6, ms.offset.y + this.y + 21);
            ctx.lineTo(ms.offset.x + this.x + 14, ms.offset.y + this.y + 6);
            ctx.fill();
        }
        ctx.strokeStyle = "#8E8E8E";
        ctx.lineWidth = 3;
        ctx.strokeRect(ms.offset.x + this.x, ms.offset.y + this.y, this.width, this.height);
    };
    DiagramNode.prototype.fixType = function () {
        this.type = this.meta.type;
        if (["math", "condition"].indexOf(this.type) >= 0) {
            this.type = this.meta.var1;
        }
    };
    DiagramNode.prototype.resize = function (ctx) {
        ctx.font = "20px Helvetica";
        var labelSize = ctx.measureText(this.label);
        this.labelWidth = labelSize.width;
        this.labelHeight = labelSize.actualBoundingBoxAscent + labelSize.actualBoundingBoxDescent;
        this.height = 70;
        ctx.font = "15px Helvetica";
        var typeSize = ctx.measureText(this.type);
        this.typeWidth = typeSize.width;
        this.typeHeight = typeSize.actualBoundingBoxAscent + typeSize.actualBoundingBoxDescent;
        this.width = Math.max(130, this.labelWidth * 1.5, this.typeWidth * 1.2);
    };
    DiagramNode.prototype.pointInObject = function (p) {
        return this.pointNearNode(p) && (_super.prototype.pointInObject.call(this, p) || this.input.pointInObject(p) || this.output.pointInObject(p));
    };
    DiagramNode.prototype.pointNearNode = function (p) {
        if (p.x < this.x - this.input.radius) {
            return false;
        }
        if (p.y < this.y) {
            return false;
        }
        if (p.x > this.x + this.width + this.output.radius) {
            return false;
        }
        if (p.y > this.y + this.height) {
            return false;
        }
        return true;
    };
    return DiagramNode;
}(CanvasObject));
var _diagram;
function tick() {
    _diagram.tick();
    setTimeout(function () {
        tick();
    }, 1000 / 60);
}
function diagramOnResize() {
    _diagram.onresize();
}
function diagramOnMouseDown(ev) {
    _diagram.onmousedown(ev);
}
function diagramOnMouseUp(ev) {
    _diagram.onmouseup(ev);
}
function diagramOnMouseMove(ev) {
    _diagram.onmousemove(ev);
}
function diagramOnWheel(ev) {
    _diagram.onwheel(ev);
}
function diagramOnContext(ev) {
    ev.preventDefault();
}
var Point = (function () {
    function Point(x, y) {
        if (x === void 0) { x = 0; }
        if (y === void 0) { y = 0; }
        this.x = 0;
        this.y = 0;
        this.x = x;
        this.y = y;
    }
    return Point;
}());
var MouseState = (function () {
    function MouseState() {
        this.canvas = new Point();
        this.absCanvas = new Point();
        this.world = new Point();
        this.offset = new Point();
        this.delta = new Point();
        this.leftDown = false;
        this.leftUp = false;
        this.panning = false;
        this.draggingNode = false;
        this.draggingConnection = false;
        this.click = true;
    }
    return MouseState;
}());
var Diagrams = (function () {
    function Diagrams(canvasId, editNodeCallback, deleteNodeCallback) {
        if (editNodeCallback === void 0) { editNodeCallback = function () { }; }
        if (deleteNodeCallback === void 0) { deleteNodeCallback = function () { }; }
        this.shouldTick = true;
        this.nodes = new Map();
        this.connections = new Array();
        this.mouseState = new MouseState();
        this.panning = false;
        this.nodeDragging = null;
        this.nodeHover = null;
        this.newConnection = null;
        this.scale = 4;
        this.scales = 10;
        this.scalingFactor = 1;
        this.editNodeCallback = function () { };
        this.deleteNodeCallback = function () { };
        this.canvas = document.getElementById(canvasId);
        if (this.canvas === null) {
            throw new Error("Could not getElementById " + canvasId);
        }
        var ctx = this.canvas.getContext("2d");
        if (ctx === null) {
            throw new Error("Could not get 2d rendering context");
        }
        _diagram = this;
        this.ctx = ctx;
        this.editNodeCallback = editNodeCallback;
        this.deleteNodeCallback = deleteNodeCallback;
        this.canvas.onmousemove = diagramOnMouseMove;
        this.canvas.onmousedown = diagramOnMouseDown;
        this.canvas.onmouseup = diagramOnMouseUp;
        this.canvas.onwheel = diagramOnWheel;
        window.onresize = diagramOnResize;
        tick();
    }
    Object.defineProperty(Diagrams.prototype, "inverseScalingFactor", {
        get: function () { return 1 / this.scalingFactor; },
        enumerable: true,
        configurable: true
    });
    ;
    Diagrams.prototype.tick = function () {
        var e_2, _a, e_3, _b, e_4, _c, e_5, _d;
        this.drawBackground();
        if (this.mouseState.leftUp && !this.mouseState.panning && !this.mouseState.draggingNode && !this.mouseState.draggingConnection) {
            this.mouseState.click = true;
        }
        try {
            for (var _e = __values(this.nodes.values()), _f = _e.next(); !_f.done; _f = _e.next()) {
                var node = _f.value;
                node.update(this.mouseState);
            }
        }
        catch (e_2_1) { e_2 = { error: e_2_1 }; }
        finally {
            try {
                if (_f && !_f.done && (_a = _e.return)) _a.call(_e);
            }
            finally { if (e_2) throw e_2.error; }
        }
        try {
            for (var _g = __values(this.connections), _h = _g.next(); !_h.done; _h = _g.next()) {
                var connection = _h.value;
                connection.update(this.mouseState);
            }
        }
        catch (e_3_1) { e_3 = { error: e_3_1 }; }
        finally {
            try {
                if (_h && !_h.done && (_b = _g.return)) _b.call(_g);
            }
            finally { if (e_3) throw e_3.error; }
        }
        if (this.newConnection != null) {
            this.newConnection.update(this.mouseState);
        }
        try {
            for (var _j = __values(this.connections), _k = _j.next(); !_k.done; _k = _j.next()) {
                var connection = _k.value;
                connection.draw(this.ctx, this.mouseState);
            }
        }
        catch (e_4_1) { e_4 = { error: e_4_1 }; }
        finally {
            try {
                if (_k && !_k.done && (_c = _j.return)) _c.call(_j);
            }
            finally { if (e_4) throw e_4.error; }
        }
        if (this.newConnection != null) {
            this.newConnection.draw(this.ctx, this.mouseState);
        }
        try {
            for (var _l = __values(this.nodes.values()), _m = _l.next(); !_m.done; _m = _l.next()) {
                var node = _m.value;
                node.draw(this.ctx, this.mouseState);
            }
        }
        catch (e_5_1) { e_5 = { error: e_5_1 }; }
        finally {
            try {
                if (_m && !_m.done && (_d = _l.return)) _d.call(_l);
            }
            finally { if (e_5) throw e_5.error; }
        }
        this.drawWarning();
        this.mouseState.leftUp = false;
        this.mouseState.click = false;
    };
    Diagrams.prototype.onmousemove = function (ev) {
        var canvasRect = this.canvas.getBoundingClientRect();
        var scale = this.scalingFactor;
        this.mouseState.absCanvas.x = ev.x - canvasRect.left;
        this.mouseState.absCanvas.y = ev.y - canvasRect.top;
        this.mouseState.canvas.x = this.mouseState.absCanvas.x / scale;
        this.mouseState.canvas.y = this.mouseState.absCanvas.y / scale;
        this.mouseState.delta.x = ev.movementX / scale;
        this.mouseState.delta.y = ev.movementY / scale;
        if (this.mouseState.panning) {
            this.mouseState.offset.x += this.mouseState.delta.x;
            this.mouseState.offset.y += this.mouseState.delta.y;
            var importOffsetInputX = document.getElementById("offset_x");
            importOffsetInputX.value = this.mouseState.offset.x.toString();
            var importOffsetInputY = document.getElementById("offset_y");
            importOffsetInputY.value = this.mouseState.offset.y.toString();
        }
        this.mouseState.world.x = this.mouseState.canvas.x - this.mouseState.offset.x;
        this.mouseState.world.y = this.mouseState.canvas.y - this.mouseState.offset.y;
    };
    Diagrams.prototype.onmousedown = function (ev) {
        var e_6, _a;
        if (ev.button != 0) {
            return;
        }
        this.mouseState.leftDown = true;
        try {
            for (var _b = __values(this.nodes.values()), _c = _b.next(); !_c.done; _c = _b.next()) {
                var object = _c.value;
                if (object.pointInObject(this.mouseState.world)) {
                    return;
                }
            }
        }
        catch (e_6_1) { e_6 = { error: e_6_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_6) throw e_6.error; }
        }
        this.mouseState.panning = true;
    };
    Diagrams.prototype.onmouseup = function (ev) {
        this.mouseState.leftDown = false;
        this.mouseState.panning = false;
        this.mouseState.leftUp = true;
        if (this.newConnection != null) {
            if (this.newConnection.input != null) {
                this.addConnection(this.newConnection.output, this.newConnection.input);
            }
            this.mouseState.draggingConnection = false;
        }
        this.newConnection = null;
    };
    Diagrams.prototype.onwheel = function (ev) {
        ev.preventDefault();
        var sign = Math.sign(ev.deltaY);
        var zoomOut = sign > 0;
        if (zoomOut && this.scale >= this.scales - 1) {
            return;
        }
        var zoomIn = !zoomOut;
        if (zoomIn && this.scale <= 0) {
            return;
        }
        this.scale += sign;
        var zoomOutFactor = 0.9;
        var zoomInFactor = 1 / zoomOutFactor;
        var zoomFactor = zoomIn ? zoomInFactor : zoomOutFactor;
        this.ctx.scale(zoomFactor, zoomFactor);
        this.scalingFactor *= zoomFactor;
        var oldCanvasPos = new Point(this.mouseState.canvas.x, this.mouseState.canvas.y);
        this.mouseState.canvas.x /= zoomFactor;
        this.mouseState.canvas.y /= zoomFactor;
        var mouseDelta = new Point((oldCanvasPos.x - this.mouseState.canvas.x), (oldCanvasPos.y - this.mouseState.canvas.y));
        this.mouseState.offset.x -= mouseDelta.x;
        this.mouseState.offset.y -= mouseDelta.y;
    };
    Diagrams.prototype.drawBackground = function () {
        this.ctx.fillStyle = "#D8D8D8";
        var scale = this.inverseScalingFactor;
        this.ctx.fillRect(0, 0, this.canvas.width * scale, this.canvas.height * scale);
        this.ctx.strokeStyle = "#888";
        this.ctx.lineWidth = 5 * scale;
        this.ctx.strokeRect(0, 0, this.canvas.width * scale, this.canvas.height * scale);
    };
    Diagrams.prototype.drawWarning = function () {
        var e_7, _a;
        var nodeWithLogs = null;
        try {
            for (var _b = __values(this.nodes.values()), _c = _b.next(); !_c.done; _c = _b.next()) {
                var node = _c.value;
                if (node.logs.length > 0) {
                    nodeWithLogs = node;
                    break;
                }
            }
        }
        catch (e_7_1) { e_7 = { error: e_7_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_7) throw e_7.error; }
        }
        if (nodeWithLogs == null) {
            return;
        }
        var warningString = "Check log of '" + nodeWithLogs.label + "' Filter!";
        this.ctx.font = "30px Helvetica";
        var warningSize = this.ctx.measureText(warningString);
        this.ctx.fillStyle = "orange";
        this.ctx.fillRect(this.canvas.width - warningSize.width - 30, 0, warningSize.width + 30, 50);
        this.ctx.fillStyle = "#000";
        this.ctx.fillText(warningString, this.canvas.width - warningSize.width - 15, 35);
    };
    Diagrams.prototype.addNode = function (id, x, y, label, meta, results, logs) {
        if (meta === void 0) { meta = {}; }
        if (results === void 0) { results = new Array(); }
        if (logs === void 0) { logs = new Array(); }
        var node = new DiagramNode(id, x, y, label, this.ctx, meta, results, logs);
        this.nodes.set(id, node);
    };
    Diagrams.prototype.addConnection = function (A, B) {
        this.connections.push(new NodeConnection(A, B));
    };
    Diagrams.prototype.addConnectionById = function (a, b) {
        var A = this.nodes.get(a);
        if (A === undefined) {
            console.error("No node with ID: " + a);
            return;
        }
        var B = this.nodes.get(b);
        if (B === undefined) {
            console.error("No node with ID: " + b);
            return;
        }
        this.connections.push(new NodeConnection(A, B));
    };
    Diagrams.prototype.removeConnection = function (A, B) {
        var e_8, _a;
        var index = 0;
        try {
            for (var _b = __values(this.connections), _c = _b.next(); !_c.done; _c = _b.next()) {
                var connection = _c.value;
                var output = connection.output;
                var input = connection.input;
                if (output.id == A.id && input.id == B.id) {
                    this.connections.splice(index, 1);
                }
                index++;
            }
        }
        catch (e_8_1) { e_8 = { error: e_8_1 }; }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
            }
            finally { if (e_8) throw e_8.error; }
        }
    };
    Diagrams.prototype.onresize = function () {
        this.fillParent();
    };
    Diagrams.prototype.fillParent = function () {
        this.canvas.width = this.canvas.clientWidth;
        this.canvas.height = this.canvas.clientHeight;
    };
    return Diagrams;
}());
function getBezierXY(t, sx, sy, cp1x, cp1y, cp2x, cp2y, ex, ey) {
    return new Point(Math.pow(1 - t, 3) * sx + 3 * t * Math.pow(1 - t, 2) * cp1x
        + 3 * t * t * (1 - t) * cp2x + t * t * t * ex, Math.pow(1 - t, 3) * sy + 3 * t * Math.pow(1 - t, 2) * cp1y
        + 3 * t * t * (1 - t) * cp2y + t * t * t * ey);
}
//# sourceMappingURL=diagram.js.map