RPJosh
/
nc-weather
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Style adjustements & wind direction

master
Loic Blot 2015-07-11 15:43:34 +00:00
parent 1bab48db59
commit dd432aa54f
3 changed files with 44 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
css/style.css
View File

@ -141,3 +141,11 @@
padding: 20px; padding: 20px;
font-size: 1.5em; font-size: 1.5em;
} }
#city-weather-panel {
border-radius: 3px;
padding: 30px;
padding-top: 20px;
background-color: rgba(50, 50, 50, 0.5);
display: inline-block;
}

27
js/public/app.js
View File

@ -34,6 +34,7 @@ app.controller('WeatherController', ['$scope', '$interval', '$timeout', '$compil
$scope.imageMapper = { $scope.imageMapper = {
"Clear": "sun_clear.jpg", "Clear": "sun_clear.jpg",
"Clouds": "clouds.jpg", "Clouds": "clouds.jpg",
"Rain": "rain.jpg",
} }
$timeout(function () { $timeout(function () {
@ -67,6 +68,32 @@ app.controller('WeatherController', ['$scope', '$interval', '$timeout', '$compil
if (data != null) { if (data != null) {
$scope.currentCity = data; $scope.currentCity = data;
$scope.currentCity.image = $scope.imageMapper[$scope.currentCity.weather[0].main]; $scope.currentCity.image = $scope.imageMapper[$scope.currentCity.weather[0].main];
$scope.currentCity.wind.desc = "";
if ($scope.currentCity.wind.deg > 0 && $scope.currentCity.wind.deg < 23 ||
$scope.currentCity.wind.deg > 333) {
$scope.currentCity.wind.desc = "North";
}
else if ($scope.currentCity.wind.deg > 22 && $scope.currentCity.wind.deg < 67) {
$scope.currentCity.wind.desc = "North-East";
}
else if ($scope.currentCity.wind.deg > 66 && $scope.currentCity.wind.deg < 113) {
$scope.currentCity.wind.desc = "East";
}
else if ($scope.currentCity.wind.deg > 112 && $scope.currentCity.wind.deg < 157) {
$scope.currentCity.wind.desc = "South-East";
}
else if ($scope.currentCity.wind.deg > 156 && $scope.currentCity.wind.deg < 201) {
$scope.currentCity.wind.desc = "South";
}
else if ($scope.currentCity.wind.deg > 200 && $scope.currentCity.wind.deg < 245) {
$scope.currentCity.wind.desc = "South-West";
}
else if ($scope.currentCity.wind.deg > 244 && $scope.currentCity.wind.deg < 289) {
$scope.currentCity.wind.desc = "West";
}
else if ($scope.currentCity.wind.deg > 288 && $scope.currentCity.wind.deg < 334) {
$scope.currentCity.wind.desc = "North-West";
}
} }
else { else {
$scope.cityLoadError = 'Failed to get city weather informations. Please contact your administrator'; $scope.cityLoadError = 'Failed to get city weather informations. Please contact your administrator';

16
templates/main.php
View File

@ -31,12 +31,14 @@
<span class="city-load-error">{{ cityLoadError }}</span> <span class="city-load-error">{{ cityLoadError }}</span>
</div> </div>
<div id="city-right" ng-show="currentCity != null" style="background-image: url('/apps/weather/images/{{ currentCity.image }}');"> <div id="city-right" ng-show="currentCity != null" style="background-image: url('/apps/weather/images/{{ currentCity.image }}');">
<div class="city-name">{{ currentCity.name }}, {{ currentCity.sys.country }}</div> <div id="city-weather-panel">
<div class="city-current-temp">{{ currentCity.main.temp }}°C</div> <div class="city-name">{{ currentCity.name }}, {{ currentCity.sys.country }}</div>
<div class="city-current-pressure">Pressure: {{ currentCity.main.pressure }} hpa</div> <div class="city-current-temp">{{ currentCity.main.temp }}°C</div>
<div class="city-current-humidity">Humidity: {{ currentCity.main.humidity}}%</div> <div class="city-current-pressure">Pressure: {{ currentCity.main.pressure }} hpa</div>
<div class="city-current-weather">Cloudiness: {{ currentCity.weather[0].description }}</div> <div class="city-current-humidity">Humidity: {{ currentCity.main.humidity}}%</div>
<div class="city-current-wind">Wind: {{ currentCity.wind.speed }} {{ currentCity.wind.deg }}</div> <div class="city-current-weather">Cloudiness: {{ currentCity.weather[0].description }}</div>
<div class="city-current-sunrise">Sunrise: {{ currentCity.sys.sunrise * 1000 | date:'HH:mm' }} Sunset: {{ currentCity.sys.sunset * 1000 | date:'HH:mm' }}</div> <div class="city-current-wind">Wind: {{ currentCity.wind.speed }} m/s - {{ currentCity.wind.desc }}</div>
<div class="city-current-sunrise">Sunrise: {{ currentCity.sys.sunrise * 1000 | date:'HH:mm' }} Sunset: {{ currentCity.sys.sunset * 1000 | date:'HH:mm' }}</div>
</div>
</div> </div>
</div> </div>