import * as d3 from "d3";
// noinspection TsLint
import D3Support from '../D3Support';
import SankeyOptions from './SankeyOptions';
var Sankey = /** @class */ (function () {
    function Sankey(options) {
        if (options === void 0) { options = new SankeyOptions(); }
        this.edgeColor = "path";
        this.options = options;
        this.colorSchema = d3.scaleOrdinal(options.color);
    }
    Sankey.prototype.render = function () {
        var div = document.createElement("div");
        div.classList.add("lto-vis-sankey");
        return div;
    };
    Sankey.prototype.init = function (element) {
        var _this = this;
        var d3Sankey = require("d3-sankey");
        this.options.data.then(function (data) {
            var svg = d3.select(element).append("svg:svg")
                .attr("width", _this.options.width)
                .attr("height", _this.options.height)
                .style("width", "100%")
                .style("height", "auto");
            var _a = _this.sankey(data), nodes = _a.nodes, links = _a.links;
            svg.append("g")
                .attr("stroke", "#000")
                .selectAll("rect")
                .data(nodes)
                .enter().append("rect")
                .attr("x", function (d) { return d.x0; })
                .attr("y", function (d) { return d.y0; })
                .attr("height", function (d) { return d.y1 - d.y0; })
                .attr("width", function (d) { return d.x1 - d.x0; })
                .attr("fill", function (d) { return _this.color(d.name); })
                .append("title")
                .text(function (d) { return d.name + "\n" + _this.format(d.value); });
            var link = svg.append("g")
                .attr("fill", "none")
                .attr("stroke-opacity", 0.5)
                .selectAll("g")
                .data(links)
                .enter().append("g")
                .style("mix-blend-mode", "multiply");
            if (_this.edgeColor === "path") {
                var gradient = link.append("linearGradient")
                    .attr("id", function (d) { return (d.uid = D3Support.uid("link")).id; })
                    .attr("gradientUnits", "userSpaceOnUse")
                    .attr("x1", function (d) { return d.source.x1; })
                    .attr("x2", function (d) { return d.target.x0; });
                gradient.append("stop")
                    .attr("offset", "0%")
                    .attr("stop-color", function (d) { return _this.color(d.source.name); });
                gradient.append("stop")
                    .attr("offset", "100%")
                    .attr("stop-color", function (d) { return _this.color(d.target.name); });
            }
            link.append("path")
                .attr("d", d3Sankey.sankeyLinkHorizontal())
                .attr("stroke", function (d) { return _this.edgeColor === "path" ? "url(#" + d.uid.id + ")"
                : _this.edgeColor === "input" ? _this.color(d.source.name)
                    : _this.color(d.target.name); })
                .attr("stroke-width", function (d) { return Math.max(1, d.width); });
            link.append("title")
                .text(function (d) { return d.source.name + " \u2192 " + d.target.name + "\n" + _this.format(d.value); });
            svg.append("g")
                .style("font", "10px sans-serif")
                .selectAll("text")
                .data(nodes)
                .enter().append("text")
                .attr("x", function (d) { return d.x0 < _this.options.width / 2 ? d.x1 + 6 : d.x0 - 6; })
                .attr("y", function (d) { return (d.y1 + d.y0) / 2; })
                .attr("dy", "0.35em")
                .attr("text-anchor", function (d) { return d.x0 < _this.options.width / 2 ? "start" : "end"; })
                .text(function (d) { return d.name; });
        });
    };
    Sankey.prototype.sankey = function (data) {
        var d3Sankey = require("d3-sankey");
        return d3Sankey.sankey()
            .nodeWidth(15)
            .nodePadding(10)
            .extent([[1, 1], [this.options.width - 1, this.options.height - 5]])(data);
    };
    Sankey.prototype.color = function (name) {
        return this.colorSchema(name.replace(/ .*/, ""));
    };
    Sankey.prototype.format = function (d) {
        var f = d3.format(",.0f");
        return f(d) + " Events";
    };
    return Sankey;
}());
export { Sankey };
//# sourceMappingURL=Sankey.js.map