/*
* Flot Graphfile for wxsim 3in1-script, v.2.0
* Made by henkka, nordicweather.net, Feb 2011
*/

$(function () {
/*
* MAIN GRAPH
***************************************************************/
if(wxsimconf.onlymeteogram == 1) {
       
       var plot2 = $.plot($("#wxsimtemp"), [{
            data: wxsimdata.precdata, 
            label: wxsimconf.precname, 
            bars: { show: true, fill: true, barWidth: 7500000 },
            color: wxsimconf.precipcolor,
            yaxis: 2,
            showdef: wxsimconf.showprecip
            },{
            data: wxsimdata.tempdata, 
            label: wxsimconf.tempname, 
            lines: { show: true, fill: false },
            color: wxsimconf.tempcolor,
            threshold: { below: wxsimconf.frzzline, label: wxsimconf.tempname, color: wxsimconf.tempbelowcolor },
            showdef: wxsimconf.showtemp
            }
            ],
            {
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabel,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) + wxsimconf.tempunit+'</span>' },
            labelWidth: wxsimconf.ylega,
            reserveSpace: true
            },{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.precunit+'</span>' },
            labelWidth: wxsimconf.ylegb,
            max: wxsimconf.precipmax,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}
          
            });      
    
    var previousPoint = null;
    $("#wxsimtemp").bind("plothover", owntool);
    
} else {
var datasets = [{
            data: wxsimdata.precdata, 
            label: wxsimconf.precname, 
            bars: { show: true, fill: true, barWidth: 7500000 },
            color: wxsimconf.precipcolor,
            yaxis: 2,
            showdef: wxsimconf.showprecip
            },{
            data: wxsimdata.dewdata, 
            label: wxsimconf.dewname, 
            lines: { show: true, fill: false },
            color: wxsimconf.dewcolor,
            showdef: wxsimconf.showdew
            },{
            data: wxsimdata.chilldata, 
            label: wxsimconf.chillname, 
            lines: { show: true, fill: false },
            color: wxsimconf.chillcolor,
            showdef: wxsimconf.showchill
            },{
            data: wxsimdata.heatdata, 
            label: wxsimconf.heatname, 
            lines: { show: true, fill: false },
            color: wxsimconf.heatcolor,
            showdef: wxsimconf.showheat
            },{
            data: wxsimdata.tempdata, 
            label: wxsimconf.tempname, 
            lines: { show: true, fill: false },
            color: wxsimconf.tempcolor,
            threshold: { below: wxsimconf.frzzline, label: wxsimconf.tempname, color: wxsimconf.tempbelowcolor },
            showdef: wxsimconf.showtemp
            }
            ];
            
var bdatasets = [{
            data: wxsimdata.tempdata, 
            label: wxsimconf.tempname, 
            lines: { show: true, fill: false },
            color: wxsimconf.tempcolor,
            threshold: { below: wxsimconf.frzzline, label: wxsimconf.tempname, color: wxsimconf.tempbelowcolor },
            showdef: 1
            },{
            data: wxsimdata.barodata, 
            label: wxsimconf.baroname, 
            lines: { show: true, fill: false },
            color: wxsimconf.barocolor,
            showdef:1,
            yaxis:2
            }
            ];
            
var tcg = {
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabel,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) + wxsimconf.tempunit +'</span>' },
            labelWidth: wxsimconf.ylega,
            reserveSpace: true
            },{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.barounit+'</span>' },
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}
          
            };
        
var choiceContainer = $("#choices");
var uh = '';
$.each(datasets, function(key, val) {
if(val.showdef == 1) { var showit = 'checked="checked"';} 
else { var showit = '';}
if(ie7) { var poss = "22px;top:-14px;"; } else { var poss = "27px;top:3px;"; }
uh+= '<td style="width:15px;"><input type="checkbox" name="' + key +'" '+showit+' id="id' + key + '" /></td><td style="width:12px;"><div style="width:10px;height:10px;background: '+val.color+';"></div></td><td style="padding-right:12px;font-size:11px;">'+val.label+'</td>';
});

var bleg = '<table id="bleg"><tr><td style="width:14px;"><div style="width:10px;height:10px;background: '+wxsimconf.snowcolor+'"></div></td><td style="padding-right:8px;font-size:11px;">'+wxsimconf.tempname+'</td><td style="width:14px;"><div style="width:10px;height:10px;background: '+wxsimconf.barocolor+'"></div></td><td style="padding-right:8px;font-size:11px;">'+wxsimconf.baroname+'</td></tr></table>';

choiceContainer.append('<table id="multichoice"><tr>'+uh+'</tr></table>'+bleg+'');
    
function plotAccordingToChoices() {
        var data = [];

        choiceContainer.find("input:checked").each(function () {
            var key = $(this).attr("name");
            if (key && datasets[key])
                data.push(datasets[key]);
        });
      
       var plot2 = $.plot($("#wxsimtemp"), data,
            {
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabel,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) + wxsimconf.tempunit +'</span>' },
            labelWidth: wxsimconf.ylega,
            reserveSpace: true
            },{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.precunit+'</span>' },
            labelWidth: wxsimconf.ylegb,
            max: wxsimconf.precipmax,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}
          
            });
    $("#thund").addClass("active");
    $("#bleg").hide();
    
    var previousPoint = null;
    $("#wxsimtemp").bind("plothover", owntool);

}
           
plotAccordingToChoices();
choiceContainer.find("input").click(plotAccordingToChoices);

        $("#thund").click(function () {
        plotAccordingToChoices();
        $("#thund").addClass("active");
        $("#thundbaro").removeClass("active");
        $("#multichoice").show();
        $("#bleg").hide();
        });
        $("#thundbaro").click(function () {
        $.plot($("#wxsimtemp"),bdatasets,tcg);
        $("#thundbaro").addClass("active");
        $("#thund").removeClass("active");
        $("#multichoice").hide();
        $("#bleg").show();
        });

/*
* WINDGRAPH
***************************************************************/

var winddatasets = [{
            data: wxsimdata.winddata, 
            label: wxsimconf.windname, 
            points: { show: true, radius: 2,type: "circle" },
            color: wxsimconf.windcolor,
            showdef: wxsimconf.showwind
        },{
            data: wxsimdata.windgustdata, 
            label: wxsimconf.windgstname, 
            points: { show: true, radius: 2,type: "circle" },
            color: wxsimconf.cwindcolor,
            showdef: wxsimconf.showgust
        }];
        
var WindaContainer = $("#windlegend");
var suh = '';
$.each(winddatasets, function(key, val) {
if(val.showdef == 1) { var showit = 'checked="checked"';} 
else { var showit = '';}
if(ie7) { var poss = "22px;top:-14px;"; } else { var poss = "27px;top:3px;"; }
suh+= '<td style="width:15px;"><input type="checkbox" name="' + key +'" '+showit+' id="id' + key + '" /></td><td style="width:12px;"><div style="width:10px;height:10px;background: '+val.color+';"></div></td><td style="padding-right:12px;font-size:11px;">'+val.label+'</td>';
});
WindaContainer.append('<table><tr>'+suh+'</tr></table>');

function plotAccordingToChoicesWinda() {
        var winddata = [];

        WindaContainer.find("input:checked").each(function () {
            var key = $(this).attr("name");
            if (key && winddatasets[key])
                winddata.push(winddatasets[key]);
        });
                    
       var plot4 = $.plot($("#wxsimwind"),winddata,
            {
            direction: {
	                show: true,
	                disablePoints: true
            },
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.wunit+'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.windmax,
            reserveSpace: true
            },{
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}         
            });     
    
    var previousPoint = null;
    $("#wxsimwind").bind("plothover", owntool);
}
           
plotAccordingToChoicesWinda();
WindaContainer.find("input").click(plotAccordingToChoicesWinda);

/* UVGRAPH
************************************************************/
if(wxsimconf.solaactive == 1){
var soladatasets = [{
            data: wxsimdata.uvdata, 
            label: wxsimconf.uvname, 
            lines: { show: true, fill: true, fillColor: { colors: wxsimconf.uvcls }},
            color: wxsimconf.uvcolor,
            showdef: 1
        },{
            data: wxsimdata.soladata, 
            label: wxsimconf.solaname, 
            lines: { show: true, fill: true},
            color: wxsimconf.solacolor,
            yaxis: 2,
            showdef: 0
        }];
} else {
var soladatasets = [{
            data: wxsimdata.uvdata, 
            label: wxsimconf.uvname, 
            lines: { show: true, fill: true, fillColor: { colors: wxsimconf.uvcls }},
            color: wxsimconf.uvcolor,
            showdef: 1
        }];
}        
               
var solaContainer = $("#uvlegend");
var suh = '';
$.each(soladatasets, function(key, val) {
if(val.showdef == 1) { var showit = 'checked="checked"';} 
else { var showit = '';}
if(wxsimconf.solaactive == 1){var inp = '';}else{var inp = 'display:none';}
if(ie7) { var poss = "22px;top:-14px;"; } else { var poss = "27px;top:3px;"; }
suh+= '<td style="width:15px;'+inp+'"><input type="checkbox" name="' + key +'" '+showit+' id="id' + key + '" /></td><td style="width:12px;"><div style="width:10px;height:10px;background: '+val.color+';"></div></td><td style="padding-right:12px;font-size:11px;">'+val.label+'</td>';
});
solaContainer.append('<table><tr>'+suh+'</tr></table>');

function plotAccordingToChoicesSola() {
        var soladata = [];

        solaContainer.find("input:checked").each(function () {
            var key = $(this).attr("name");
            if (key && soladatasets[key])
                soladata.push(soladatasets[key]);
        });
                    
       var plot4 = $.plot($("#wxsimuv"),soladata,
            {
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.uvmax,
            reserveSpace: true
            },{
            labelWidth: wxsimconf.ylegb,
            max: wxsimconf.solamax,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}
          
            });  

    
    var previousPoint = null;
    $("#wxsimuv").bind("plothover", owntool);
}
           
plotAccordingToChoicesSola();
solaContainer.find("input").click(plotAccordingToChoicesSola);
/*
* SNOWGRAPH
************************************************************/

if(wxsimconf.snowactive == "true") {
      var plot5 = $.plot($("#wxsimsnow"),[{
            data: wxsimdata.snowdata, 
            label: wxsimconf.snowname, 
            lines: { show: true, fill: true},
            color: wxsimconf.snowcolor
        }],
            {
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.snowunit+'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.snowmax,
            min: 0,
            reserveSpace: true
            },{
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.daysdata
            },
            legend: {show:false}
          
            });  
            
var windContainer = $("#snowlegend");
windContainer.append('<table><tr><td style="width:14px;"><div style="width:10px;height:10px;background: '+wxsimconf.snowcolor+'"></div></td><td style="padding-right:8px;font-size:11px;">'+wxsimconf.snowname+'</td></tr></table>');   
    
    var previousPoint = null;
    $("#wxsimsnow").bind("plothover", owntool);
}

/*
* KIGRAPH
*************************************************************/

if(wxsimconf.kiactive == "true") {

      var uvaset = [{
            data: wxsimdata.kidata, 
            label: wxsimconf.kiname, 
            lines: { show: true, fill: false},
            color: wxsimconf.kicolor,
            showdef: 1
        }];
      var uvbset = [{
            data: wxsimdata.kidata, 
            label: wxsimconf.kiname, 
            lines: { show: true, fill: false},
            color: wxsimconf.kicolor,
            showdef: 1
        },{
            data: wxsimdata.barodata, 
            label: wxsimconf.baroname, 
            lines: { show: true, fill: false},
            color: wxsimconf.barocolor,
            yaxis: 2,
            showdef: 0
        }];
      var uvcset = [{
            data: wxsimdata.kidata, 
            label: wxsimconf.kiname, 
            lines: { show: true, fill: false},
            color: wxsimconf.kicolor,
            showdef: 1
        },{
            data: wxsimdata.dewdata, 
            label: wxsimconf.dewname, 
            lines: { show: true, fill: false},
            color: wxsimconf.dewcolor,
            yaxis: 2,
            showdef: 0
        }];
        var tx ={
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.kimin,
            min: 0,
            reserveSpace: true
            },{
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.lidaysdata
            },
            legend: {show:false}
            };
      var tbx ={
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.kimin,
            min: 0,
            reserveSpace: true
            },{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.barounit+'</span>' },
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.lidaysdata
            },
            legend: {show:false}
            };
      var tcx ={
            xaxis: {
            mode: "time",
            timeformat: "%d.%m",
            tickSize: [1, "day"],
            tickFormatter: ownlabels,
            reserveSpace: true
            },
            yaxes: [{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +'</span>' },
            labelWidth: wxsimconf.ylega,
            max: wxsimconf.kimin,
            min: 0,
            reserveSpace: true
            },{
            tickFormatter: function (v, axis) { return '<span style="font-weight: normal;">' +v.toFixed(axis.tickDecimals) +' '+wxsimconf.tempunit+'</span>' },
            labelWidth: wxsimconf.ylegb,
            position: 'right',
            reserveSpace: true
            }],
            grid: {
            borderColor: "#ddd",
            tickColor: "#e5e5e5",
            borderWidth: 1,
            hoverable: true,
            autoHighlight: true,
            mouseActiveRadius: 20,
            markings: wxsimconf.lidaysdata
            },
            legend: {show:false}
            };
            
var txContainer = $("#kilegend");
txContainer.append('<table><tr><td style="width:14px;"><div style="width:10px;height:10px;background: '+wxsimconf.kicolor+'"></div></td><td style="padding-right:8px;font-size:11px;">'+wxsimconf.kiname+' <b>&lsaquo; 2:</b> '+wxsimconf.kideca+'&nbsp;&nbsp;<b>2 &rsaquo; 5:</b> '+wxsimconf.kidecb+'&nbsp;&nbsp;<b>&rsaquo; 5: </b>'+wxsimconf.kidecc+'</td><td style="width:14px;" class="legbaro"><div style="width:10px;height:10px;background: '+wxsimconf.barocolor+'"></div></td><td style="padding-right:8px;font-size:11px;" class="legbaro">'+wxsimconf.baroname+' </td><td style="width:14px;" class="legdew"><div style="width:10px;height:10px;background: '+wxsimconf.dewcolor+'"></div></td><td style="padding-right:8px;font-size:11px;" class="legdew">'+wxsimconf.dewname+' </td></tr></table>');
            
      var plot6 = $.plot($("#wxsimki"),uvaset,tx);
      $("#ki").addClass("active");
      $(".legbaro").hide(); 
      $(".legdew").hide();
    
    var previousPoint = null;
    $("#wxsimki").bind("plothover", owntool);
    
        $("#ki").click(function () {
        $.plot($("#wxsimki"),uvaset,tx);
        $("#ki").addClass("active");
        $("#kibaro").removeClass("active");
        $("#kidew").removeClass("active");
        $(".legdew").hide();
        $(".legbaro").hide();
        });
        $("#kibaro").click(function () {
        $.plot($("#wxsimki"),uvbset,tbx);
        $("#kibaro").addClass("active");
        $("#kidew").removeClass("active");
        $("#ki").removeClass("active");
        $(".legdew").hide();
        $(".legbaro").show();
        });
        $("#kidew").click(function () {
        $.plot($("#wxsimki"),uvcset,tcx);
        $("#kidew").addClass("active");
        $("#kibaro").removeClass("active");
        $("#ki").removeClass("active");
        $(".legdew").show();
        $(".legbaro").hide();
        });
    
}  // kia end
}

function ownlabel(v, axis, topoff) { 
    var dz= new Date();
    dz.setTime(v);
    var label = '<div style="width:100%;text-align:center;margin-left: 60px; position:relative; top: -250px;font-weight: normal;">'+wxsimconf.days[dz.getUTCDay()]+'</div>';
    return label;
}
function ownlabels(v, axis, topoff) { 
    var dz= new Date();
    dz.setTime(v);
    var label = '<div style="width:100%;text-align:center;margin-left: 60px; position:relative; top: -170px;font-weight: normal;">'+wxsimconf.days[dz.getUTCDay()]+'</div>';
    return label;
}

function owntool(event, pos, item) {
        $("#x").text(pos.x.toFixed(2));
        $("#y").text(pos.y.toFixed(2));

            if (item) {
            var unit = '';
            if(item.series.label == wxsimconf.dewname) { var unit = " "+wxsimconf.tempunit; }
            if(item.series.label == wxsimconf.baroname) { var unit = " "+wxsimconf.barounit; }
            if(item.series.label == wxsimconf.snowname) { var unit = " "+wxsimconf.snowunit; }
            if(item.series.label == wxsimconf.solaname) { var unit = " w/m&sup2;"; }
            if(item.series.label == wxsimconf.windname) { var unit = " "+wxsimconf.wunit; }
            if(item.series.label == wxsimconf.windgstname) { var unit = " "+wxsimconf.wunit; }
            if(item.series.label == wxsimconf.tempname) { var unit = wxsimconf.tempunit; }
            if(item.series.label == null) { var unit = wxsimconf.tempunit; item.series.label = wxsimconf.tempname;  }
            if(item.series.label == wxsimconf.chillname) { var unit = wxsimconf.tempunit; }
            if(item.series.label == wxsimconf.heatname) { var unit = wxsimconf.tempunit; }
            if(item.series.label == wxsimconf.precname) { var unit = " "+wxsimconf.precunit; }
            if(item.series.label == wxsimconf.baroname) { var unit = " "+wxsimconf.barounit; }
            
                if (previousPoint != item.datapoint) {
                    previousPoint = item.datapoint;
              
                    $("#tooltip").remove();
                    var x = item.datapoint[0].toFixed(3),
                        y = item.datapoint[1].toFixed(1);
                    var hy = new Date(x*1);
                    var ho = hy.getUTCHours();
                    var mi = hy.getUTCMinutes();
                    showTooltip(item.pageX, item.pageY,
                               "<b>"+item.series.label+"</b><br/>"+wxsimconf.days[hy.getUTCDay()]+" "+ ho + ":00:<br/><b>"+y+unit+"</b>");
                }
            }
            else {
                $("#tooltip").remove();
                previousPoint = null;            
            }
}

function showTooltip(x, y, contents) {
        $('<div id="tooltip">' + contents + '</div>').css( {
            position: 'absolute',
            display: 'none',
            top: y + 12,
            left: x + 12,
            border: '2px solid #bbb',
            padding: '4px',
            'background-color': '#fff',
            color: '#000',
            font: '11px Tahoma',
            opacity: 0.90
        }).appendTo("body").fadeIn(200).fadeOut(5000);
}

});