|
|
|
@ -77,20 +77,10 @@ function loadWeather(reload) {
|
|
|
|
|
$("#nowweathericon").attr("src", "assets/images/weather-none.svg");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var uvcolor = "#4CAF50";
|
|
|
|
|
if (resp.now.uv_index > 10) {
|
|
|
|
|
uvcolor = "#673AB7";
|
|
|
|
|
} else if (resp.now.uv_index > 7) {
|
|
|
|
|
uvcolor = "#F44336";
|
|
|
|
|
} else if (resp.now.uv_index > 5) {
|
|
|
|
|
uvcolor = "#FF9800";
|
|
|
|
|
} else if (resp.now.uv_index > 2) {
|
|
|
|
|
uvcolor = "#FFEB3B";
|
|
|
|
|
}
|
|
|
|
|
app.gauge.get('#nowuvindexgauge').update({
|
|
|
|
|
value: Math.max(resp.now.uv_index / 11, 0.05),
|
|
|
|
|
value: Math.min(resp.now.uv_index, 10) / 10,
|
|
|
|
|
valueText: resp.now.uv_index,
|
|
|
|
|
borderColor: uvcolor,
|
|
|
|
|
borderColor: colorThemeNameToHex(uvIndexToColor(resp.now.uv_index))
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (getStorage("units") == "metric") {
|
|
|
|
@ -194,15 +184,24 @@ function loadWeather(reload) {
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//
|
|
|
|
|
// Forecast tab
|
|
|
|
|
//
|
|
|
|
|
forecastItems = [];
|
|
|
|
|
|
|
|
|
|
for (var i = 1; i < resp.forecast.length; i++) {
|
|
|
|
|
var low = (getStorage("units") == "metric" ? Math.round(ftoc(resp.forecast[i].temp.min)) : Math.round(resp.forecast[i].temp.min));
|
|
|
|
|
var high = (getStorage("units") == "metric" ? Math.round(ftoc(resp.forecast[i].temp.max)) + " °C" : Math.round(resp.forecast[i].temp.max) + " °F");
|
|
|
|
|
var precipcolor = precipChanceToColor(resp.forecast[i].precipitation.chance);
|
|
|
|
|
forecastItems.push({
|
|
|
|
|
day: formatTimestamp('l', resp.forecast[i].date),
|
|
|
|
|
temps: low + " to " + high,
|
|
|
|
|
uv_index: resp.forecast[i].uv_index
|
|
|
|
|
uv_index: resp.forecast[i].uv_index,
|
|
|
|
|
uv_color: uvIndexToColor(resp.forecast[i].uv_index),
|
|
|
|
|
precip_chance: Math.round(resp.forecast[i].precipitation.chance * 100),
|
|
|
|
|
precip_color: precipcolor
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -212,7 +211,8 @@ function loadWeather(reload) {
|
|
|
|
|
+ ' <div class="item-title">'
|
|
|
|
|
+ ' <div class="item-header">{{day}}</div>'
|
|
|
|
|
+ ' {{temps}}'
|
|
|
|
|
+ ' <br>UV Index: {{uv_index}}'
|
|
|
|
|
+ ' <br /><span class="padding-half forecast-uv-badge badge color-{{uv_color}}"><i class="fas fa-sun fa-fw"></i> {{uv_index}}</span>'
|
|
|
|
|
+ ' <span class="padding-half forecast-precip-badge badge color-{{precip_color}}"><i class="fas fa-tint fa-fw"></i> {{precip_chance}}%</span>'
|
|
|
|
|
+ ' </div>'
|
|
|
|
|
+ ' </div>'
|
|
|
|
|
+ '</div>'
|
|
|
|
@ -249,4 +249,48 @@ function loadWeather(reload) {
|
|
|
|
|
}
|
|
|
|
|
}, 1000);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$("#app").on("click", "#weather-forecast .forecast-uv-badge", function () {
|
|
|
|
|
app.toast.show({
|
|
|
|
|
text: "<i class='fas fa-info-circle'></i> UV index",
|
|
|
|
|
position: "bottom",
|
|
|
|
|
destroyOnClose: true,
|
|
|
|
|
closeTimeout: 1000 * 3
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
$("#app").on("click", "#weather-forecast .forecast-precip-badge", function () {
|
|
|
|
|
app.toast.show({
|
|
|
|
|
text: "<i class='fas fa-info-circle'></i> Chance of precipitation",
|
|
|
|
|
position: "bottom",
|
|
|
|
|
destroyOnClose: true,
|
|
|
|
|
closeTimeout: 1000 * 3
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
function uvIndexToColor(index) {
|
|
|
|
|
var uvcolor = "green";
|
|
|
|
|
if (index >= 11) {
|
|
|
|
|
uvcolor = "purple";
|
|
|
|
|
} else if (index >= 8) {
|
|
|
|
|
uvcolor = "red";
|
|
|
|
|
} else if (index >= 6) {
|
|
|
|
|
uvcolor = "orange";
|
|
|
|
|
} else if (index >= 3) {
|
|
|
|
|
uvcolor = "yellow";
|
|
|
|
|
}
|
|
|
|
|
return uvcolor;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function precipChanceToColor(chance) {
|
|
|
|
|
var color = "lightblue";
|
|
|
|
|
if (chance > 0.8) {
|
|
|
|
|
color = "gray";
|
|
|
|
|
} else if (chance > 0.2) {
|
|
|
|
|
color = "blue";
|
|
|
|
|
} else {
|
|
|
|
|
color = "lightblue";
|
|
|
|
|
}
|
|
|
|
|
return color;
|
|
|
|
|
}
|