// Build the Random Forecaster app

hideElement("forecastDropdown");
// list of all values
var cityList = getColumn("Daily Weather", "City");
var highTemp = getColumn("Daily Weather", "High Temperature");
var lowTemp = getColumn("Daily Weather", "Low Temperature");
var conditionList = getColumn("Daily Weather", "Condition Description");
var forecastNumberList = getColumn("Daily Weather", "Forecast Number");
var imageList = getColumn("Daily Weather", "Icon");

// These are the var's for the new chosen City, Condition, Image, High Temp, Low Temp.
var lteredCityList = [];
var lteredConditionList = [];
var lteredImageList = [];
var lteredHighTemp = [];
var lteredLowTemp = [];

function lter() {
lteredCityList = [];
lteredConditionList = [];
lteredImageList = [];
lteredHighTemp = [];
lteredLowTemp = [];

// This is to pick a random City, Condition, Image, High Temp, Low Temp.
for (var i = 0; i < cityList.length; i++) {
if (forecastNumberList[i] < 2) {
// adding the new conditions to the var states
appendItem( lteredCityList, cityList[i]);
appendItem( lteredConditionList, conditionList[i]);
appendItem( lteredLowTemp, lowTemp[i]);
appendItem( lteredImageList, imageList[i]);
appendItem( lteredHighTemp, highTemp[i]);
}
}
}

// Puts all of the new values on screen to use.

function updateScreen() {
var index = randomNumber(0, lteredCityList.length - 1);
setText("cityOutput", lteredCityList[index]);
setText("highTempOutput", lteredHighTemp[index]);
setText("lowTempOutput", lteredLowTemp[index]);
setText("conditionOutput", lteredConditionList[index]);
setImageURL("iconOutput", lteredImageList[index]);

// Change the background color if it's under 32

if ( lteredLowTemp[index] < 32) {
setProperty("lowBackground", "background-color", "pink");
} else {
setProperty("lowBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

// Change the background color if it's over 70

fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
 if ( lteredHighTemp[index] > 70) {
setProperty("highBackground", "background-color", "#DDD618");
} else {
setProperty("highBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

// Check for extreme weather warnings

var warningMessage = "Warnings: ";

if ( lteredLowTemp[index] < 10) {

warningMessage += "It is going to be dangerously cold!";
} else if ( lteredLowTemp[index] > 100) {
warningMessage += "It is going to be dangerously hot!";
}

// Display the warning message

setText("warningsOutput", warningMessage);
}

// Create a list of unique cities for the dropdown

var uniqueCities = [];
for (var i = 0; i < cityList.length; i++) {
// Check if city is not already in the uniqueCities list
var isUnique = true;
for (var j = 0; j < uniqueCities.length; j++) {
if (uniqueCities[j] == cityList[i]) {
isUnique = false;
}
}
// If unique, add to the dropdown options
if (isUnique) {
uniqueCities.push(cityList[i]);
// Add unique city to dropdown
setProperty("cityDropdown", "options", uniqueCities);
}
}

// Update Screen and Filter on random forecast button click

onEvent("randomforecastButton", "click", function() {
lter();
updateScreen();

// Hide the forecastDropdown

hideElement("forecastDropdown");

// Reset cityDropdown to default option

setProperty("cityDropdown", "value", "Select City");
});

// Handle city selection and display forecast for that city

onEvent("cityDropdown", "change", function() {
var selectedCity = getProperty("cityDropdown", "value");

// Clear the ltered lists

fi
fi
fi
fi
fi
 lteredCityList = [];
lteredConditionList = [];
lteredImageList = [];
lteredHighTemp = [];
lteredLowTemp = [];

// Filter data based on the selected city and today's forecast

for (var i = 0; i < cityList.length; i++) {
if (cityList[i] == selectedCity && forecastNumberList[i] == 1) {
// Add the matching forecast data for today
appendItem( lteredCityList, cityList[i]);
appendItem( lteredConditionList, conditionList[i]);
appendItem( lteredLowTemp, lowTemp[i]);
appendItem( lteredImageList, imageList[i]);
appendItem( lteredHighTemp, highTemp[i]);
}
}

// If there is data for the selected city, update the screen with today's forecast
if ( lteredCityList.length > 0) {
setText("cityOutput", lteredCityList[0]);
setText("highTempOutput", lteredHighTemp[0]);
setText("lowTempOutput", lteredLowTemp[0]);
setText("conditionOutput", lteredConditionList[0]);
setImageURL("iconOutput", lteredImageList[0]);

// Change the background color based on temperatures

if ( lteredLowTemp[0] < 32) {
setProperty("lowBackground", "background-color", "pink");
} else {
setProperty("lowBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

if ( lteredHighTemp[0] > 70) {

setProperty("highBackground", "background-color", "#DDD618");
} else {
setProperty("highBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

// Unhide the forecastDropdown if city is selected

showElement("forecastDropdown");
}
});

// Handle forecast selection from the forecastDropdown

onEvent("forecastDropdown", "change", function() {
var selectedCity = getProperty("cityDropdown", "value");
var selectedForecast = getProperty("forecastDropdown", "value");
var forecastNumber;

// Map forecast names to their corresponding numbers

if (selectedForecast == "Today") {
forecastNumber = 1;
} else if (selectedForecast == "Tomorrow") {
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
 forecastNumber = 2;
} else if (selectedForecast == "Next Day") {
forecastNumber = 3;
}

// Clear the ltered lists

lteredCityList = [];
lteredConditionList = [];
lteredImageList = [];
lteredHighTemp = [];
lteredLowTemp = [];

// Filter data based on the selected city and selected forecast

for (var i = 0; i < cityList.length; i++) {
if (cityList[i] == selectedCity && forecastNumberList[i] == forecastNumber) {
// Add the matching forecast data
appendItem( lteredCityList, cityList[i]);
appendItem( lteredConditionList, conditionList[i]);
appendItem( lteredLowTemp, lowTemp[i]);
appendItem( lteredImageList, imageList[i]);
appendItem( lteredHighTemp, highTemp[i]);
}
}

// If there is data for the selected city and forecast, update the screen
if ( lteredCityList.length > 0) {
setText("cityOutput", lteredCityList[0]);
setText("highTempOutput", lteredHighTemp[0]);
setText("lowTempOutput", lteredLowTemp[0]);
setText("conditionOutput", lteredConditionList[0]);
setImageURL("iconOutput", lteredImageList[0]);

// Change the background color based on temperatures

if ( lteredLowTemp[0] < 32) {
setProperty("lowBackground", "background-color", "pink");
} else {
setProperty("lowBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

if ( lteredHighTemp[0] > 70) {

setProperty("highBackground", "background-color", "#DDD618");
} else {
setProperty("highBackground", "background-color", "rgb(255, 255, 255, 0.57)");
}

// Check for extreme weather warnings

var warningMessage = "Warnings: ";

if ( lteredLowTemp[0] < 10) {

warningMessage += "It is going to be dangerously cold!";
} else if ( lteredLowTemp[0] > 100) {
warningMessage += "It is going to be dangerously hot!";
}
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
fi
 // Display the warning message
setText("warningsOutput", warningMessage);
}
});
hideElement("forecastDropdown");
setProperty("cityDropdown", "value", "Select City");