//React
import * as React from 'react';
import * as ReactDOM from 'react-dom';
//Wijmo
import * as wjcCore from 'wijmo/wijmo';
import * as wjGridSheet from 'wijmo/wijmo.react.grid.sheet';
import * as wjcGridSheet from 'wijmo/wijmo.grid.sheet';
import * as wjcGrid from 'wijmo/wijmo.grid';
//Application
import { DataService } from '../services/DataSvc';

export class CustomFunction extends React.Component<any, any> {
    customFuncSheet: wjcGridSheet.FlexSheet;

    constructor(props) {
        super(props);
    }

    customFuncSheetInit(customFuncSheet: wjcGridSheet.FlexSheet) {
        let sheet1 = new wjcGridSheet.Sheet(customFuncSheet, null, 'Custom Function', 20, 6),
            sheet2 = new wjcGridSheet.Sheet(customFuncSheet, null, 'Data', 20, 6)            ;
        customFuncSheet.sheets.push(sheet1);
        customFuncSheet.sheets.push(sheet2);
        this.customFuncSheet = customFuncSheet;
        
        if (customFuncSheet) {
            customFuncSheet.addFunction('customSumProduct', (...params: any[][][]) => {
                let result = 0,
                    range1 = params[0],
                    range2 = params[1];

                if (range1.length > 0 && range1.length === range2.length && range1[0].length === range2[0].length) {
                    for (let i = 0; i < range1.length; i++) {
                        for (let j = 0; j < range1[0].length; j++) {
                            result += range1[i][j] * range2[i][j];
                        }
                    }
                }
                return result;
            }, 'Custom SumProduct Function', 2, 2);

            customFuncSheet.unknownFunction.addHandler((sender: any, e: wjcGridSheet.UnknownFunctionEventArgs) => {
                let result = '';
                if (e.params) {
                    for (let i = 0; i < e.params.length; i++) {
                        result += e.params[i];
                    }
                }
                e.value = result;
            });

            customFuncSheet.deferUpdate(() => {
                for (let i = 0; i < customFuncSheet.sheets.length; i++) {
                    customFuncSheet.sheets.selectedIndex = i;
                    switch (customFuncSheet.sheets[i].name) {
                        case 'Custom Function':
                            customFuncSheet.setCellData(0, 0, '=customSumProduct(Data!A1:B5, Data!B1:C5)');
                            customFuncSheet.setCellData(1, 0, '=customFunc(1, "B", 3)');
                            break;
                        case 'Data':
                            for (let ri = 0; ri < customFuncSheet.rows.length; ri++) {
                                for (let ci = 0; ci < 3; ci++) {
                                    customFuncSheet.setCellData(ri, ci, ri + ci);
                                }
                            }
                            break;
                    }
                }
                customFuncSheet.selectedSheetIndex = 0;
            });
        }
    }


    render() {
        return <div>
             <h2 id="excelIO">
                 Excel I/O
             </h2>
             <p>
                 FlexSheet supports saving/loading xlsx file by using the client <b>'save'</b> and <b>'load'</b> method.
             </p>

            <div className="row">
                <div className="col-md-5">
                    <ul className="nav nav-tabs" role="tablist">
                        <li className="active"><a href="#cfJsx" role="tab" data-toggle="tab">JSX</a></li>
                        <li><a href="#cfJs" role="tab" data-toggle="tab">TS</a></li>
                    </ul>
                    <div className="tab-content">
                        <div className="tab-pane active pane-content" id="cfJsx">
                            {'<wjGridSheet.FlexSheet\n'}
                            {'    initialized={this.customFuncSheetInit.bind(this)} />\n'}
                        </div>
                        <div className="tab-pane pane-content" id="cfJs">
                            {' customFuncSheet: wjcGridSheet.FlexSheet;\n'}
                            {'\n'}
                            {' constructor(props) {\n'}
                            {'     super(props);\n'}
                            {' }\n'}
                            {'\n'}
                            {' customFuncSheetInit(customFuncSheet: wjcGridSheet.FlexSheet) {\n'}
                            {'     let sheet1 = new wjcGridSheet.Sheet(customFuncSheet, null, \'Custom Function\', 20, 6),\n'}
                            {'         sheet2 = new wjcGridSheet.Sheet(customFuncSheet, null, \'Data\', 20, 6)     \n'}       ;
                            {'     customFuncSheet.sheets.push(sheet1);\n'}
                            {'     customFuncSheet.sheets.push(sheet2);\n'}
                            {'     this.customFuncSheet = customFuncSheet;\n'}
                            {'     \n'}
                            {'     if (customFuncSheet) {\n'}
                            {'         customFuncSheet.addFunction(\'customSumProduct\', (...params: any[][][]) => {\n'}
                            {'             let result = 0,\n'}
                            {'                 range1 = params[0],\n'}
                            {'                 range2 = params[1];\n'}
                            {'\n'}
                            {'             if (range1.length > 0 && range1.length === range2.length && range1[0].length === range2[0].length) {\n'}
                            {'                 for (let i = 0; i < range1.length; i++) {\n'}
                            {'                     for (let j = 0; j < range1[0].length; j++) {\n'}
                            {'                         result += range1[i][j] * range2[i][j];\n'}
                            {'                     }\n'}
                            {'                 }\n'}
                            {'             }\n'}
                            {'             return result;\n'}
                            {'         }, \'Custom SumProduct Function\', 2, 2)\n'}
                            {'\n'}
                            {'         customFuncSheet.unknownFunction.addHandler((sender: any, e: wjcGridSheet.UnknownFunctionEventArgs) => {\n'}
                            {'             let result = \'\';\n'}
                            {'             if (e.params) {\n'}
                            {'                 for (let i = 0; i < e.params.length; i++) {\n'}
                            {'                     result += e.params[i];\n'}
                            {'                 }\n'}
                            {'             }\n'}
                            {'             e.value = result;\n'}
                            {'         });\n'}
                            {'\n'}
                            {'         customFuncSheet.deferUpdate(() => {\n'}
                            {'             for (let i = 0; i < customFuncSheet.sheets.length; i++) {\n'}
                            {'                 customFuncSheet.sheets.selectedIndex = i;\n'}
                            {'                 switch (customFuncSheet.sheets[i].name) {\n'}
                            {'                     case \'Custom Function\':\n'}
                            {'                         customFuncSheet.setCellData(0, 0, \'=customSumProduct(Data!A1:B5, Data!B1:C5)\');\n'}
                            {'                         customFuncSheet.setCellData(1, 0, \'=customFunc(1, "B", 3)\');\n'}
                            {'                         break;\n'}
                            {'                     case \'Data\':\n'}
                            {'                         for (let ri = 0; ri < customFuncSheet.rows.length; ri++) {\n'}
                            {'                             for (let ci = 0; ci < 3; ci++) {\n'}
                            {'                                 customFuncSheet.setCellData(ri, ci, ri + ci);\n'}
                            {'                             }\n'}
                            {'                         }\n'}
                            {'                         break;\n'}
                            {'                 }\n'}
                            {'             }\n'}
                            {'             customFuncSheet.selectedSheetIndex = 0;\n'}
                            {'         });\n'}
                            {'     }\n'}
                            {' }\n'}
                        </div>
                    </div>
                </div>
                <div className="col-md-7">
                    <h4>Result (live):</h4>
                    <wjGridSheet.FlexSheet
                        initialized={this.customFuncSheetInit.bind(this)} />
                </div>
            </div>
        </div>;
    }
}

