Good Morning!
+
|
+Fetching Weather...
diff --git a/js/main.js b/js/main.js
index d64f870..aa3aedf 100644
--- a/js/main.js
+++ b/js/main.js
@@ -7,10 +7,14 @@ searchBarId = "search-bar-input"
messageDivId = "message"
dateDivId = "date"
dateId = "date-text"
+weatherId = "weather-text"
+lineId = "line"
messageId = "message-text"
otherContentId = "other-content"
-userName = "Deepjyoti"
+userName = ""
disable24Hour = false;
+appId = "fd2c04ed7f9802656bd2cc23bddc7ad9"
+apiUrl = "http://api.openweathermap.org/data/2.5/weather"
bgClassContainer = [
"media",
"work",
@@ -28,6 +32,9 @@ searchEngines = {
"Bing": "https://www.bing.com/search?q=",
"Yahoo": "https://search.yahoo.com/search?p="
}
+validWeatherUnit = [
+ "fah", "cel"
+]
function initBody() {
/**
@@ -115,6 +122,43 @@ function updateTimeHook() {
}, 30 * 1000)
}
+function getFahrenheit(inCelcius) {
+ return (inCelcius * 9 / 5) + 32
+}
+
+function indexUppercase(unformatted) {
+ return unformatted.split(" ").map(w => {
+ return w[0].toUpperCase() + w.substring(1)
+ }).join(" ")
+}
+
+function updateWeather(weatherConfig) {
+ /**
+ * Get the weather using the location passed by the user using
+ * the config and update it in a formatted way according to
+ * the unit.
+ */
+ userLocation = weatherConfig["location"].replace(/\ /g, ",")
+ passedUnit = weatherConfig["unit"]
+ unit = validWeatherUnit.includes(passedUnit.substring(0, 3)) ?
+ passedUnit : "cel"
+
+ fetchUrl = apiUrl + `?q=${userLocation}&appid=${appId}&units=metric`
+
+ fetch(fetchUrl)
+ .then(response => {return response.json()})
+ .then(jsonData => {
+ temp = jsonData["main"]["temp"]
+ weatherType = jsonData["weather"][0]["main"]
+ console.log(temp, weatherType)
+
+ temp = !unit.includes("cel") ?
+ getFahrenheit(temp) + "°F" : temp + "°C"
+ weatherText = temp + ", " + indexUppercase(weatherType)
+ document.getElementById(weatherId).innerHTML = weatherText
+ })
+}
+
function inRange(number, min, max) {
return (number >= min && number <= max)
}
@@ -144,16 +188,25 @@ function parseAndCreate(jsonData) {
// Check if welcome message is supposed to be disabled
if (jsonData["disableMessage"])
document.getElementById(messageDivId).style.display = "none"
- if (jsonData["disableDate"])
- document.getElementById(dateDivId).style.display = "none"
+ if (jsonData["disableDate"]) {
+ // Hide the date and the line
+ document.getElementById(dateId).style.display = "none"
+ document.getElementById(lineId).style.display = "none"
+ }
else
updateTimeHook()
+ if (jsonData["disableWeather"]){
+ // Hide the date and the line
+ document.getElementById(weatherId).style.display = "none"
+ document.getElementById(lineId).style.display = "none"
+ }
+ else
+ updateWeather(jsonData["weatherConf"])
if (jsonData["disableSearchBar"])
document.getElementById(searchBarDivId).style.display = "none"
else
initSearchBar(jsonData)
-
sqrs = jsonData["squares"]
sqrs.forEach((element, index) => {
diff --git a/scss/main.scss b/scss/main.scss
index d2720fd..2a0b356 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -40,8 +40,15 @@ body {
width: 100%;
text-align: center;
- #date-text {
- padding-top: 15px;
+ #date {
+ h2 {
+ padding-top: 15px;
+ display: inline-block;
+ vertical-align: top;
+ }
+ }
+
+ #date-text, #weather-text {
color: darken($foreground, 15);
}