// // release environment
var BASEURI = 'http://cloud-terminal.appspot.com';
var TKEY = "E6XhMP";

var GETURI = BASEURI + '/api/channel/get/jsonp/';
var SETURI = BASEURI + '/api/channel/set/jsonp/';


var SWITCH_CONFIG = {
    armSwitch: { channel: 0, on: 100, off: 0 },
    lightSwitch: { channel: 2,  on: 'on', off: 'off' }
};

var TEMPSENSOR_CONFIG = {
    channel: 1,
    type: {
        'month'    : {
            title : '過去半年',
            tickname : '週',
            interval: 7 * 24 * 60 * 60,
            tick : 2,
            size: 24
        },
        'week'    : {
            title : '過去4週間',
            tickname : '日',
            interval: 24 * 60 * 60,
            tick : 2,
            size: 28
        },
        'day'    : {
            title : '過去24時間',
            tickname : '時',
            interval: 60 * 60,
            tick : 2,
            size: 25
        },
        'hour'   : {
            title : '過去4時間',
            tickname  : '10分',
            interval : 10 * 60,
            tick: 20,
            size: 24
        },
        'minute' : {
            title : '過去15分',
            tickname : '分',
            interval : 30,
            tick: 1,
            size: 30
        }
    }
};


var STATE = { armSwitch: 'off', lightSwitch: 'off' };
var TEMPSENSOR_DATA = {};
var GRAPH_TYPE  = 'minute';
var LAST_UPDATED;

function init() {
    var type_config = TEMPSENSOR_CONFIG.type[GRAPH_TYPE];
    var temp_ch     = TEMPSENSOR_CONFIG.channel;

    var data = { tkey: TKEY };
    data['ch' + TEMPSENSOR_CONFIG.channel] = type_config.size + "," + type_config.interval;
    $.each(SWITCH_CONFIG, function(id, conf) {
        var ch = conf.channel;
        data['ch' + ch] = "1,10";
    });

    $.ajax({
        type : "GET",
        url : GETURI,
        data : data,
        dataType: 'jsonp',
        success: function(json) {
            if (! json.result == "False") {
                // return alert(json.message);
                return;
            }
            LAST_UPDATED = json.time;

            var graph_data = json.data[temp_ch];
            buildGraph(GRAPH_TYPE, graph_data);
            TEMPSENSOR_DATA = graph_data;
            // buildTable(json);

            $.each(SWITCH_CONFIG, function(id, conf) {
                var ch = conf.channel;
                var data = json.data[ch];
                if (data instanceof Array && data.length > 0) {
                    var value = data.shift().value;
                    var state = getSwitchState(id, value);
                    STATE[id] = state;
                    buildSwitch(id, state);
                }
                return true;
            });
        }
    });

    setTimeout(update, 30000);
}

function update() {
    var graph_ch = TEMPSENSOR_CONFIG.channel;

    var data = { tkey: TKEY };
    data['ch' + graph_ch] = "1,10";
    $.each(SWITCH_CONFIG, function(id, conf) {
        data['ch' + conf.channel] = "1,10";
    });

    $.ajax({
        type : "GET",
        url : GETURI,
        data : data,
        dataType: 'jsonp',
        success: function(json) {
            if (! json.result == "False") {
                return;
            }

            // graph
            var graph_data = json.data[graph_ch];
            if (graph_data instanceof Array && graph_data.length > 0) {
                var interval = TEMPSENSOR_CONFIG.type[GRAPH_TYPE].interval;

                // if we have spend more than interval time from last updated
                if ( ~~((json.time - LAST_UPDATED) / interval) > 0 ) {
                    // update data
                    TEMPSENSOR_DATA.unshift(graph_data.shift());
                    TEMPSENSOR_DATA.pop();

                    buildGraph(GRAPH_TYPE, TEMPSENSOR_DATA);
                    LAST_UPDATED = json.time;
                }
            }

            // switch
            $.each(SWITCH_CONFIG, function(id, conf) {
                var ch = conf.channel;
                var data = json.data[ch];
                if (data instanceof Array && data.length > 0) {
                    var value = data.shift().value;
                    updateSwitch(id, value);
                }
            });

        }
    });
    setTimeout(update, 30000);
}

function changeGraph(graph_type) {
    if (graph_type == GRAPH_TYPE) return;

    var graph_ch = TEMPSENSOR_CONFIG.channel;
    var interval = TEMPSENSOR_CONFIG.type[graph_type].interval;
    var size     = TEMPSENSOR_CONFIG.type[graph_type].size;

    var data = { tkey: TKEY };
    data['ch' + graph_ch] = size + "," + interval;

    $.ajax({
        type : "GET",
        url : GETURI,
        data : data,
        dataType: 'jsonp',
        success: function(json) {
            if (! json.result == "False") {
                return;
            }

            var graph_data = json.data[graph_ch];
            buildGraph(graph_type, graph_data);
            TEMPSENSOR_DATA = graph_data;
            LAST_UPDATED = json.time;
            GRAPH_TYPE = graph_type;
        }
    });
}

function buildGraph(graph_type, data) {
    var points = [];
    var xticks = [];
    var conf = TEMPSENSOR_CONFIG.type[graph_type];
    var tick = conf.tick;
    data = insertBlankData(data, conf.size, conf.interval, 0);
    for (var i = ~~(data.length/2) * tick; i >= 0; i -= tick)
        xticks.push(-i)
    $.each(data, function(i, item) {
        points.push([ -(i/2 * tick), parseFloat(item.value) ]);
    });

    var target = rebuildGraphDiv();
    var plot1 = $.jqplot(target.attr('id'), [points], {
        title: '(℃/' + conf.tickname + ')',
        series: [{
            color: 'lightgreen',
            lineWidth: 3
        }],
        axes: {
            xaxis: {
                tickOptions: {
                    formatString: '%d'
                    // formatString: '%.1f'
                },
                ticks: xticks
            }
        }
    });
}

function buildTable(data) {
    var table = $("#history");
    table.children().remove();
    $("<tr><th>時刻</th><th>値</th></tr>").appendTo(table);
    $.each(data, function(i, item) {
        var myDate = new Date( item.time *1000 );
        $("<tr><td>" + myDate.toLocaleString() + "</td><td>" + item.value + "</td></tr>")
            .appendTo(table);
    });
}

function rebuildGraphDiv() {
    var root = $("#graph-block");
    root.children().remove();

    var div = $("<div></div");
    div.attr('id', 'graph');
    div.css('width', 500);
    div.appendTo(root);

    var ul = $("<ul></ul>");
    $.each(TEMPSENSOR_CONFIG.type, function(id, conf) {
        var link = $('<a href="javascript:void(0)"></a>');
        link.text(conf.title);
        link.click(function() { changeGraph(id) });
        var li = $('<li></li>');
        link.appendTo(li);
        li.appendTo(ul);
    })
    ul.appendTo(root);

    return div;
}

function insertBlankData(data, size, interval, default_value) {
    var new_data = [];
    var prevtime = LAST_UPDATED;
    $.each(data, function (i, item) {
        var cnt = parseInt( ( prevtime - item.time ) / interval );
        for (var i = 1; i < cnt; i++) {
            new_data.push({value: default_value, time: prevtime - interval*i});
            if (new_data.length >= size) return false;
        }
        new_data.push(item);
        prevtime = item.time;
    })
    new_data.splice(size)
    return new_data;
}


function buildSwitch(id, state) {
    var sw = $('a#' + id);
    var sw_img = sw.find('img').eq(0);
    sw_img.attr('src', genSwitchImageName(state, id))

    sw.click(function() {
        $.ajax({
            type: "GET",
            url: SETURI,
            data: {
                tkey: TKEY,
                ch: SWITCH_CONFIG[id]['channel'],
                value: STATE[id] == 'on' ? SWITCH_CONFIG[id]['off'] : SWITCH_CONFIG[id]['on']
            },
            dataType: 'jsonp',
            success: function(json) {
                if (json.result == "False")
                    return;
                toggleSwitch(id);
            }
        });
    });
}

function getSwitchState(id, value) {
    return SWITCH_CONFIG[id].on == value ? 'on' : 'off';
}

function toggleSwitch(id) {
    var new_state = STATE[id] == 'on' ? 'off' : 'on';
    var value = SWITCH_CONFIG[id][new_state];
    updateSwitch(id, value);
}

function updateSwitch(id, value) {
    var new_state = getSwitchState(id, value);
    if (STATE[id] == new_state)
        return;
    STATE[id] = new_state;

    var sw = $('a#' + id);
    var sw_img = sw.find('img').eq(0);
    sw_img.attr('src', genSwitchImageName(STATE[id], id))
}

function genSwitchImageName(state, id) {
    return 'sw_' + id.replace(/Switch$/, '') + '_' + state + '.png';
}


function formatDate(epoch) {
    var d = new Date( epoch * 1000 );
    return [ d.getMonth() + 1, d.getDate() ].join("-") + " "
             + [ d.getHours(), d.getMinutes() ].join(":");
}


$(function() {
    init();
});