function cbxRoomNumberOnHidePanel() {
    var roomNumbers = $(this).combogrid('getValues');
    if (roomNumbers.length == 1) {
        /*$('#cbdRoomTypeModals')
			.combogrid('enable')
			.combogrid({ url: '/RoomType/LoadRoomTypeModals', queryParams: { roomNumber: roomNumbers[0]} });*/
    	$('#cbdRoomTypeModals')
			.combogrid('enable')
			.combogrid({ url: '/CoulometricStatistics/LoadModals', queryParams: { roomNumber: roomNumbers[0]} });
    } else {
        $('#cbdRoomTypeModals').combogrid('disable');
    }
}

function cbxDeviceTypeOnSelect(row) {
    /*$('#cbdRoomTypeModals').combogrid({
        url: '/RoomType/LoadRoomTypeModals',
        queryParams: {
            roomNumber: $('#cbxRoomNumber').combobox('getValue'),
            deviceType: row.Value
        }
    });*/

   
    if (undefined != $('#cbxRoomNumber').combobox('getValue')) {
        $('#cbdRoomTypeModals').combogrid({
            url: '/CoulometricStatistics/LoadModals',
            queryParams: {
                roomNumber: $('#cbxRoomNumber').combobox('getValue'),
                deviceType: row.Value

            }
        });
    }
}

$(function () {

    var curTime = new Date();
    var startTime = new Date(curTime.getTime() - 7 * 24 * 60 * 60 * 1000);
    $("#txtStartDate").datebox("setValue", startTime.format('yyyy-MM-dd'));
    $("#txtEndDate").datebox("setValue", curTime.format('yyyy-MM-dd'));

    var myChart;
    require.config({
        paths: {
            echarts: '/Scripts/libs/echarts'
        }
    });

    require([
	        'echarts',
	        'echarts/chart/line',
	        'echarts/chart/bar',
	        'echarts/theme/macarons'
        ],
	    function (ec) {
	        var chart = document.getElementById('chart');
	        chart.style.height = chart.parentNode.style.height;
	        myChart = ec.init(chart, 'macarons');
	    }
    );

    var option = {
        width: 100,
        tooltip: {
			show: true,
            trigger: 'item',
            formatter: '{c}'
        },
        legend: { left: 'left' },
        toolbox: {
            show: true,
            orient: 'vertical',
            feature: {
                magicType: { show: true, type: ['line', 'bar'] },
                restore: { show: true },
                saveAsImage: { show: true }
            }
        },
        calculable: false,
		dataZoom: { show: true },
        xAxis: [{
            type: 'category',
            boundaryGap: false
        }],
        yAxis: [{ type: 'value', axisLabel: { formatter: '{value}kW·h'}}],
        series: []
    };

    var seriesOption = {
        type: 'line',
        markPoint: {
            data: [
			{ type: 'max', name: lang.HighestEnergyConsumption },
			{ type: 'min', name: lang.LowestEnergyConsumption }
		]
        },
        markLine: {
            data: [
			{ type: 'average', name: lang.AveragePowerConsumption }
		]
        }
    };

    $('#query').click(function () {

        var roomNumbers = $('#cbxRoomNumber').combogrid('getValues');

        var dateUnit = $('#cbxDateTimeUnit').combobox('getValue');
        var startDate = $('#txtStartDate').datebox('getValue');
        if (startDate == '') {
            $.tools.alert(lang.PleaseEnterAstartTime);
            return;
        }

        var endDate = $('#txtEndDate').datebox('getValue');
        if (startDate == '') {
            $.tools.alert(lang.PleaseEnterADeadline);
            return;
        }

        var deviceType = $('#cbxDeviceType').combobox('getValue');
        var modalIds = $('#cbdRoomTypeModals').combogrid('getValues');

        myChart.showLoading({ text: 'Loading...' });
        $.ajax({
            url: '/CoulometricStatistics/LoadChartData/',
            type: 'POST',
            data: {
                roomNumbers: (roomNumbers.length > 0) ? "'" + roomNumbers.join("','") + "'" : "",
                dateUnit: dateUnit,
                startDate: startDate,
                endDate: endDate,
                deviceType: deviceType,
                modalIds: (modalIds.length > 0 ? "'" + modalIds.join("','") + "'" : '')
            },
            dataType: 'JSON',
            cache: false,
            success: function (r) {
                if (r.IsSuccess) {
                    myChart.clear();
                    option.legend.data = r.Legend;
                    option.xAxis[0].data = r.XAxis;
                    option.series = [];
                    for (var i in r.Data) {
                        option.series.push($.extend(r.Data[i], seriesOption));
                    }
                    myChart.setOption(option);
                } else {
                    myChart.clear();
                    $.tools.alert(r.Message);
                }

                myChart.hideLoading();
            },
            error: function () {
                myChart.hideLoading();
            }
        });
    });
});