/*
 * Copyright (c) 2017. tom@axisj.com
 * - github.com/thomasjang
 * - www.axisj.com
 */
describe('ax5grid TEST', function () {
    var myUI;
    var tmpl = '<div data-ax5grid="first-grid" data-ax5grid-config="" style="height: 300px;"></div>';
    var style = '<style> .gray {background: gray;}</style>';

    $(document.body).append(tmpl);
    $(document.head).append(style);

    it('1 new ax5grid', function (done) {
        try {
            myUI = new ax5.ui.grid();
            done();
        } catch (e) {
            done(e);
        }
    });

    it('2 setConfig ax5grid', function (done) {
        myUI.setConfig({
            target: $('[data-ax5grid="first-grid"]'),
            frozenColumnIndex: 3,
            frozenRowIndex: 1,
            showLineNumber: true,
            showRowSelector: true,
            multipleSelect: true,
            lineNumberColumnWidth: 40,
            rowSelectorColumnWidth: 28,
            sortable: true, // 모든 컬럼에 정렬 아이콘 표시
            multiSort: false, // 다중 정렬 여부
            remoteSort: false, // remoteSort에 함수를 sortable 컬럼이 클릭되었을때 실행 setColumnSort를 직접 구현. (remoteSort를 사용하면 헤더에 정렬 상태만 표시 하고 데이터 정렬은 처리 안함)
            header: {
                align: "center",
                columnHeight: 28
            },
            body: {
                trStyleClass: function () {
                    return this.item.amount > 100 ? "gray" : "";
                },
                mergeCells: true,
                align: "center",
                columnHeight: 28,
                onClick: function () {

                },
                onDBLClick: function () {

                },
                grouping: {
                    by: ["b"],
                    columns: [
                        {
                            label: function () {
                                return this.groupBy.labels.join(", ") + " 합계";
                            }, colspan: 2
                        },
                        {key: "price", collector: "avg", formatter: "money", align: "right"},
                        {key: "amount", collector: "sum", formatter: "money", align: "right"},
                        {
                            key: "cost", collector: function () {
                            var value = 0;
                            this.list.forEach(function (n) {
                                if (!n.__isGrouping) value += (n.price * n.amount);
                            });
                            return ax5.util.number(value, {"money": 1});
                        }, align: "right"
                        },
                        {label: "~~~", colspan: 3}
                    ]
                }
            },
            page: {
                navigationItemCount: 9,
                height: 30,
                display: true,
                firstIcon: '<i class="fa fa-step-backward" aria-hidden="true"></i>',
                prevIcon: '<i class="fa fa-caret-left" aria-hidden="true"></i>',
                nextIcon: '<i class="fa fa-caret-right" aria-hidden="true"></i>',
                lastIcon: '<i class="fa fa-step-forward" aria-hidden="true"></i>',
                onChange: function () {

                }
            },
            columns: [
                {
                    key: "a",
                    label: "필드A",
                    width: 80,
                    styleClass: function () {
                        return "ABC";
                    },
                    enableFilter: true,
                    align: "center",
                    editor: {
                        type: "text", disabled: function () {
                            // item, value
                            return false;
                        }
                    }
                },
                {key: "b", label: "필드B", align: "center", editor: {type: "text"}},
                {
                    key: undefined,
                    label: "필드C", columns: [
                    {key: "price", label: "단가", align: "right", editor: {type: "money", updateWith: ['cost']}},
                    {
                        key: "amount",
                        label: "수량",
                        align: "right",
                        formatter: "money",
                        editor: {type: "number", updateWith: ['cost']}
                    },
                    {
                        key: "cost", label: "금액", align: "right", formatter: function () {
                        return ax5.util.number(this.item.price * this.item.amount, {"money": true});
                    }
                    }
                ]
                },
                {
                    key: "saleDt", label: "판매일자", align: "center", editor: {
                    type: "date", config: {}
                }
                },
                {
                    key: "isChecked", label: "체크박스", width: 50, sortable: false, editor: {
                    type: "checkbox", config: {height: 17, trueValue: "Y", falseValue: "N"}
                }
                },
                {
                    key: "saleType", label: "판매타입", editor: {
                    type: "select", config: {
                        columnKeys: {
                            optionValue: "CD", optionText: "NM"
                        },
                        options: [
                            {CD: "A", NM: "A: String"},
                            {CD: "B", NM: "B: Number"},
                            {CD: "C", NM: "C: substr"},
                            {CD: "A", NM: "A: String"},
                            {CD: "B", NM: "B: Number"},
                            {CD: "C", NM: "C: substr"},
                            {CD: "A", NM: "A: String"},
                            {CD: "B", NM: "B: Number"},
                            {CD: "C", NM: "C: substr"},
                            {CD: "A", NM: "A: String"},
                            {CD: "B", NM: "B: Number"},
                            {CD: "C", NM: "C: substr"},
                            {CD: "D", NM: "D: substring"}
                        ]
                    }
                }
                },

                {
                    key: "customer", label: "고객명", editor: {type: "text"}
                }
            ],
            footSum: [
                [
                    {label: "전체 합계", colspan: 2, align: "center"},
                    {key: "price", collector: "avg", formatter: "money", align: "right"},
                    {key: "amount", collector: "sum", formatter: "money", align: "right"},
                    {
                        key: "cost", collector: function () {
                        var value = 0;
                        this.list.forEach(function (n) {
                            if (!n.__isGrouping) value += (n.price * n.amount);
                        });
                        return ax5.util.number(value, {"money": 1});
                    }, align: "right"
                    }
                ]]
        });

        done();
    });

    it('3 setData ax5grid', function (done) {
        myUI.setData([
            {
                a: "A",
                b: "A",
                price: 1000,
                amount: 2000,
                cost: 500,
                saleDt: "2013-01-01",
                isChecked: "Y",
                saleType: "A",
                customer: "name01",
                __modified__: true
            },
            {
                a: "B",
                b: "B",
                price: 1200,
                amount: 2200,
                cost: 1000,
                saleDt: "2014-01-01",
                isChecked: "N",
                saleType: "B",
                customer: "name02",
                __modified__: true
            },
            {
                a: "C",
                b: "C",
                price: 1400,
                amount: 2400,
                cost: 1500,
                saleDt: "2015-01-01",
                isChecked: "N",
                saleType: "C",
                customer: "name03",
                __deleted__: false
            }
        ]);
        // has body.grouping
        done(myUI.getList().length == 3 ? "" : "error setData");
    });

    it('4 select ax5grid', function (done) {
        myUI.select(0);
        done(myUI.getList()[0]["__selected__"] ? "" : "error select");
    });

    it('5 copySelect ax5grid', function (done) {
        myUI.selectedColumn = {
            "0_3_0": {panelName: "top-body-scroll", dindex: 0, rowIndex: 0, colIndex: 3, colspan: 1}
        };
        myUI.copySelect();
        done(myUI.$["form"]["clipboard"].get(0).innerHTML.replace(/\n+|(<br>)/g, "") == 2000 ? "" : "error copySelect");
        // {chrome: 2000\n, firefox: 2000<br>}
    });

    it('6 addRow ax5grid', function (done) {
        myUI.addRow({
            a: "D",
            b: "D",
            price: 1600,
            amount: 2600,
            cost: 2000,
            saleDt: "2016-01-01",
            isChecked: "Y",
            saleType: "D",
            customer: "name04",
            __selected__: true
        });
        done(myUI.getList().length == 4 ? "" : "error addRow");
    });

    it('7 deleteRow[last] ax5grid', function (done) {
        myUI.deleteRow("last");
        done(myUI.getList("deleted").length == 1 ? "" : "error deleteRow");
    });

    it('8 getList ax5grid', function (done) {
        done(myUI.getList().length == 3 ? "" : "error getList");
    });

    it('9 getList[modified] ax5grid', function (done) {
        done(myUI.getList("modified").length == 2 ? "" : "error getList[modified]");
    });

    it('10 getList[selected] ax5grid', function (done) {
        done(myUI.getList("selected").length == 1 ? "" : "error getList[selected]");
    });

    it('11 getList[deleted] ax5grid', function (done) {
        done(myUI.getList("deleted").length == 1 ? "" : "error getList[deleted]");
    });

    it('12 setHeight ax5grid', function (done) {
        myUI.setHeight(500);
        done(myUI.$target.css("height") == "500px" ? "" : "error setHeight");
    });

    it('13 appendToList ax5grid', function (done) {
        myUI.appendToList([
            {
                a: "D",
                b: "D",
                price: 1600,
                amount: 2600,
                cost: 2000,
                saleDt: "2016-01-01",
                isChecked: "Y",
                saleType: "D",
                customer: "name04"
            },
            {
                a: "E",
                b: "E",
                price: 1800,
                amount: 2800,
                cost: 2500,
                saleDt: "2017-01-01",
                isChecked: "Y",
                saleType: "A",
                customer: "name05"
            },
            {
                a: "F",
                b: "F",
                price: 2000,
                amount: 3000,
                cost: 3000,
                saleDt: "2017-02-01",
                isChecked: "N",
                saleType: "B",
                customer: "name06"
            }
        ]);

        done(myUI.getList().length == 6 ? "" : "error appendToList");
    });

    it('14 removeRow ax5grid', function (done) {
        // 리스트에서 완전 제거
        myUI.removeRow();
        done(myUI.getList().length == 5 ? "" : "error removeRow, length : " + myUI.getList().length);
    });

    it('15 updateRow ax5grid', function (done) {
        myUI.updateRow({
            a: "G",
            b: "G",
            price: 3000,
            amount: 4000,
            cost: 5000,
            saleDt: "2017-02-02",
            isChecked: "Y",
            saleType: "A",
            customer: "name06"
        }, 0);
        var data = myUI.getList()[0];
        done(data.a == "G" && data.b == "G" ? "" : "error updateRow");
    });

    it('16 setValue ax5grid', function (done) {
        myUI.setValue(0, "price", 6500);
        done(myUI.getList()[0].price == 6500 ? "" : "error updateRow");
    });

    it('17 addColumn', function (done) {
        myUI.addColumn({key: "color", label: "색상", align: "center"});
        var lastCol = myUI.columns[myUI.columns.length - 1];
        done(lastCol.key == "color" && lastCol.label == "색상" && lastCol.align == "center" ? "" : "error addColumn");
    });

    it('18 removeColumn', function (done) {
        myUI.removeColumn();
        done(myUI.columns.length == 7 ? "" : "error removeColumn");
    });

    it('19 updateColumn', function (done) {
        myUI.addColumn({key: "color", label: "색상", align: "center"});
        myUI.updateColumn({key: "c-o-l-o-r", label: "색깔", align: "left"}, 7);
        var lastCol = myUI.columns[myUI.columns.length - 1];
        done(lastCol.key == "c-o-l-o-r" && lastCol.label == "색깔" && lastCol.align == "left" ? "" : "error updateColumn");
    });

    //TODO: setColumnWidth
    /*
     it('setColumnWidth', function (done) {
     myUI(50, 0);
     });
     */


    it('20 getColumnSortInfo', function (done) {
        var sortInfo = myUI.getColumnSortInfo()[0];
        done(sortInfo.key == "b" && sortInfo.orderBy == "asc" && sortInfo.seq == 0 ? "" : "error getColumnSortInfo");
    });

    it('21 setColumnSort', function (done) {
        var sortInfo = myUI.setColumnSort({
            price: {seq: 0, orderBy: "desc"},
            amount: {seq: 1, orderBy: "asc"}
        }).getColumnSortInfo();
        done(sortInfo[0].key == "price" && sortInfo[1].key == "amount" ? "" : "error setColumnSort");
    });

    it('23 clearSelect', function (done) {
        myUI.clearSelect();
        done(myUI.getList("selected").length == 0 ? "" : "error clearSelect");
    });

    it('24 body trStyleClass', function (done) {
        done(jQuery(".gray").length > 0 ? "" : "error body trStyleClass");
    });

    it('25 selectAll', function (done) {
        myUI.selectAll();
        done(ae.equalAll(myUI.getList(), myUI.getList("selected")));
    });

    it('26 removeRow[selected]', function (done) {
        myUI.removeRow("selected");
        ax5.util.debounce(function () {
            done(myUI.getList().length == 0 ? "" : "error removeRow[selected]");
        }, 50)();
    });

    it('27 removeRow[first]', function (done) {
        myUI.addRow(
            {
                a: "D",
                b: "D",
                price: 1600,
                amount: 2600,
                cost: 2000,
                saleDt: "2016-01-01",
                isChecked: "Y",
                saleType: "D",
                customer: "name04",
                __selected__: true
            }
        );
        myUI.removeRow("first");
        done(myUI.getList().length == 0 ? "" : "error removeRow[first]");
    });

    it('28 removeRow[last]', function (done) {
        myUI.addRow(
            {
                a: "E",
                b: "E",
                price: 1800,
                amount: 2800,
                cost: 2000,
                saleDt: "2016-01-02",
                isChecked: "Y",
                saleType: "D",
                customer: "name05",
                __selected__: true
            }
        );
        myUI.removeRow("last");
        done(myUI.getList().length == 0 ? "" : "error removeRow[last]");
    });

    /*
     it('focus', function (done) {
     myUI.focusedColumn = {
     "6_0_0": {
     "panelName": "left-body-scroll",
     "dindex": 6,
     "rowIndex": 0,
     "colIndex": 0,
     "colspan": 1
     }
     };

     setTimeout(function(){
     myUI.clearSelect().select(0).focus("DOWN");
     done(ae.equalAll({
     "7_0_0": {
     "panelName": "left-body-scroll",
     "dindex": 7,
     "rowIndex": 0,
     "colIndex": 0,
     "colspan": 1
     }
     }, myUI.focusedColumn));
     }, 100);
     });
     */

    /*
     it('keyDown', function (done) {
     myUI.focusedColumn = {
     "1_3_0": {
     "panelName": "body-scroll",
     "dindex": 1,
     "rowIndex": 0,
     "colIndex": 3,
     "colspan": 1
     }
     };

     done(
     ae.equalAll("0_3_0", Object.keys(myUI.keyDown("KEY_UP").focusedColumn)[0])
     || ae.equalAll("0_4_0", Object.keys(myUI.keyDown("KEY_RIGHT").focusedColumn)[0])
     || ae.equalAll("1_4_0", Object.keys(myUI.keyDown("KEY_DOWN").focusedColumn)[0])
     || ae.equalAll("9_4_0", Object.keys(myUI.keyDown("KEY_END").focusedColumn)[0])
     || ae.equalAll("0_4_0", Object.keys(myUI.keyDown("KEY_HOME").focusedColumn)[0])
     );
     });
     */

    /*
     it('align', function (done) {
     done(ae.equalAll(myUI, myUI.align()));
     });


     it('exportExcel', function (done) {
     var _this = myUI.exportExcel("fileName");
     setTimeout(function () {
     done(ae.equalAll(_this, myUI));
     }, 200);
     });
     */

    it('destroy', function (done) {
        myUI.destroy();
        done(ae.equalAll([], myUI.getList()));
    });


    after(function () {
        $('[data-ax5grid="first-grid"]').remove();
    });
});
