/*
THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
https://www.infragistics.com/legal/license/igultimate-la
https://www.infragistics.com/legal/license/igultimate-eula
GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE:  you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
*/
import * as tslib_1 from "tslib";
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { ReactRenderer, ReactWrapper } from "igniteui-react-core/ES5/react-renderer";
import { TypeRegistrar } from "igniteui-react-core/ES5/type";
import { CategoryChart } from './CategoryChart';
import { CategoryChartType_$type } from './CategoryChartType';
import { CategorySeriesMarkerCollisionAvoidance_$type } from './CategorySeriesMarkerCollisionAvoidance';
import { CategoryTransitionInMode_$type } from './CategoryTransitionInMode';
import { TransitionInSpeedType_$type } from './TransitionInSpeedType';
import { fromBrushCollection, toBrushCollection, ensureEnum, ensureBool, initializePropertiesFromCss } from "igniteui-react-core/ES5/componentUtil";
import { IgrXYChart } from './igr-xy-chart';
import { DataChartStylingDefaults } from './DataChartStylingDefaults';
import { DataSeriesType } from "igniteui-react-core/ES5/DataSeriesType";
import { DataContext } from "igniteui-react-core/ES5/igr-data-context";
import { IgrCategoryXAxis } from './igr-category-x-axis';
import { IgrNumericYAxis } from './igr-numeric-y-axis';
export var IgxCategoryChartComponent_PROVIDERS = [];
/**
 * Represents a chart with an ordinal X-axis and a numeric Y-axis.
*/
var IgrCategoryChart = /** @class */ (function (_super) {
    tslib_1.__extends(IgrCategoryChart, _super);
    function IgrCategoryChart(props) {
        var _this = _super.call(this, props) || this;
        _this._dataSource = null;
        _this._defaultTooltips = null;
        _this._uniqueTooltipId = 0;
        _this._getMainRef = _this._getMainRef.bind(_this);
        _this._tooltipRef = _this._tooltipRef.bind(_this);
        _this._activeTooltipElements = new Map();
        _this._activeTooltips = new Map();
        _this._currentTooltips = [];
        if (document) {
            _this._container = document.createElement("div");
            _this._container.style.display = "block";
            _this._container.style.width = "100%";
            _this._container.style.height = "100%";
        }
        var root;
        root = _this._container;
        if (_this._container != null) {
            root = _this._container;
        }
        var ren = new ReactRenderer(root, document, true, DataChartStylingDefaults);
        _this._wrapper = ren;
        var chart = _this.i;
        _this._chart = chart;
        if (chart.xAxis) {
            var x = new IgrCategoryXAxis(null);
            x._provideRenderer(ren);
            x._implementation = chart.xAxis;
            chart.xAxis.externalObject = x;
        }
        if (chart.yAxis) {
            var y = new IgrNumericYAxis(null);
            y._provideRenderer(ren);
            y._implementation = chart.yAxis;
            chart.yAxis.externalObject = y;
        }
        chart.provideContainer(ren);
        _this.bindData();
        chart.notifyResized();
        ren.addSizeWatcher(function () {
            _this._chart.notifyResized();
        });
        _this._initialized = true;
        return _this;
    }
    Object.defineProperty(IgrCategoryChart.prototype, "height", {
        get: function () {
            return this._height;
        },
        set: function (value) {
            this._height = value;
            if (this._elRef) {
                this._elRef.style.height = value;
                this._chart.notifyResized();
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "width", {
        get: function () {
            return this._width;
        },
        set: function (value) {
            this._width = value;
            if (this._elRef) {
                this._elRef.style.height = value;
                this._chart.notifyResized();
            }
        },
        enumerable: true,
        configurable: true
    });
    IgrCategoryChart.prototype._tooltipRef = function (t) {
        console.log(t);
        if (t === null) {
            return;
        }
        if (t.currentOwner &&
            t.currentOwner.tooltipTemplate) {
            t.template = t.currentOwner.tooltipTemplate;
        }
        this._activeTooltips.set(t.currentOwner, t);
    };
    IgrCategoryChart.prototype._getMainRef = function (ref) {
        this._elRef = ref;
    };
    IgrCategoryChart.prototype.render = function () {
        // if (!this._childrenDiffer(this.props.children)) {
        // 	let div = React.createElement("div", {
        // 		ref: (ref) => {
        // 			this._elRef = ref;
        // 		},
        // 		children: this.props.children
        // 	});
        // 	return div;
        // } else {
        var children = [];
        if (this._currentTooltips && this._currentTooltips.length > 0) {
            for (var i = 0; i < this._currentTooltips.length; i++) {
                var t = this._currentTooltips[i];
                if (this._activeTooltipElements.has(t)) {
                    children.push(this._activeTooltipElements.get(t));
                }
                else {
                    if (!TypeRegistrar.isRegistered("IgrTooltipContainer")) {
                        continue;
                    }
                    var Tooltip = TypeRegistrar.get("IgrTooltipContainer");
                    var tEle = React.createElement(Tooltip, {
                        ref: this._tooltipRef,
                        key: this._currentTooltips[i].key,
                        owner: this._currentTooltips[i]
                    });
                    var portal = ReactDOM.createPortal(tEle, t, this._currentTooltips[i].key);
                    this._activeTooltipElements.set(t, portal);
                    children.push(portal);
                }
            }
        }
        var div = React.createElement("div", {
            ref: this._getMainRef,
            children: children
        });
        return div;
        //}
    };
    IgrCategoryChart.prototype.componentDidMount = function () {
        _super.prototype.componentDidMount.call(this);
        this._elRef.style.width = this._width ? this._width : "";
        this._elRef.style.height = this._height ? this._height : "";
        this._elRef.appendChild(this._container);
        this._chart.notifyResized();
        this.initializeContent();
    };
    IgrCategoryChart.prototype.componentWillUnmount = function () {
        this._chart.destroy();
        this._wrapper.destroy();
    };
    IgrCategoryChart.prototype.createImplementation = function () {
        return new CategoryChart();
    };
    Object.defineProperty(IgrCategoryChart.prototype, "i", {
        get: function () {
            return this._implementation;
        },
        enumerable: true,
        configurable: true
    });
    IgrCategoryChart.prototype.createSeriesComponent = function (type) {
        if (TypeRegistrar.isRegistered(type)) {
            var s = TypeRegistrar.create(type);
            s.owner = this;
            s._provideRenderer(this._wrapper);
            return s;
        }
        else {
            //we shouldn't get here, hopefully.
            throw Error("series type not loaded: " + type);
        }
    };
    IgrCategoryChart.prototype.createSeries = function (type) {
        switch (type) {
            case DataSeriesType.Area:
                return this.createSeriesComponent('IgrAreaSeries');
            case DataSeriesType.Column:
                return this.createSeriesComponent('IgrColumnSeries');
            case DataSeriesType.Line:
                return this.createSeriesComponent('IgrLineSeries');
            case DataSeriesType.Point:
                return this.createSeriesComponent('IgrPointSeries');
            case DataSeriesType.Spline:
                return this.createSeriesComponent('IgrSplineSeries');
            case DataSeriesType.SplineArea:
                return this.createSeriesComponent('IgrSplineAreaSeries');
            case DataSeriesType.StepArea:
                return this.createSeriesComponent('IgrStepAreaSeries');
            case DataSeriesType.StepLine:
                return this.createSeriesComponent('IgrStepLineSeries');
            case DataSeriesType.Waterfall:
                return this.createSeriesComponent('IgrWaterfallSeries');
            default:
                return this.createSeriesComponent('IgrColumnSeries');
        }
    };
    Object.defineProperty(IgrCategoryChart.prototype, "dataSource", {
        get: function () {
            return this._dataSource;
        },
        set: function (value) {
            this._dataSource = value;
            this.bindData();
        },
        enumerable: true,
        configurable: true
    });
    IgrCategoryChart.prototype.bindData = function () {
        if (this._chart != null && this._chart !== undefined) {
            this._chart.itemsSource = this._dataSource;
        }
    };
    IgrCategoryChart.prototype.initializeContent = function () {
        if (TypeRegistrar.isRegistered("IgrDataChartDefaultTooltips")) {
            var d = TypeRegistrar.create("IgrDataChartDefaultTooltips");
            this._defaultTooltips = d;
            this._onDefaultTooltipsReady(d);
            //this._container.appendChild(cr.location.nativeElement);
        }
        // supports angular themes or custom properties set in CSS 
        initializePropertiesFromCss(this._elRef, this, "category-chart-");
        this._chart.notifyResized();
    };
    IgrCategoryChart.prototype.createTooltip = function () {
        // if (!TypeRegistrar.isRegistered("IgrTooltipContainer")) {
        // 	return null;
        // }
        // let Tooltip = TypeRegistrar.get("IgrTooltipContainer");
        var wrapper = this._wrapper.createElement("div");
        var ele = wrapper.getNativeElement();
        ele.key = "__tooltip_" + this._uniqueTooltipId;
        this._uniqueTooltipId++;
        this._currentTooltips = this._currentTooltips.slice(0);
        this._currentTooltips.push(ele);
        //let element = React.createElement(Tooltip,  );
        //let portal = ReactDOM.createPortal(element, ele);
        var self = this;
        ele.updateToolTip = function (c) {
            if (c.externalObject) {
                c = c.externalObject;
            }
            else {
                var ext = new DataContext();
                ext._implementation = c;
                c = ext;
            }
            if (ele.parentElement != self._container) {
                if (ele.parentElement != null) {
                    ele.parentElement.removeChild(ele);
                }
                self._container.appendChild(ele);
            }
            if (self._activeTooltips.has(ele)) {
                var t = self._activeTooltips.get(ele);
                t.dataContext = c;
            }
            ele.style.display = "block";
            return true;
        };
        ele.hideToolTip = function () {
            ele.style.display = "none";
        };
        ele.style.display = "none";
        this._updateTooltipState();
        return ele;
    };
    IgrCategoryChart.prototype._ensureTooltipCreated = function (series) {
        var _this = this;
        series._ensureTooltipCreated(function () { return _this.createTooltip(); }, function (ele) {
            var wrapper = new ReactWrapper(ele, _this._wrapper);
            wrapper.updateToolTip = ele.updateToolTip;
            wrapper.hideToolTip = ele.hideToolTip;
            return wrapper;
        });
    };
    IgrCategoryChart.prototype._createXAxis = function () {
        var x = new IgrCategoryXAxis(null);
        x._provideRenderer(this._wrapper);
        return x.i;
    };
    IgrCategoryChart.prototype._createYAxis = function () {
        var y = new IgrNumericYAxis(null);
        y.provideRenderer(this._wrapper);
        return y.i;
    };
    IgrCategoryChart.prototype._ensureDefaultTooltip = function (series) {
        if (this._defaultTooltips == null) {
            return;
        }
        this._defaultTooltips["ensureDefaultTooltip"](series);
    };
    IgrCategoryChart.prototype._onDefaultTooltipsReady = function (cr) {
        if (this.i.dataChart) {
            var currSeries = this.i.dataChart.series;
            for (var i = 0; i < currSeries.count; i++) {
                if (currSeries.item(i).externalObject.showDefaultTooltip) {
                    this._ensureDefaultTooltip(currSeries.item(i).externalObject);
                }
            }
        }
    };
    IgrCategoryChart.prototype._updateTooltipState = function () {
        if (this._initialized) {
            this.setState({ tooltips: this._currentTooltips });
        }
    };
    Object.defineProperty(IgrCategoryChart.prototype, "transitionInDuration", {
        /**
     * Gets or sets the duration used for animating series plots when the chart is loading into view
    */
        get: function () {
            return this.i.oh;
        },
        set: function (v) {
            this.i.oh = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "transitionInEasingFunction", {
        /**
         * Gets or sets the easing function used for animating series plots when the chart is loading into view
         * This can be set to one of the known values "linear" or "cubic," or it can be set to an easing function which takes a single numeric parameter and returns a number.
        */
        get: function () {
            return this.i.ni;
        },
        set: function (v) {
            this.i.ni = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "chartType", {
        /**
         * Gets or sets the type of chart series to generate from the data.
        */
        get: function () {
            return this.i.m3;
        },
        set: function (v) {
            this.i.m3 = ensureEnum(CategoryChartType_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "markerCollisionAvoidance", {
        /**
         * Gets or sets the behavior for markers in each series which are placed too close together for the current view, resulting in a collision.
        */
        get: function () {
            return this.i.m5;
        },
        set: function (v) {
            this.i.m5 = ensureEnum(CategorySeriesMarkerCollisionAvoidance_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "isTransitionInEnabled", {
        /**
         * Gets or sets whether animation of series plots is enabled when the chart is loading into view
        */
        get: function () {
            return this.i.no;
        },
        set: function (v) {
            this.i.no = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "transitionInMode", {
        /**
         * Gets or sets the method that determines how to animate series plots when the chart is loading into view
        */
        get: function () {
            return this.i.m7;
        },
        set: function (v) {
            this.i.m7 = ensureEnum(CategoryTransitionInMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "transitionInSpeedType", {
        /**
         * Gets or sets the arrival speed used for animating series plots when the chart is loading into view
        */
        get: function () {
            return this.i.ng;
        },
        set: function (v) {
            this.i.ng = ensureEnum(TransitionInSpeedType_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisInterval", {
        /**
         * Gets or sets the frequency of displayed labels along the X-axis.
         * Gets or sets the set value is a factor that determines which labels will be hidden. For example, an interval of 2 will display every other label.
        */
        get: function () {
            return this.i.n6;
        },
        set: function (v) {
            this.i.n6 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisMinorInterval", {
        /**
         * Gets or sets the frequency of displayed minor lines along the X-axis.
         * Gets or sets the set value is a factor that determines how the minor lines will be displayed.
        */
        get: function () {
            return this.i.n7;
        },
        set: function (v) {
            this.i.n7 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisGap", {
        /**
         * Gets or sets the amount of space between adjacent categories for the X-axis.
         * The gap is silently clamped to the range [0, 1] when used.
        */
        get: function () {
            return this.i.n5;
        },
        set: function (v) {
            this.i.n5 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisOverlap", {
        /**
         * Gets or sets the amount of overlap between adjacent categories for the X-axis.
         * Gets or sets the overlap is silently clamped to the range [-1, 1] when used.
        */
        get: function () {
            return this.i.n8;
        },
        set: function (v) {
            this.i.n8 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisInterval", {
        /**
         * Gets or sets the distance between each label and grid line along the Y-axis.
        */
        get: function () {
            return this.i.ob;
        },
        set: function (v) {
            this.i.ob = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisIsLogarithmic", {
        /**
         * Gets or sets whether the Y-axis should use a logarithmic scale instead of a linear one.
         * Since log(-1) is imaginary and log(0) is undefined, it is recommended to enable this property only when the Y-axis minimum is greater than zero.
        */
        get: function () {
            return this.i.nq;
        },
        set: function (v) {
            this.i.nq = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisLogarithmBase", {
        /**
         * Gets or sets the base value to use in the log function when mapping the position of data items along the Y-axis.
         * This property is effective only when YAxisIsLogarithmic is true.
        */
        get: function () {
            return this.i.oi;
        },
        set: function (v) {
            this.i.oi = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisMinimumValue", {
        /**
         * Gets or sets the data value corresponding to the minimum value of the Y-axis.
        */
        get: function () {
            return this.i.od;
        },
        set: function (v) {
            this.i.od = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisMaximumValue", {
        /**
         * Gets or sets the data value corresponding to the maximum value of the Y-axis.
        */
        get: function () {
            return this.i.oc;
        },
        set: function (v) {
            this.i.oc = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisMinorInterval", {
        /**
         * Gets or sets the frequency of displayed minor lines along the Y-axis.
        */
        get: function () {
            return this.i.oe;
        },
        set: function (v) {
            this.i.oe = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisActualMinimum", {
        /**
         * Gets the current minimum value for the X-axis.
        */
        get: function () {
            return this.i.n4;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "xAxisActualMaximum", {
        /**
         * Gets the current maximum value for the X-axis.
        */
        get: function () {
            return this.i.n3;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisActualMinimum", {
        /**
         * Gets the current minimum value for the Y-axis.
        */
        get: function () {
            return this.i.oa;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisActualMaximum", {
        /**
         * Gets the current maximum value for the Y-axis.
        */
        get: function () {
            return this.i.n9;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "negativeBrushes", {
        /**
         * Gets or sets the palette used for coloring negative items of Waterfall chart type.
        */
        get: function () {
            return fromBrushCollection(this.i.m0);
        },
        set: function (v) {
            this.i.m0 = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "negativeOutlines", {
        /**
         * Brushes to use for drawing negative elements, when using a chart type with contextual coloring, such as Waterfall.
        */
        get: function () {
            return fromBrushCollection(this.i.m1);
        },
        set: function (v) {
            this.i.m1 = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "animateSeriesWhenAxisRangeChanges", {
        /**
         * Gets or sets whether the series animations should be allowed when a range change has been detected on an axis.
        */
        get: function () {
            return this.i.nn;
        },
        set: function (v) {
            this.i.nn = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrCategoryChart.prototype, "yAxisAbbreviateLargeNumbers", {
        /**
         * Gets or sets whether the large numbers on the Y-axis labels are abbreviated.
        */
        get: function () {
            return this.i.np;
        },
        set: function (v) {
            this.i.np = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    /**
 * Export serialized visual data.

*/
    IgrCategoryChart.prototype.exportSerializedVisualData = function () {
        var iv = this.i.ol();
        return (iv);
    };
    /**
     * Converts the given visual location to a data value.
    
    * @param unscaledValue  * The x-coordinate of the location to scale.
    */
    IgrCategoryChart.prototype.getScaledValueX = function (unscaledValue) {
        var iv = this.i.nz(unscaledValue);
        return (iv);
    };
    /**
     * Converts the given data value to a visual location.
    
    * @param scaledValue  * The data value to unscale.
    */
    IgrCategoryChart.prototype.getUnscaledValueX = function (scaledValue) {
        var iv = this.i.n1(scaledValue);
        return (iv);
    };
    /**
     * Converts the given visual location to a data value.
    
    * @param unscaledValue  * The y-coordinate of the location to scale.
    */
    IgrCategoryChart.prototype.getScaledValueY = function (unscaledValue) {
        var iv = this.i.n0(unscaledValue);
        return (iv);
    };
    /**
     * Converts the given data value to a visual location.
    
    * @param scaledValue  * The data value to unscale.
    */
    IgrCategoryChart.prototype.getUnscaledValueY = function (scaledValue) {
        var iv = this.i.n2(scaledValue);
        return (iv);
    };
    return IgrCategoryChart;
}(IgrXYChart));
export { IgrCategoryChart };
