// JavaScript Document
var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
YAHOO.widget.Chart.SWFURL = "yui/build/charts/assets/charts.swf";
var flashSupported = false;
var loadbar;
var tipimagewin;
var idmonitorwin;
var id_current;
var abc;
var iddb_key_current;
var extreme_x_remember = {}; //new Array();
var extreme_y_remember = {}; //new Array();

//disp module
var disps = ['tims','qmap','qsum','iddb'];
var tims_disp_module;
var qmap_disp_module;
var qsum_disp_module;
var iddb_disp_module;

//tipspanel module
var qmap_tipspanel_module;
var qsum_tipspanel_module;
var tims_tipspanel_module;
var iddb_tipspanel_module;

//parpanel module
var parpanels = ['date','qmref','dayofmon','vertical'];
var date_parpanel_module;
var qmref_parpanel_module;
var dayofmon_parpanel_module;
var vertical_parpanel_module;

//selected parpanels/tippanels for each disp
//must in consistent sequence as it used to hash Parkey and xml filename
var qmap_selps = ['date','dayofmon'];  //dayofmon is [.01 - .31]
var qsum_selps = ['date','dayofmon','qmref','vertical'];
var tims_selps = ['dayofmon','qmref','vertical'];  // dayofmon is daily/monthly
var iddb_selps = ['date','dayofmon','qmref','vertical'];
var itim_selps = ['date'];

//onParChange timer delay
var onParChange_delay_tims = 0; //800;
var onParChange_delay_qmap = 0; //0;
var onParChange_delay_qsum = 0; //800;
var onParChange_delay_iddb = 0; //1500;

//show function, to be define in drawing.js
var show_tims;
var show_qmap;
var show_qsum;
var show_iddb;

// define global objects, configurations
var tims = new Array();
tims[0] = { key:'nobs', label:"  N_QC  ", chart:null }
tims[1] = { key:'tmean', label:"  T Bias  ", chart:null }
tims[2] = { key:'tstdv', label:"  T STD  ", chart:null }
tims[3] = { key:'wvmean', label:"  WV Bias  ", chart:null }
tims[4] = { key:'wvstdv', label:"  WV STD  ", chart:null }
tims[5] = { key:'nmean', label:"  N Bias  ", chart:null }
tims[6] = { key:'nstdv', label:"  N STD  ", chart:null }

var Index_of_first_qc_tims = 10;
var HighchartPlatformVisibility = {//memory of chart platform series visibility
  "Vaisala_RS80": true,
  "Vaisala_RS92": true,
  "Vaisala_RS41": true,
  "Vaisala_RS18": true,
  "USA_VIZ": true,
  "Japan_Meisei": true,
  "China_Shanghai": true,
  "Russian": true,
  "France": true,
  "Germany": true,
  "Korea": true,
  "Dropsonde": true,
  "Sippican": true,
  "Lockheed": true,
  "Others": true
};


// #3 argument in xml2highChart: 
//    0-3 are qsum, 4 is id_monitor, 5~23 are monthly tims, 24~27 are daily tims
//    daily/monthly histogram share same  
// offset in make_tims_plot:
//    monthly: 5
//    daily:   24
var HC_num_qsum = 11, HC_num_tims_monthly = 7, HC_num_tims_daily = 7;
var HC_offset_qsum = 0
var HC_offset_idmon = HC_offset_qsum + HC_num_qsum;
var HC_offset_tims_monthly = HC_offset_idmon + 1;
var HC_offset_tims_daily = HC_offset_tims_monthly + HC_num_tims_monthly;

var qmap = new Array();
qmap[0] = { key:'RAOB', label:'RAOB' }
qmap[1] = { key:'STARbufr', label:'STAR (bufr)' }

var qmap_lookup = {};
$.map(qmap, function(elem, i){qmap_lookup[elem.label] = i});

var qsum = new Array();
qsum[0] = { key:'nobs', label:'Statistics - NOBS', dataTable:null}
qsum[1] = { key:'nobs_norm', label:'Statistics - Percent', dataTable:null}
qsum[2] = { key:'stat', label:'Statistics - Reference', dataTable:null}
qsum[3] = { key:'hour', label:'Hourly NOBS (UTC)', chart:null }
qsum[4] = { key:'hour_lt', label:'Hourly NOBS (LT)', chart:null }
qsum[5] = { key:'prof_temp_bias', label:'T Bias', chart:null }
qsum[6] = { key:'prof_temp_std',  label:'T STD', chart:null }
qsum[7] = { key:'prof_temp_num',  label:'T Num', chart:null }
qsum[8] = { key:'prof_wv_bias', label:'WV Bias', chart:null }
qsum[9] = { key:'prof_wv_std',  label:'WV STD', chart:null }
qsum[10] = { key:'prof_wv_num',  label:'WV Num', chart:null }
qsum[11] = { key:'prof_ref_bias', label:'N Bias', chart:null }
qsum[12] = { key:'prof_ref_std',  label:'N STD', chart:null }
qsum[13] = { key:'prof_ref_num',  label:'N Num', chart:null }

var iddb = new Array();
iddb[0] = {key:'RAOB', label:'RAOB', dataTable:null};
iddb[1] = {key:'STARbufr', label:'STAR (bufr)', dataTable:null};


var iddb_table_page_length = null;

var onMNClick = function (event, matchedEl, container)
{
	//flop menu
	Dom.removeClass( Dom.getElementsByClassName('menu_items_highlight', 'div', container), 'menu_items_highlight');
	Dom.addClass( matchedEl, "menu_items_highlight");
	
	for(var i=0; i<disps.length; i++)
	{
		if(disps[i] == matchedEl.id)
		{
			//show disp
			eval(disps[i]+"_disp_module.show()");
			eval(disps[i]+"_tipspanel_module.show()"); //set tips

			//hide all parpanels
			for(var j=0; j<parpanels.length; j++)
			{
				eval(parpanels[j]+"_parpanel_module.hide()");
			}
			// hide/show #show-hour in qmap
			if(disps[i] == "qmap"){
			  $("#show-hour-box").show();
			  $(".btn-imgslider").css("visibility", "visible");
			}
			else{
			  $("#show-hour-box").hide();		
			  $(".btn-imgslider").css("visibility", "hidden");	  
			}
			//show selected parpanels
			var selected_parpanels = eval(disps[i]+"_selps");
			for(var j=0; j<selected_parpanels.length; j++)
			{
				eval(selected_parpanels[j]+"_parpanel_module.show()");
			}
			
			// show images/results
			eval("show_"+disps[i]+"()");
		}
		else
		{
			eval(disps[i]+"_disp_module.hide()");
			eval(disps[i]+"_tipspanel_module.hide()");
		}

	}
};


var onParChange = function ()
{
	//use timer to allow certain time for a combination of par change operations [depreciated]
  //	if(onParChange.timer)
  //	{
  //		clearTimeout(onParChange.timer)
  //	}
	var id = Dom.getAttribute( Dom.getElementsByClassName('menu_items_highlight', 'div', Dom.get('menu')), "id" );
	//onParChange.timer = setTimeout("show_"+id+"()", eval("onParChange_delay_"+id));
	eval("show_" + id + "()");
};


function new_date(year, month, day)
{
	with(document.dateinput)
	{
		if (year != eval(dateinput_year.value) )
		{
			dateinput_year.selectedIndex = year - eval(dateinput_year.options[0].value)
			fill_month()
			dateinput_month.selectedIndex = month - eval(dateinput_month.options[0].value)
			fill_dayofmon();
			dateinput_day.selectedIndex = day - eval(dateinput_day.options[0].value)
		}
		else if (month != eval(dateinput_month.value))
		{
			dateinput_month.selectedIndex = month - eval(dateinput_month.options[0].value)
			fill_dayofmon();
			dateinput_day.selectedIndex = day - eval(dateinput_day.options[0].value)
		}
		else if (day != eval(dateinput_day.value) )
		{
			dateinput_day.selectedIndex = day - eval(dateinput_day.options[0].value)
		}
	}
	onParChange();
}

function month_day_change() //two funtion, 1) able/disable "dateinput_day" 2)check "dateinput_day" range
{
  var aggtime = $("#dayofmoninput input:checked").val();
	with(document.dateinput)
	{
	  if(aggtime == "hourly"){
//	    $("#dateinput_day").removeClass("invis-elem");
//	    $("#dateinput_hour").removeClass("invis-elem");
	  }
    else if(aggtime == "daily") //daily
    {
      $("#dateinput_day").removeClass("greyedout");
 	  }
    else if(aggtime == "monthly") //monthly
    {
      $("#dateinput_day").addClass("greyedout");		
	  }
	}
}
function date_back()
{
	with(document.dateinput)
	{
	    if(document.getElementById('700').checked==true) //daily
            {
		var now = new Date(eval(dateinput_year.value),eval(dateinput_month.value)-1, eval(dateinput_day.value))
		if (now > (new Date(earliest_year,earliest_month-1, earliest_day)))
		{
		        now.setDate(now.getDate()-1)
			new_date(now.getFullYear(), now.getMonth()+1, now.getDate())
		}
   	    }
	    else  //monthly
	    {
		var now = new Date(eval(dateinput_year.value),eval(dateinput_month.value)-2, 1)
		if (now > (new Date(earliest_year,earliest_month-2, 1)))
		{
	                var nDays = (new Date(now.getFullYear(), now.getMonth()+1,0)).getDate();
       	                day = eval(dateinput_day.value) > nDays ? nDays : eval(dateinput_day.value);
			new_date(now.getFullYear(), now.getMonth()+1, day)
			//new_date(now.getFullYear(), now.getMonth()+1, eval(dateinput_day.value))
		}
	    }
	}
}

function date_next()
{
	with(document.dateinput)
	{
	    if(document.getElementById('701').checked==false) //daily
            {
		var now = new Date(eval(dateinput_year.value),eval(dateinput_month.value)-1, eval(dateinput_day.value))
		if (now < (new Date(latest_year,latest_month-1, latest_day)))
		{
		        now.setDate(now.getDate()+1)
			new_date(now.getFullYear(), now.getMonth()+1, now.getDate())
		}
	    }
	    else  //monthly
	    {
		var now = new Date(eval(dateinput_year.value),eval(dateinput_month.value), 1)
		if (now < (new Date(latest_year,latest_month, 1)))
		{
	                var nDays = (new Date(now.getFullYear(), now.getMonth()+1,0)).getDate();
       	                day = eval(dateinput_day.value) > nDays ? nDays : eval(dateinput_day.value);
			new_date(now.getFullYear(), now.getMonth()+1, day)
			//new_date(now.getFullYear(), now.getMonth()+1, eval(dateinput_day.value))
		}

	    }
	}
}

function date_begin()
{
	new_date(earliest_year,earliest_month, earliest_day)
}		

function date_end()
{
	new_date(latest_year,latest_month, latest_day)
}		


function fill_month()
{
	var i_str = 1
	var i_end = 12
	var year = eval(document.dateinput.dateinput_year.value)
	var dateinput_month = document.dateinput.dateinput_month
	if (year == earliest_year)	i_str = earliest_month;
	if (year == latest_year)	i_end = latest_month;
	var month_old = 0
	if(dateinput_month.options.length > 0)	month_old = eval(dateinput_month.value)
	month = month_old < i_str ? i_str : month_old
	month = month_old > i_end ? i_end : month_old
	while (dateinput_month.length > 0) dateinput_month.remove(dateinput_month.length-1);
	for (var i=i_str; i<=i_end; i++)
	{
		var opt = document.createElement("option")
		opt.text = opt.value = i<10 ? "0"+i : i
		try{document.dateinput.dateinput_month.add(opt)}
		catch(e){document.dateinput.dateinput_month.add(opt,null)}
	}
	document.dateinput.dateinput_month.selectedIndex = month > i_str ? ( month<i_end ? month-i_str:i_end-i_str) : 0
}

function fill_dayofmon()
{
	var year = eval(document.dateinput.dateinput_year.value)
	var month = eval(document.dateinput.dateinput_month.value)
	var dateinput_day = document.dateinput.dateinput_day
	var day_old = 1;
	if(dateinput_day.options.length > 0)	day_old = eval(dateinput_day.value)
	while (dateinput_day.length > 0) dateinput_day.remove(dateinput_day.length-1);
	var nDays = (year == latest_year && month == latest_month)?latest_day:(new Date(year,month,0)).getDate();
	var nDays_begin = (year == earliest_year && month == earliest_month)?earliest_day:1;
	day = day_old > nDays ? nDays : day_old;
	for (var i=nDays_begin; i<=nDays; i++)
	{
		var opt = document.createElement("option")
		opt.text = opt.value = i<10 ? "0"+i : i
		try{dateinput_day.add(opt)}
		catch(e){dateinput_day.add(opt,null)}
	}
	dateinput_day.selectedIndex = day - 1;
}

function change_year()
{
	fill_month();
	//onParChange();
}

function change_month()
{
	fill_dayofmon();
	//onParChange();
}

function change_dayofmon()
{
	//onParChange();
}

function change_hourofday(){
  if($("#show-hour").is(":checked")){
    $("#dateinput_hour").removeClass("greyedout");
    $(".btn-imgslider").show();
  }
  else{
    $("#dateinput_hour").addClass("greyedout"); 
    $(".btn-imgslider").hide();
  } 
}

function initialize()
{
  // url
  var location = window.location;
  
	//detect flash player
	flashSupported = YAHOO.util.SWFDetect.isFlashVersionAtLeast('9.0');
  
	//initialize a loading bar
	loadbar = new YAHOO.widget.Panel("loadbar",  
			{ width:"240px", 
			  fixedcenter:true, 
			  close:false, 
			  draggable:false, 
			  zindex:5,
			  modal:true,
			  visible:false
			} 
		);

	loadbar.setHeader("<p style='font-family:Arial, Helvetica, sans-serif;font-weight:normal'>loading data...</p>");
	loadbar.setBody('<img src="../framework/images/loading.gif" />');
	loadbar.render(document.body);

	//initialize tip image window
	tipimagewin = new YAHOO.widget.Panel("tipimagewin",  
			{ width:"640px", 
			  fixedcenter:true, 
			  constraintoviewport:true,
			  close:true, 
			  draggable:false, 
			  zindex:4,
			  visible:false
			} 
		);
	tipimagewin.setHeader("<p style='font-family:Arial, Helvetica, sans-serif;font-weight:normal'>Tips</p>");
	tipimagewin.setBody('<img src="../framework/images/monitor_interface_platform.png" width="100%"/>');
	tipimagewin.render(document.body);

	//initialize idmonitor window
	idmonitorwin = new YAHOO.widget.Panel("idmonitorwin",  
			{ width:"675px", 
			  height:"420px",
			  context:["iddb_disp","br","br",["beforeShow","windowResize","windowScroll"]],
			  constraintoviewport:true,
			  close:true,
			  zindex:3,
			  draggable:false,
			  dragOnly:false,
			  visible:false
			} 
		);
	idmonitorwin.setHeader("Platform Monitor");

  idmonitorwin.hideEvent.subscribe(function(){
    var dt = $("#iddb_disp_deletable .yui-content>div:not('.yui-hidden') table").DataTable();
    $(dt.rows().nodes()).removeClass("highlight");
    create_permalink();
  }); 
	
	idmonitorwin.render();

	//initialize idmonitortv 
	//var idmonotorwintv = new YAHOO.widget.TabView("idmonitorwintv");

	//initialize date bar
	for (var i=earliest_year; i<=latest_year; i++)
	{
		var opt = document.createElement("option");
		opt.text = opt.value = i;
		try{document.dateinput.dateinput_year.add(opt)}
		catch(e){document.dateinput.dateinput_year.add(opt,null)}
	}
	document.dateinput.dateinput_year.selectedIndex = document.dateinput.dateinput_year.length-1;

	document.getElementById('700').checked=true
	fill_month();
	document.dateinput.dateinput_month.selectedIndex = document.dateinput.dateinput_month.length-1;

	fill_dayofmon();
	document.dateinput.dateinput_day.selectedIndex = document.dateinput.dateinput_day.length-1;

	//initialize module panels
	for(var i=0; i<disps.length; i++)
	{
		eval(disps[i]+"_disp_module = new YAHOO.widget.Module('"+disps[i]+"_disp', { visible: false })");
		eval(disps[i]+"_tipspanel_module = new YAHOO.widget.Module('"+disps[i]+"_tipspanel', { visible: false })");
		
	}
	for(var i=0; i<parpanels.length; i++)
	{
		eval(parpanels[i]+"_parpanel_module = new YAHOO.widget.Module('"+parpanels[i]+"_parpanel', { visible: false })");
	}
	//set par function
	Event.delegate("dateinput", "change", onParChange, "select");
	Event.delegate("dateinput", "change", onParChange, "input");	
	Event.delegate("qmrefinput", "change", onParChange, "input");
	Event.delegate("verticalinput", "change", onParChange, "input");
	Event.delegate("dayofmoninput", "change", onParChange, "input");
	Event.delegate("dayofmoninput", "change", onParChange, "select");
	
	//set menu function
	Event.delegate("menu", "click", onMNClick, "div");

	parse_permalink(location);
	
 	//disable highchart animation
	Highcharts.setOptions({
	   plotOptions: {
		  series: {
			 animation: false
		  }
	   }
	});
}
$(function(){
  var cur_hr, new_hr;
  
  $(".btn-imgslider-left").click(function(){
    cur_hr = parseInt($("#dateinput_hour").val());
    new_hr = cur_hr == 0 ? 23 : cur_hr - 1;
    new_hr = new_hr < 10 ? "0" + new_hr.toString() : new_hr.toString();
    //console.log(cur_hr, new_hr);
    $("#dateinput_hour").val(new_hr);
    onParChange();
    $(this).blur();
  });
  $(".btn-imgslider-right").click(function(){
    cur_hr = parseInt($("#dateinput_hour").val());
    new_hr = cur_hr == 23 ? 0 : cur_hr + 1;
    new_hr = new_hr < 10 ? "0" + new_hr.toString() : new_hr.toString();    
    //console.log(cur_hr, new_hr);
    $("#dateinput_hour").val(new_hr);
    onParChange();
    $(this).blur();    
  });  
});