imp4ct/WeatherXi
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added loading

Browse Source
This commit is contained in:
Sean Corrigan 2020-07-29 23:35:46 -04:00
parent 94615fd66e
commit d359a86e9f
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
index.html
View File

@ -16,7 +16,7 @@
</div> </div>
<div class="weather-container"><i class="weather-icon" data-feather="sun"></i> <div class="weather-container"><i class="weather-icon" data-feather="sun"></i>
<h1 class="weather-temp">{{weather.current.temp}}&deg;C</h1> <h1 class="weather-temp">{{weather.current.temp}}&deg;C</h1>
<h3 class="weather-desc">{{weather.current.weather[0].main}}</h3> <h3 class="weather-desc">{{weather.current.weather[0].main}}{{loading}}</h3>
</div> </div>
</div> </div>
<div class="info-side"> <div class="info-side">
@ -38,10 +38,10 @@
</div> </div>
<div class="week-container"> <div class="week-container">
<ul class="week-list"> <ul class="week-list">
<li></i><span class="day-name">+1h</span><span class="day-temp">{{weather.hourly[0].temp}}&deg;C</span></li> <li></i><span class="day-name">+1h</span><span class="day-temp">{{weather.hourly[0].temp}}&deg;C<br>{{weather.hourly[0].weather[0].main}}</span></li>
<li></i><span class="day-name">+2h</span><span class="day-temp">{{weather.hourly[1].temp}}&deg;C</span></li> <li></i><span class="day-name">+2h</span><span class="day-temp">{{weather.hourly[1].temp}}&deg;C<br>{{weather.hourly[1].weather[0].main}}</span></li>
<li></i><span class="day-name">+4h</span><span class="day-temp">{{weather.hourly[3].temp}}&deg;C</span></li> <li></i><span class="day-name">+4h</span><span class="day-temp">{{weather.hourly[3].temp}}&deg;C<br>{{weather.hourly[3].weather[0].main}}</span></li>
<li></i><span class="day-name">+8h</span><span class="day-temp">{{weather.hourly[7].temp}}&deg;C</span></li> <li></i><span class="day-name">+8h</span><span class="day-temp">{{weather.hourly[7].temp}}&deg;C<br>{{weather.hourly[7].weather[0].main}}</span></li>
<div class="clear"></div> <div class="clear"></div>
</ul> </ul>
</div> </div>
@ -53,6 +53,7 @@
app.controller('body', function($scope, $http) { app.controller('body', function($scope, $http) {
//Some sort of async function so location is got before the script called //Some sort of async function so location is got before the script called
$scope.weather = 0 $scope.weather = 0
$scope.loading = 'Loading...'
// $scope.weather.current.temp = 1; // $scope.weather.current.temp = 1;
navigator.geolocation.getCurrentPosition((position) => { navigator.geolocation.getCurrentPosition((position) => {
$scope.loaddata(position.coords.latitude, position.coords.longitude) $scope.loaddata(position.coords.latitude, position.coords.longitude)
@ -64,6 +65,7 @@
$scope.loaddata = function(lat, lon) { $scope.loaddata = function(lat, lon) {
$http.get("https://api.openweathermap.org/data/2.5/onecall?lat=" + lat + "&lon=" + lon + "&units=metric&appid=5292f0a17ecbe4b523fe0609ed2c556f").then(function (response) { $http.get("https://api.openweathermap.org/data/2.5/onecall?lat=" + lat + "&lon=" + lon + "&units=metric&appid=5292f0a17ecbe4b523fe0609ed2c556f").then(function (response) {
$scope.weather = response.data; $scope.weather = response.data;
$scope.loading = ''
$scope.lat = lat; $scope.lat = lat;
$scope.lon = lon; $scope.lon = lon;
}) })