Commit d6167b70 authored by Zach Knox's avatar Zach Knox

Many little changes. Icons for rain, better card sizes

Still plenty broken though
parent 6a0cfde2
cd weather
meteor --settings config/settings.json
cd ..
......@@ -36,7 +36,7 @@
.out-of-focus-card.mdl-card {
margin: auto;
width: auto;
height: 30px;
/* height: 30px; */
}
.hourly-table.mdl-data-table {
......@@ -47,3 +47,37 @@
.table-full-width {
width: 100%;
}
.degree0.mdl-card {
background-color: #000000;
}
.degree10.mdl-card {
background-color: #222222;
}
.degree20.mdl-card {
background-color: #444444;
}
.degree30.mdl-card {
background-color: #666666;
}
.degree40.mdl-card {
background-color: #777777;
}
.degree50.mdl-card {
background-color: #888888;
}
.degree60.mdl-card {
background-color: #999999;
}
.degree70.mdl-card {
background-color: #aaaaaa;
}
.degree80.mdl-card {
background-color: #bbbbbb;
}
.degree90.mdl-card {
background-color: #dddddd;
}
.degree100.mdl-card {
background-color: #ffffff;
}
<template name="footer">
<footer class="mdl-mini-footer">
<div class="mdl-mini-footer__left-section">
<div class="mdl-logo">SRCT Weather</div>
<div class="mdl-logo">SRCT Weather | Powered by <a href="https://darksky.net/">Dark Sky</a></div>
</div>
<div class="mdl-mini-footer__right-section" style="align: right">
A project of Mason <a href="http://srct.gmu.edu/"><strong>SRCT</strong></a>, a registered student org.
......
<template name="weather">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--6-col">
<div class="mdl-cell mdl-cell--12-col">
<div class="weather-card mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h1 class="mdl-card__title-text">Current Conditions<br /></h1>
......@@ -13,7 +13,7 @@
</div>
<div class="detail-size">
Feels like {{roundNumber weatherData.data.currently.apparentTemperature}}<i class="wi wi-fahrenheit"></i>
<br /><br /><i class="wi wi-cloud"></i> {{precipitationWords}} &nbsp;&nbsp;&nbsp;<i class="wi wi-wind wi-towards-{{windDirectionClass}}"></i> {{roundNumber weatherData.data.currently.windSpeed}}mph {{windDirection}}
<br /><br /><i class="wi wi-{{precipitationIcons}}"></i> {{precipitationWords}} &nbsp;&nbsp;&nbsp;<i class="wi wi-wind wi-towards-{{windDirectionClass}}"></i> {{roundNumber weatherData.data.currently.windSpeed}}mph {{windDirection}}
<!-- TODO: Change the icon based on time -->
<br /><br /><i class="wi wi-sunset"></i> {{formatTimestamp weatherData.data.currently.time}}
</div>
......@@ -46,7 +46,7 @@
</div>
{{#each dayWeather in weatherData.data.daily.data}}
<div class="mdl-cell mdl-cell--4-col">
<div class="out-of-focus-card mdl-card mdl-shadow--4dp">
<div class="{{getColorStyle roundNumber dayWeather.temperatureMax}} out-of-focus-card mdl-card mdl-shadow--4dp">
<div class="mdl-card__title">
<h1 class="mdl-card__title-text">{{getDayNameFromTime dayWeather.time}}<br /></h1>
</div>
......@@ -57,7 +57,7 @@
</div>
<div class="detail-size">
<br />
{{precipitationWords dayWeather.precipProbability}}
<i class="wi wi-{{precipitationIcons dayWeather.precipProbability}}"></i> {{precipitationWords dayWeather.precipProbability}}
<br /><br />
</div>
</div>
......
......@@ -10,10 +10,22 @@ Template.weather.helpers({
if(weatherData === undefined) return "...";
var precipProb = weatherData.data.currently.precipProbability;
if(precipProb === 0) return "No Rain Expected";
if(precipProb > 50 && precipProb < 95) return "Potential for Rain";
if(precipProb > 95) return "Bring an Umbrella";
if(precipProb > 100) return "Wat."; //Wait.
return precipProb+"% Precipitation"; // Otherwise, return the percentage
},
//Convert precipitation percentage to icons
precipitationIcons: function() {
weatherDataDependency.depend();
if(weatherData === undefined) return "...";
var precipProb = weatherData.data.currently.precipProbability;
if(precipProb === 0) return "cloud";
if(precipProb > 50 && precipProb < 95) return "showers";
if(precipProb > 95) return "umbrella";
if(precipProb > 100) return "alien"; //Wait.
return precipProb+"% Precipitation"; // Otherwise, return the percentage
},
//Converts degrees to words
windDirection: function() {
weatherDataDependency.depend();
......@@ -89,6 +101,42 @@ Template.weather.helpers({
var days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
return days[ given.getDay() ];
},
getColorStyle: function(temp) {
var returning = "degree";
if(temp < 10) {
return returning + "0";
}
else if(temp >= 10 && temp < 20) {
return returning + "10";
}
else if(temp >= 20 && temp < 30) {
return returning + "20";
}
else if(temp >= 30 && temp < 40) {
return returning + "30";
}
else if(temp >= 40 && temp < 50) {
return returning + "40";
}
else if(temp >= 50 && temp < 60) {
return returning + "50";
}
else if(temp >= 60 && temp < 70) {
return returning + "60";
}
else if(temp >= 70 && temp < 80) {
return returning + "70";
}
else if(temp >= 80 && temp < 90) {
return returning + "80";
}
else if(temp >= 90 && temp < 100) {
return returning + "90";
}
else if(temp >= 100) {
return returning + "100";
}
}
});
......
{
"weatherCacheExpireTime": "3600"
"weatherCacheExpireTime": "1800"
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment