import {ValueType} from "./common";
import {Column} from "./model";
import {DataCollector, RowData} from "./dataControl";

export abstract class Cell { //destructure => not existed
    private _domElement: HTMLElement | null;
    private _division: HTMLElement | null;
    private _isEditBoxCreated: boolean = false;

    constructor(rowDOMElement: HTMLElement) {
        this._division = this._createDivDOMElement();
        this._createDivDOMElement();
        this._domElement = this.createDOMElement();
        this._appendParentNode(rowDOMElement);
        if (this._domElement) this._domElement.className = "gridCell";
    }
    //basic method
    private _createDivDOMElement():HTMLElement {
        let div= document.createElement("div");
        div.className = "gridInnerCell";
        return div
    }
    public abstract createDOMElement(): HTMLElement;
    private _appendParentNode(ParentNode: HTMLElement) {
        if (this._domElement && this._division) {
            this._domElement.appendChild(this._division);
            ParentNode.appendChild(this._domElement);
        }
    }
    public removeParentNode() {
        if (this._domElement && this._division && this._domElement.parentNode) {
            this._domElement.removeChild(this._division);
            this._division = null;
            this._domElement.parentNode.removeChild(this._domElement);
            this._domElement = null;
        }
    }
    //getter method
    public get domElement(): HTMLElement | null { //undefined
        return this._domElement
    }
    public get divDOMElement(): HTMLElement | null {
        return this._division;
    }
    public get width(): string|null{
        if (this._division) {
            return this._division.style.width;
        }
        return null;
    }
    public get isEditBoxCreated(): boolean {
        return this._isEditBoxCreated;
    }
    //setter
    public set isEditBoxCreated(value: boolean) {
    //method
        this._isEditBoxCreated = value;
    }
    public setValue(value: ValueType) {
        if (this._division && value != undefined) {
            this._division.textContent = "" + value;
        }
    }
    public setStyle(col: Column) {
        //반복때문에 getStyleType으로 컬럼에서 적용시킬 부분 골라줌
        let cellStyle
        if (this instanceof HeaderCell){
            cellStyle = col.header;
        }
        else if (this instanceof BodyCell){
            cellStyle = col.body;
        }
        else{
            throw Error("cell's type was not defined")
        }
        //instanceof Header / Body
        if (this._division) {
            this._division.style.width = col.width + "px";
            this._division.style.display = col.visible ? "" : "none";
            this._division.style["color"] = cellStyle.color;
            this._division.style["backgroundColor"] = cellStyle.backgroundColor;
            this._division.style["textAlign"] = cellStyle.textAlign;
            this._division.style["fontSize"] = cellStyle.fontSize;
            this._division.style["fontWeight"] = cellStyle.fontWeight;
        }
    }
    public assignStyle(prop: string, value: ValueType) {
        if (this._division && this._domElement) {
            if (prop == "width") {
                if (typeof value == "number") this._division.style.width = value + "px";
            }
            else if (prop == "visible") {
                if (typeof value == "boolean") this._domElement.style.display = value ? "" : "none";
            }
            else {
                prop == "text" ? this.setValue(value) : (<any>this._division).style[prop] = value;
            }
        }
    }
    public setDivVisible(visibility: boolean) { //고려
        if (this._division) {
            this._division.style.display = visibility ? "" : "none";
        } //throws exception?
    }
}
class HeaderCell extends Cell {
    public createDOMElement():HTMLElement {
        return document.createElement("th");
    }
}
class BodyCell extends Cell {
    public createDOMElement():HTMLElement {
        return document.createElement("td");
    }
}
abstract class Row {
    private _cells: {[fieldName:string]:Cell} ={};
    private _domElement: HTMLElement | null = null;
    constructor(upperElement: HTMLElement) {
        this._cells = {};
        this.createDOMElement();
        this.appendParentNode(upperElement)
    }
    //basic method
    protected createDOMElement(){
        this._domElement = document.createElement("tr");
    }
    public abstract appendParentNode(upperElement: HTMLElement): void;
    //getter method
    public getCell(fieldName: string): Cell {
        return this._cells[fieldName];
    }
    public get domElement(): HTMLElement | null {
        return this._domElement;
    }
    //method
    public setCells(rowData: RowData, columns: Array<Column>) {
        this.removeAllCell();
        this.addCells(rowData, columns);
    }
    public addCells(rowData: RowData, columns: Array<Column>) {
        if (rowData != undefined) {
            let colsLen = columns.length;
            for (let i = 0; i < colsLen; i++) {
                let fieldName = columns[i].fieldName;
                let value = rowData.getDatum(fieldName);
                if (value!= undefined) {
                    this.addCell(fieldName, value, columns[i]);
                }
                else {
                    this.addCell(fieldName, "", columns[i]);
                }
            }
        }
    } 
    public addCell(fieldName: string, value: ValueType, col: Column) {
        let innerCell = this.createCell();
        if (innerCell) {
            innerCell.setValue(value);
            innerCell.setStyle(col);
            this._cells[fieldName] = innerCell;
        }
    }
    public abstract createCell(): Cell;
    public removeCell(fieldName: string) {
        let cell = this._cells[fieldName];
        if (cell != undefined) {
            cell.removeParentNode();
            delete this._cells[fieldName];
        }
    }
    public removeAllCell() {
        for (let fieldName in this._cells) {
            this.removeCell(fieldName);
        }
    }
    public updateCell(fieldName: string, value: string | number | boolean) {
        this._cells[fieldName].setValue(value);
    }
    public setStyle(fieldName: string, col: Column) {
        let cell = this._cells[fieldName]
        if (cell != undefined) {
            cell.setStyle(col);
        }
    }
    public assignStyle(fieldName: string, prop: string, value: string | number | boolean) {
        this._cells[fieldName].assignStyle(prop, value);
    }
}
export class HeaderRow extends Row {
    private _tableHeaderDOMElement: HTMLElement | null = null;
    protected createDOMElement(){
        super.createDOMElement();
        this._tableHeaderDOMElement = document.createElement("thead");
    }
    public appendParentNode(tableDOMElement: HTMLElement): void {
        if (this.domElement && this._tableHeaderDOMElement) {
            this._tableHeaderDOMElement.appendChild(this.domElement);
            tableDOMElement.appendChild(this._tableHeaderDOMElement);
        }
    }
    public createCell(): HeaderCell{
        if (this.domElement) {
            return new HeaderCell(this.domElement);
        }
        throw Error("HeaderRow DomElement Not Found");
    }
}
class BodyRow extends Row {
    public appendParentNode(rowsDOMElement: HTMLElement) {
        if (this.domElement) {
            rowsDOMElement.appendChild(this.domElement)
        }
    }
    public createCell(): BodyCell {
        if (this.domElement) {
            return new BodyCell(this.domElement);
        }
        throw Error("BodyRow DomElement Not Found");
    }
}
export class BodyRows {
    private _rows:Array<BodyRow>
    private _domElement:HTMLElement
    constructor(tableDOMElement:HTMLElement) {
        this._rows =[];
        this._domElement = document.createElement("tbody");
        tableDOMElement.appendChild(this._domElement);
    }
    //getter
    public getCell(rowIdx:number, fieldName:string):Cell{
        return this._rows[rowIdx].getCell(fieldName);
    }
    public get domElement(){
        return this._domElement;
    }
    public get rowCount(){
        return this._rows.length;
    }
    //method
    public setRows(dataCollector:DataCollector, cols:Array<Column>){
        this.removeAllRow();
        let newRowsLen = dataCollector.dataLength;
        for(let i = 0; i<newRowsLen; i++){
            this.addRow(dataCollector.getRowData(i), cols);
        }
    }
    public addRow(row:RowData, cols:Array<Column>){
        let innerRow = new BodyRow(this._domElement);
        innerRow.setCells(row, cols);
        this._rows.push(innerRow);
    }
    public addRows(dataCollector:DataCollector, columns:Array<Column>, preRowsNum:number, addedCount:number){
        for(let i = preRowsNum; i<addedCount; i++){
            this.addRow(dataCollector.getRowData(i), columns);
        }
    }
    public removeRow(rowIdx:number){
        let row = this._rows[rowIdx];
        row.removeAllCell();
        if(row.domElement){
            this.domElement.removeChild(row.domElement)
        }
        this._rows.splice(rowIdx, 1);
    }
    public removeRows(indexes:Array<number>){
        let rowsLen = this._rows.length;
        let len = indexes.length;
        for(let i = 0; i<len;i++){
            if(indexes[i]>rowsLen-1){
                continue;
            }
            this.removeRow(indexes[i]);
        }
    }
    public removeAllRow(){
        let rowsLen = this._rows.length;
        if (rowsLen > 0){
            for (let i = rowsLen-1; i>-1; i--){
                this.removeRow(i);
            }
        }
    }
    public removeCellsByColumn(fieldName:string){
        let rowsLen = this._rows.length
        for (let rowsIdx =0; rowsIdx< rowsLen; rowsIdx++){
            this._rows[rowsIdx].removeCell(fieldName);
        }
    }
    public buildColumnCell(fieldName:string, col:Column, data:DataCollector){
        let rowsLen = this._rows.length;
        for (let i = 0; i < rowsLen; i++){
            let value = data.getDatum(i, fieldName);
            this._rows[i].addCell(fieldName, value, col);
        }
    }
    public updateCell(rowIndex: number, fieldName: string, value: ValueType){
        this._rows[rowIndex].updateCell(fieldName, value);
    }
    public setStyle(fieldName:string, col:Column){
        let rowsLen = this._rows.length;
        for (let j = 0; j < rowsLen; j++){
            let row = this._rows[j];
            if (row != undefined){
                row.setStyle(fieldName, col);
            }
        }
    }
    public assignStyle(fieldName:string, prop:string, value:ValueType){
        let rowsLen = this._rows.length;
        for(let i = 0; i < rowsLen; i++){
            this._rows[i].assignStyle(fieldName, prop, value);
        }
    }
}