// 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'];
var date_parpanel_module;
var qmref_parpanel_module;
var dayofmon_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'];
var tims_selps = ['dayofmon','qmref'];  // dayofmon is daily/monthly
var iddb_selps = ['date','dayofmon','qmref'];
var itim_selps = ['date','qmref'];

//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:'noid', label:"   N_ID   ", chart:null }
tims[1] = { key:'noid_norm', label:"N_ID_norm", chart:null }
tims[2] = { key:'nobs', label:"  N_Obs  ", chart:null }
tims[3] = { key:'nobs_norm', label:"N_Obs_norm", chart:null }
tims[4] = { key:'mean', label:"  Mean  ", chart:null }
tims[5] = { key:'medn', label:"Median", chart:null }
tims[6] = { key:'stdv', label:"    SD    ", chart:null }
tims[7] = { key:'rstd', label:"   RSD   ", chart:null }
tims[8] = { key:'minv', label:"   Min   ", chart:null }
tims[9] = { key:'maxv', label:"   Max   ", chart:null }
tims[10] = { key:'dummy', label:"         this is 123", chart:null }
tims[11] = { key:'qcar', label:'Argo QC', chart:null }
tims[12] = { key:'qcdr', label:'Drifter QC', chart:null }
tims[13] = { key:'qchr', label:'HR-Drifter QC', chart:null }
tims[14] = { key:'qctm', label:'T-Mooring QC', chart:null }
tims[15] = { key:'qccm', label:'C-Mooring QC', chart:null }
tims[16] = { key:'qccr', label:'CRW QC', chart:null }
tims[17] = { key:'qcsh', label:'Ship QC', chart:null }
tims[18] = { key:'qcim', label:'IMOS QC', chart:null }

var tims_daily = new Array();
tims_daily[0] = { key:'noid', label:"   N_ID   ", chart:null }
tims_daily[1] = { key:'nobs', label:"  N_Obs  ", chart:null }
tims_daily[2] = { key:'mean', label:"  Mean  ", chart:null }
tims_daily[3] = { key:'stdv', label:"    SD    ", chart:null }

var Index_of_first_qc_tims = 10;
var HighchartPlatformVisibility = {//memory of chart platform series visibility
  "cic085 (GeoOptics)": true,
  "cic086 (GeoOptics)": true,
  "cic087 (GeoOptics)": true,
  "KOMPSAT5 (UCAR wet)": true,
  "KOMPSAT5 (UCAR dry)": true,
  "COSMIC-1 (UCAR wet)": true,
  "COSMIC-2 (UCAR wet)": true,
  "COSMIC-3 (UCAR wet)": true,
  "COSMIC-4 (UCAR wet)": true,
  "COSMIC-5 (UCAR wet)": true,
  "COSMIC-6 (UCAR wet)": true,
  "COSMIC-1 (UCAR dry)": true,
  "COSMIC-2 (UCAR dry)": true,
  "COSMIC-3 (UCAR dry)": true,
  "COSMIC-4 (UCAR dry)": true,
  "COSMIC-5 (UCAR dry)": true,
  "COSMIC-6 (UCAR dry)": true,
  "COSMIC-1 (S4 bufr)": true,
  "COSMIC-2 (S4 bufr)": true,
  "COSMIC-3 (S4 bufr)": true,
  "COSMIC-4 (S4 bufr)": true,
  "COSMIC-5 (S4 bufr)": true,
  "COSMIC-6 (S4 bufr)": true,
  "MetopA (UCAR wet)":     true,
  "MetopB (UCAR wet)":     true,
  "MetopC (UCAR wet)":     true,
  "MetopA (UCAR dry)":     true,
  "MetopB (UCAR dry)":     true,
  "MetopC (UCAR dry)":     true,
  "MetopA (S4 bufr)":     true,
  "MetopB (S4 bufr)":     true,
  "MetopC (S4 bufr)":     true,
  "TerraSAR-X (S4 bufr)":     true,
  "TanDEM-X (S4 bufr)":     true,
  "GRACE-A (S4 bufr)":     true,
  "GRACE-B (S4 bufr)":     true,
  "C-NOFS (S4 bufr)":     true
};
var HighchartQCCheckVisibility = {	//memory of chart QC Check series visibility
  "DR": true,
  "GL": true,
  "TS": true,
  "SG": true,
  "RS": true,
  "XP": true,
  "PH": true,
  "XQ": true,
  "AL": 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 = 4, HC_num_tims_monthly = 19, HC_num_tims_daily = 4;
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:'GeoOptics', label:'GeoOptics' }
qmap[1] = { key:'UCARdry', label:'UCAR (dry)' }
qmap[2] = { key:'UCARwet', label:'UCAR (wet)' }
qmap[3] = { key:'S4bufr', label:'S4 (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 Time Series - NOBS', chart:null }
qsum[4] = { key:'hour_norm', label:'Hourly Time Series - NOBS (Normalized)', chart:null }
qsum[5] = { key:'prof_refr', label:'Refractivity Profile', chart:null }
qsum[6] = { key:'prof_temp', label:'Temperature Profile', chart:null }

var iddb = new Array();
iddb[0] = {key:'GeoOptics', label:'GeoOptics', dataTable:null};
iddb[1] = {key:'UCARdry', label:'UCAR (dry)', dataTable:null};
iddb[2] = {key:'UCARwet', label:'UCAR (wet)', dataTable:null};
iddb[3] = {key:'S4bufr', label:'S4 (bufr)', dataTable:null};
//iddb[3] = {key:'S4bufr-IGOR', label:'IGOR (S4 bufr)', dataTable:null};
//iddb[4] = {key:'CDACC-KOMPSAT5', label:'CDACC-KOMPSAT5', 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("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();    
  });  
});