import {
    barGroupLayoutCreator,
    ScaleContainerTypeEnum,
    ScaleTypeEnum
} from "../mmviz-layout/index";

import {BarComponentSvg} from "../mmviz-component-svg/index";
import {DetailsBehavior} from "../mmviz-behavior/index";
import {getBarPadding, OrientationEnum} from "../mmviz-common/index";

import {ChartBuilderSvg} from "./builder";

export class BarGroupChartBuilderSvg extends ChartBuilderSvg {
    // still use bar component instead of creating new bar group component
    component: BarComponentSvg;
    barPadding: number;
    colorScaleKey: string;
    customColorScale: any;
    colorRangeMapper: Function;
    orientationEnum: OrientationEnum;

    constructor(selector: string) {

        super(selector);

        this.component = new BarComponentSvg(selector);
        this.detailsBehavior = new DetailsBehavior(selector, this.component.selector);

        this.colorScaleKey = "color";
        this.orientationEnum = OrientationEnum.VERTICAL;
    }

    setBarPadding(barPadding: number){
        this.barPadding = barPadding;
        return this;
    }
    setOrientation(orientation: OrientationEnum){
        this.orientationEnum = orientation;
        return this;
    }

    setDataModel(dataModel){

        super.setDataModel(dataModel);

        if (this.barPadding === undefined){
            this.barPadding = getBarPadding(dataModel.dataArray.length);
        }
        return this;
    }

    createView(){

        super.createView();

        if (OrientationEnum.VERTICAL === this.orientationEnum) {
            this.chartView.addContentTypeClass("bar-content");
            this.chartView.addContentTypeClass("bar-vertical");
        }
        else if (OrientationEnum.HORIZONTAL === this.orientationEnum) {
            this.chartView.addContentTypeClass("bar-content");
            this.chartView.addContentTypeClass("bar-horizontal");
        }

        return this;
    }

    updateView(){

        if(!this.chartView.isViewable){
            return this;
        }

        let viewModel: any,
            layouter: Function,
            layoutExtender = barGroupLayoutCreator(this.orientationEnum, this.colorScaleKey),
            axisViewModel: any;

        super.updateView();

        if (OrientationEnum.VERTICAL === this.orientationEnum) {

            this.layoutScale
                .xScaleSetup(ScaleTypeEnum.BAND)
                .yScaleSetup(ScaleTypeEnum.LINEAR)
                .xScale.padding(this.barPadding);
        }
        else if (OrientationEnum.HORIZONTAL === this.orientationEnum) {

            this.layoutScale
                .xScaleSetup(ScaleTypeEnum.LINEAR)
                .yScaleSetup(ScaleTypeEnum.BAND)
                .yScale.padding(this.barPadding);
        }

        // setup color scale
        if (this.colorRangeMapper){
            this.layoutScale.createMapCustomOrdinalScaleContainer(this.colorScaleKey, this.dataModel, this.colorRangeMapper);
        }
        else if (this.customColorScale){
            this.layoutScale.createCustomScaleObjectContainer(this.colorScaleKey, ScaleTypeEnum.ORDINAL, this.customColorScale);
        }
        else {
            this.layoutScale.createScaleContainer(this.colorScaleKey, ScaleContainerTypeEnum.COLOR_CATEGORICAL_LIGHT);
        }

        layouter = layoutExtender(this.dataModel, this.layoutScale);

        this.displayAxies();

        viewModel = layouter();
        this.component.updateView(this.chartView.stage, viewModel);

        super.updateComponents();

        return this;
    }

    resizeView(){

        return this.updateView();
    }
}