"use strict";
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 __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
Object.defineProperty(exports, "__esModule", { value: true });
var d3 = require("d3");
var D3Chart_1 = require("../D3Chart");
var _ = require("lodash");
var ToolTip_1 = require("../common/ToolTip");
var BarHeight = 12;
var Margin = 2;
var default_1 = /** @class */ (function (_super) {
    __extends(default_1, _super);
    function default_1() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.__ClassName = '_vc_bar_multi';
        _this.paddingTop = 0;
        _this.itemHeight = 40;
        _this.widthScale = null;
        return _this;
    }
    default_1.prototype.sort = function () {
        var _this = this;
        this.DATA = this.props.data;
        this.DATA.map(function (item) {
            var sum = 0;
            _this.props.valueFields.map(function (field) {
                sum += parseInt(item[field]);
            });
            item.__sum = sum;
        });
        this.DATA = _.orderBy(this.DATA, '__sum', 'desc');
        if (this.DATA.length > this.MAXCOUNT) {
            this.DATA.length = this.MAXCOUNT;
        }
        var _a = __read(this.extent(this.DATA, function (d) { return d['__sum']; }), 2), min = _a[0], max = _a[1];
        this.itemHeight = this.HEIGHT / this.DATA.length;
        this.paddingTop = (this.itemHeight - (BarHeight + 12)) / 2;
        this.widthScale = d3.scaleLinear()
            .domain([min, max])
            .range([0.4 * this.LAYOUT.w, 0.95 * this.LAYOUT.w]);
    };
    default_1.prototype.update = function () {
        var _this = this;
        var group = this.SVG.selectAll('g._item')
            .data(this.DATA, function (d) { return d[_this.props.labelField]; });
        var enter = group.enter().append('g')
            .attr('class', function (d, i) { return _this.itemClass(d, i); })
            .attr('transform', "translate(0," + this.HEIGHT * 1.3 + ")");
        enter.merge(group)
            .attr('class', function (d, i) { return _this.itemClass(d, i); })
            .transition()
            .duration(this.DURATION)
            .attr('transform', function (d, i) { return "translate(0," + _this.itemHeight * i + ")"; });
        enter.append('text')
            .attr('class', '_label')
            .attr('x', this.LAYOUT.x)
            .merge(group.select('text._label'))
            .attr('y', this.paddingTop + 12)
            .text(function (d) { return d[_this.props.labelField]; });
        enter.append('text')
            .attr('class', '_value')
            .merge(group.select('text._value'))
            .attr('x', this.LAYOUT.x + this.LAYOUT.w)
            .attr('y', this.paddingTop + 18)
            .text(function (d) { return d['__sum']; });
        var _loop_1 = function (i) {
            rect = enter.append('rect')
                .attr('class', "_compontent_rect _compontent_" + i)
                .attr('height', BarHeight);
            rect.merge(group.select("rect._compontent_" + i))
                .attr('x', function (d) {
                var sum = d['__sum'];
                var w = _this.widthScale(sum);
                var p = 0;
                for (var j = 0; j < i; j++) {
                    p += d[_this.props.valueFields[j]];
                }
                return (w * p / sum) + _this.LAYOUT.x;
            })
                .attr('y', this_1.paddingTop + 18)
                .attr('width', 0)
                .transition()
                .duration(this_1.DURATION)
                .attr('width', function (d) {
                var sum = d['__sum'];
                var w = _this.widthScale(sum);
                return w * d[_this.props.valueFields[i]] / sum < Margin ? 0 : ((w * d[_this.props.valueFields[i]] / sum) - Margin);
            });
            rect.on('mouseover', function (d) {
                if (_.has(_this.props, 'tip')) {
                    ToolTip_1.default.show(_this.props.tip(d));
                }
                else {
                    ToolTip_1.default.show("\n                        <h2>" + d[_this.props.labelField] + "</h2>\n                        " + _this.props.valueFields.map(function (label, j) { return "<p class=\"" + (((j + '') == (i + '')) ? 'high' : 'common') + "\">" + _this.props.valueTitles[j] + ": <span class=\"vapfont\">" + d[label] + "</span></p>"; }).join('') + "\n                    ");
                }
            }).on('mouseout', function (d) {
                ToolTip_1.default.hide();
            });
            if (this_1.props.onClick) {
                rect.on('click', function (d) {
                    _this.props.onClick(d, _this.props.valueFields[i]);
                });
            }
        };
        var this_1 = this, rect;
        for (var i = 0; i < this.props.valueFields.length; i++) {
            _loop_1(i);
        }
    };
    return default_1;
}(D3Chart_1.default));
exports.default = default_1;
