/**
* @file Logic for weather widget
*/
/**
* {@link Weather} object
* @public
*/
var weather;
/**
* Boolean variable, which define if fahrenheits as selected as showin temperature format.
* @default false
*/
var fahrenheit = false;
/**
* Array of week days in short notation for widget forecast day selection.
*/
var weekdaysShort = [];
weekdaysShort[0] = "SUN";
weekdaysShort[1] = "MON";
weekdaysShort[2] = "TUE";
weekdaysShort[3] = "WED";
weekdaysShort[4] = "THU";
weekdaysShort[5] = "FRI";
weekdaysShort[6] = "SAT";
/**
* Array of week days for forecast titles.
*/
var weekdays = [];
weekdays[0] = "Sunday";
weekdays[1] = "Monday";
weekdays[2] = "Tuesday";
weekdays[3] = "Wednesday";
weekdays[4] = "Thursday";
weekdays[5] = "Friday";
weekdays[6] = "Saturday";
/**
* Currently selected day, 0 (right now), 1 (tomorrow), 2 (day after tomorrow)...
* @default 0
*/
var selectedDay = 0;
/**
* Function called when page loads.
* @function onLoad
*/
function onLoad() {
weather = new Weather(weatherLoaded);
}
/**
* Function send to Weather and which is called after weather data is loaded.
* @function weatherLoaded
*/
function weatherLoaded() {
/*Preload images for each day in forecast*/
img1 = new Image(128, 128);
img1.src = "icons/" + weather.getDayIcon(1) + ".png";
img2 = new Image(128, 128);
img2.src = "icons/" + weather.getDayIcon(2) + ".png";
img3 = new Image(128, 128);
img3.src = "icons/" + weather.getDayIcon(3) + ".png";
img4 = new Image(128, 128);
img4.src = "icons/" + weather.getDayIcon(4) + ".png";
/**/
//Set current weather infomations
document.getElementById("dayTitle").innerText = "Now"; //Title
document.getElementById("weatherIcon").style.backgroundImage = "url(icons/" + weather.getIcon() + ".png)"; //Icon
//current location
var city = weather.location.city;
if (city.length > 14) { city = city.substring(0, 14) + "..."; } //short city name length if too long for widget title
document.getElementById("WeatherTitle").innerText = city;
document.getElementById("temperature").innerText = weather.getCelsius(weather.getTemperatureFahrenheit()) + "\xB0C"; //set current temperature
document.getElementById("switchFormat").innerText = "\xB0F"; // And Fahrenheit button for changing temperature format
//set short names for forecast days
document.getElementById("day1").innerText = weekdaysShort[new Date(weather.getDayTime(1)).getDay()];
document.getElementById("day2").innerText = weekdaysShort[new Date(weather.getDayTime(2)).getDay()];
document.getElementById("day3").innerText = weekdaysShort[new Date(weather.getDayTime(3)).getDay()];
document.getElementById("day4").innerText = weekdaysShort[new Date(weather.getDayTime(4)).getDay()];
}
/**
* Set focus color on switch button if mouse over.
* @function switchFormatFocus
*/
function switchFormatFocus(item) {
item.className = "switchFormat switchFormatFocus";
}
/**
* Remove focus color from switch button.
* @function switchFormatUnFocus
*/
function switchFormatUnFocus(item) {
item.className = "switchFormat";
}
/**
* Actions performed when switch format button clicked.
* @function changeFormat
*/
function changeFormat() {
fahrenheit = !fahrenheit;
updateTemperature();
if (fahrenheit)
document.getElementById("switchFormat").innerText = "\xB0C";
else
document.getElementById("switchFormat").innerText = "\xB0F";
}
/**
* Set focus color on day item if mouse over.
* @function dayFocus
* @params {HtmlElement} item - Item on which action is performed.
*/
function dayFocus(item) {
item.className = "day dayFocus";
}
/**
* Remove focus color from day item.
* @function dayUnFocus
* @params {HtmlElement} item - Item on which action is performed.
*/
function dayUnFocus(item) {
item.className = "day";
}
/**
* Change day of which is weather shown.
* @function changeDay
* @params {number} id - Number of selected day
*/
function changeDay(id) {
//check if weather current or for any other day
if (id == selectedDay) {
//SELECTED DAY == RIGHT NOW
document.getElementById("dayTitle").innerText = "Now";//set title
//Set temperature in celsius or fahrenheit
if (!fahrenheit) {
document.getElementById("temperature").innerText = weather.getCelsius(weather.getTemperatureFahrenheit()) + "\xB0C";//set temperature in celsius
} else {
document.getElementById("temperature").innerText = weather.getTemperatureFahrenheit() + "\xB0F";//set temperature in fahrenheit
}
document.getElementById("weatherIcon").style.backgroundImage = "url(icons/" + weather.getIcon() + ".png)";//set icon
document.getElementById("day" + selectedDay).style.backgroundColor = "";//delete selection on previous selected forecast day
selectedDay = 0; //set selected Day
} else {
document.getElementById("dayTitle").innerText = weekdays[new Date(weather.getDayTime(id)).getDay()];//set title
document.getElementById("weatherIcon").style.backgroundImage = "url(icons/" + weather.getDayIcon(id) + ".png)";//set icon
//set temperature in fahreheit or celsius
if (!fahrenheit) {
document.getElementById("temperature").innerText =
Math.floor((weather.getCelsius(weather.getDayMaxTemperatureFahrenheit(id))) * 10) / 10 + "\xB0C"; //set temperature in celsius
document.getElementById("switchFormat").innerText = "\xB0F";
} else {
document.getElementById("temperature").innerText =
Math.floor(weather.getDayMaxTemperatureFahrenheit(id) * 10) / 10 + "\xB0F"; //set temperature in fahreheit
document.getElementById("switchFormat").innerText = "\xB0C";
}
//Deselect old selection in forecast days
if (selectedDay != 0) document.getElementById("day" + selectedDay).style.backgroundColor = "";
selectedDay = id;
document.getElementById("day" + selectedDay).style.backgroundColor = "#3690A0"; // and select new selection in forecast days
}
}
/**
* Updates temperature aftwer format is switched.
* @function updateTemperature
*/
function updateTemperature() {
// if current weather
if (selectedDay == 0) {
if (!fahrenheit) {
document.getElementById("temperature").innerText = weather.getCelsius(weather.getTemperatureFahrenheit()) + "\xB0C"; //set temperature in celsius
document.getElementById("switchFormat").innerText = "\xB0F";
} else {
document.getElementById("temperature").innerText = weather.getTemperatureFahrenheit() + "\xB0F"; // set temperature in fahreheits
document.getElementById("switchFormat").innerText = "\xB0C";
}
} else {
if (!fahrenheit) {
document.getElementById("temperature").innerText =
Math.floor((weather.getCelsius(weather.getDayMaxTemperatureFahrenheit(selectedDay))) * 10) / 10 + "\xB0C"; //set tempature in celsius
document.getElementById("switchFormat").innerText = "\xB0F";
} else {
document.getElementById("temperature").innerText =
Math.floor((weather.getDayMaxTemperatureFahrenheit(selectedDay)) * 10) / 10 + "\xB0F"; //set tempature in fahreheits
document.getElementById("switchFormat").innerText = "\xB0C";
}
}
}