/* !!! READ THIS
Take out title tags when not debugging by setting debug to false
*/
var debug = true;
var numberColumnsShownAtOneTime = 3;
var numElements = ELEMENT_NAMES_ARRAY.length;
var numPeriods = NUMBER_OF_PERIODS; //PERIOD_NAMES.length;
var numSets = parseInt( (numElements-1) / numberColumnsShownAtOneTime ) + 1;
$(function() { // wait until loaded DOM
if (pagetype == PAGE_TYPE_DAY) {
createPeriodDropDownDailyView();
var tbody_template = "";
var tr_template_one_timeslot = ""
+ "| ${elementheading}"
+ " | "
+ "${slot1} |
";
var tr_template_one_timeslot_fddi_2_days_out = ""
+ "| ${elementheading}"
+ " | "
+ "No forecast for period |
";
var tr_template_four_timeslots = ""
+ "| ${elementheading}"
+ " | ${slot1} | "
+ "${slot2} | "
+ "${slot3} | "
+ "${slot4} | "
+ "
";
// figure out a tidier way to do this
var tr_template_four_timeslots_out_past_3_days = ""
+ "| ${elementheading}"
+ " | ${slot1} | "
+ ""
+ "${slot2} | "
+ "${slot3} | "
+ ""
+ "${slot4} | "
+ "
";
var tr_template_four_timeslots_out_past_3_days_rainfall = ""
+ "| ${elementheading}"
+ " | "
+ "${slot1} | "
+ ""
+ "${slot2} | "
+ ""
+ "${slot3} | "
+ ""
+ "${slot4} | "
+ "
";
for (var p = numPeriods; p > 0; p--) {
// insert tbody
$("#dailyviewtable thead").after( $.tmpl(tbody_template, { periodid: p } ) );
if (p != 1) {
$("#dailyviewtable #Period" + p).hide();
}
// create rows
for (var e = 0; e < numElements; e++) {
var gridname = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_NAME_INDEX];
var timeperiod_type = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TIMEPERIOD_TYPE];
var title = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TITLE];
var heading = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_HEADING];
// set which template to use
var template;
var values;
// if 12 hourly period
if (timeperiod_type == ELEMENT_TIMEPERIOD_24_HOURLY
|| timeperiod_type == ELEMENT_TIMEPERIOD_12_HOURLY) {
template = tr_template_one_timeslot;
var text;
if (periodDayNight[p-1] == DAY_FLAG) {
text = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TWELVE_HOUR_TEXT_DAY];
}
else {
text = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TWELVE_HOUR_TEXT_NIGHT];
}
// timeslot value
values = { period: p, elementgridname: gridname, elementtitle: title, elementheading: heading, slot1: text};
}
else if (timeperiod_type == ELEMENT_TIMEPERIOD_24_HOURLY_DAY0_AND_DAY1_ONLY) {
template = tr_template_one_timeslot_fddi_2_days_out;
if ((periodDayNight[0] == DAY_FLAG) && (p < 5)) {
template = tr_template_one_timeslot;
}
if ((periodDayNight[0] == NIGHT_FLAG) && (p < 4)) {
template = tr_template_one_timeslot;
}
var text;
if (periodDayNight[p-1] == DAY_FLAG) {
text = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TWELVE_HOUR_TEXT_DAY];
}
else {
text = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TWELVE_HOUR_TEXT_NIGHT];
}
// timeslot value
values = {
period: p,
elementgridname: gridname,
elementtitle: title,
elementheading: heading,
slot1: text
};
}
else if (timeperiod_type == ELEMENT_TIMEPERIOD_3_HOURLY_DAY0_DAY1_AND_DAY2_ONLY) {
var timeslot_array;
if (p >= 7) {
template = tr_template_four_timeslots_out_past_3_days_rainfall;
}
else {
template = tr_template_four_timeslots;
}
// timeslot values
values = {
period: p,
elementgridname: gridname,
elementtitle: title,
elementheading: heading,
slot1: timeslot_array[0],
slot2: timeslot_array[1],
slot3: timeslot_array[2],
slot4: timeslot_array[3]
};
}
// else 4 timeslots
else {
var timeslot_array;
if (p >= 7) template = tr_template_four_timeslots_out_past_3_days;
else template = tr_template_four_timeslots;
if (periodDayNight[p-1] == DAY_FLAG) {
timeslot_array = DAYTIME_TIMESLOTS;
}
else {
timeslot_array = NIGHTTIME_TIMESLOTS;
}
// timeslot values
values = {
period: p,
elementgridname: gridname,
elementtitle: title,
elementheading: heading,
slot1: timeslot_array[0],
slot2: timeslot_array[1],
slot3: timeslot_array[2],
slot4: timeslot_array[3]
};
}
$("#dailyviewtable #Period" + p).append( $.tmpl(template, values) );
}
}
$("span.link")
.click(function() {
var splitup = this.id.split(":", 3);
showElement(""+splitup[0],splitup[1],splitup[2]);
})
.css("cursor", "pointer")
.css("color", "blue")
.mouseover(function() { $(this).css('color', '#FF6633'); })
.mouseout(function() { $(this).css('color', 'blue'); });
$("span.disabled")
.css("cursor", "pointer")
.css("color", "gray")
.attr("title", NO_DATA_TITLE_MESSAGE)
.mouseover(function() { $(this).css('color', 'gray'); })
.mouseout(function() { $(this).css('color', 'gray'); });
$("span.rainfall")
.attr("title", NO_DATA_TITLE_MESSAGE_RAINFALL);
disableNextPrevButtonsWhereAppropriate();
}
else if (pagetype == PAGE_TYPE_WEEK) {
//var thead_part_template = "${heading} | ";
var thead_contents = "| "
+ "Element Sets: ";
//print out Element sets tabs: eg (1 2 3 ...)
for (var i = 1; i <= numSets; i++) {
thead_contents += "" + i + "";
}
thead_contents += " |
|---|
| ";
//print element heading (eg Max/MinTemp Temp Rainfall)
for (var e = 0; e < numElements; e++) {
var set = parseInt(e / 3) + 1;
var title = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TITLE];
var heading = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_HEADING];
thead_contents += ""+heading+" | ";
}
thead_contents += "
|---|
";
$("#weeklyviewtable thead").html(thead_contents);
$("#weeklyElementSwitch")
.css('text-align','right')
.css('cursor','pointer');
$("#weeklyElementSwitch span")
.css('color', 'blue')
.css('font-size', '10px')
.css('padding-left', '5px')
.css('padding-right', '5px')
.css('border', '1px solid #CCCCCC')
.mouseover(function() { $(this).css('color', '#FF6633'); })
.mouseout(function() { $(this).css('color', 'blue'); });
var th_template = "${periodname} | ";
var row1 = th_template;
var row1_not_day0_or_day1 = th_template;
var row2 = "";
var row2_3_days_out = "";
var row3 = "";
var row3_3_days_out = "";
var row4 = "";
var row4_3_days_out = "";
var text;
var timePeriodType;
var set;
for (var e = 0; e < numElements; e++) {
var set = "set" + (parseInt(e / 3) + 1);
var timePeriodType = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TIMEPERIOD_TYPE];
var gridname = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_NAME_INDEX];
if (timePeriodType == ELEMENT_TIMEPERIOD_24_HOURLY
|| timePeriodType == ELEMENT_TIMEPERIOD_12_HOURLY) {
// todo : figure out a better way to do this, i.e. defined in config.js
// add special case elements here
// PS - 20110608 Added one line to fix issue with the presentation
// of some elements in the weekly view where the text would show
// up as ${MinOrMax} when it souldn't - not sure of the actual cause
// needs to be revisited.
text = ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_TWELVE_HOUR_TEXT_DAY];
if (ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_NAME_INDEX] == ELEMENT_NAME_MAXTMINT) {
text = '${MinOrMax}'; // reparsed later
}
else if (ELEMENT_NAMES_ARRAY[e][WEATHER_ELEMENT_ARRAY_ELEMENT_NAME_INDEX] == ELEMENT_NAME_DAILY_PRECIP) {
text = NUMBER_OF_HOUR_LINK_TEXT;
}
//row 1
row1 +=
""
+ ""+text+" | ";
row1_not_day0_or_day1 +=
""
+ ""+text+" | ";
}
else if (timePeriodType == ELEMENT_TIMEPERIOD_24_HOURLY_DAY0_AND_DAY1_ONLY) {
text = FFDIMaxT_LINK_TEXT;
template = td_template_12_hour;
var na_text = "N/A";
//row 1
row1 +=
""
+ ""+text+" | ";
row1_not_day0_or_day1 +=
""
+ ""+na_text+" | ";
}
else if (timePeriodType == ELEMENT_TIMEPERIOD_3_HOURLY_DAY0_DAY1_AND_DAY2_ONLY) { /* rainfall */
row1 +=
""
+ "${slot1text} | ";
row1_not_day0_or_day1 +=
""
+ "${slot1text} | ";
row2 +=
""
+ "${slot2text} | ";
row2_3_days_out +=
""
+ "${slot2text} | ";
row3 +=
""
+ "${slot3text} | ";
row4 +=
""
+ "${slot4text} | ";
row4_3_days_out +=
""
+ "${slot4text} | ";
}
else {
//row 1-4
row1 +=
""
+ "${slot1text} | ";
row1_not_day0_or_day1 +=
""
+ "${slot1text} | ";
row2 +=
""
+ "${slot2text} | ";
row2_3_days_out +=
""
+ "${slot2text} | ";
row3 +=
""
+ "${slot3text} | ";
row4 +=
""
+ "${slot4text} | ";
row4_3_days_out +=
""
+ "${slot4text} | ";
}
}
var period_template =
"" + row1 + "
" + row2 + "
" + row3 + "
"
+ row4 + "
";
var period_template_not_day1_or_day2 =
"" + row1_not_day0_or_day1 + "
" + row2 + "
"
+ row3 + "
" + row4 + "
";
var period_template_3_days_out =
"" + row1_not_day0_or_day1 + "
" + row2_3_days_out
+ "
" + row3 + "
" + row4_3_days_out + "
";
for (var p = 0; p < numPeriods; p++) {
// period name
var periodname = PERIOD_NAMES[p];
// period number
var periodnumber = p+1;
// max min text and slots text
var dayOrNight = periodDayNight[p];
var maxMinText;
var timeslots;
if (dayOrNight == DAY_FLAG) {
maxMinText = LINK_TEXT_DAYTIME_MAXIMUM;
timeslots = DAYTIME_TIMESLOTS;
}
else {
maxMinText = LINK_TEXT_OVERNIGHT_MINIMUM;
timeslots = NIGHTTIME_TIMESLOTS;
}
var slot1text = timeslots[0];
var slot2text = timeslots[1];
var slot3text = timeslots[2];
var slot4text = timeslots[3];
var values =
{
periodname: periodname,
period: periodnumber,
MinOrMax: maxMinText,
slot1text: slot1text,
slot2text: slot2text,
slot3text: slot3text,
slot4text: slot4text
};
var template_to_use;
if (p < 6) { /* first three days */
template_to_use = period_template;
if ((periodDayNight[0] == DAY_FLAG) && (p > 3)) {
template_to_use = period_template_not_day1_or_day2;
}
if ((periodDayNight[0] == NIGHT_FLAG) && (p > 2)) {
template_to_use = period_template_not_day1_or_day2;
}
}
else { /* more than 3 days out */
template_to_use = period_template_3_days_out;
}
$("#weeklyviewtable tbody").append($.tmpl(template_to_use, values));
}
$("span.link")
.click(function() {
var splitup = this.id.split(":", 3);
showElement(""+splitup[0],splitup[1],splitup[2]);
//alert("sssss "+this.id);
})
.css("cursor", "pointer")
.css("color", "blue")
.mouseover(function() { $(this).css('color', '#FF6633'); })
.mouseout(function() { $(this).css('color', 'blue'); });
$("span.disabled")
.css("cursor", "pointer")
.css("color", "gray")
.attr("title", NO_DATA_TITLE_MESSAGE)
.mouseover(function() { $(this).css('color', 'gray'); })
.mouseout(function() { $(this).css('color', 'gray'); });
$("span.rainfall")
.attr("title", NO_DATA_TITLE_MESSAGE_RAINFALL);
/* rainfall special case */
for (var i = 0; i < 24; i++)
{
$("span.rainfall:eq(" + i + ")")
.attr("title", "")
.click(function() {
var splitup = this.id.split(":", 3);
showElement(""+splitup[0],splitup[1],splitup[2]);
})
.css("cursor", "pointer")
.css("color", "blue")
.mouseover(function() { $(this).css('color', '#FF6633'); })
.mouseout(function() { $(this).css('color', 'blue'); });
}
showSet(1);
}
//because fire have more elements then public, so the right hand panel to en-large
var extRightHandPanel = 0;
if (gfeForecastType == "Fire") {
//increase size of right handle panel
extRightHandPanel = 100;
}
// resize for image
var image_height = $('#mapimage').height();
var rhscontrolblock_height = $('#right-hand-side-control-block').height() + extRightHandPanel;
var maincontent_height = $('#main-content').height();
$('#image').height(image_height);
if (image_height > rhscontrolblock_height) {
$('#right-hand-side-control-block').height(image_height);
$('#main-content').height(image_height);
}
else {
$('#right-hand-side-control-block').height(rhscontrolblock_height);
$('#image').height(rhscontrolblock_height);
$('#main-content').height(rhscontrolblock_height);
}
});
function showSet(set) {
var setClass = "";
for (var i = 1; i <= numSets; i++) {
setClass = ".set" + i;
if (i == set) $(setClass).show();
else $(setClass).hide();
$("#set" + i + "link").css('background-color', '#FFFFFF');
}
$("#set" + set + "link").css('background-color', '#E5E5C3');
}