wheather init

src/app/pages/dashboard/dashboard.html

@@ -47,3 +47,11 @@
     </blur-panel>
   </div>
 </div>
+
+<div class="row">
+  <div class="col-lg-3 col-sm-6 col-xs-12">
+    <blur-panel title="Weather" class-container="medium-panel with-scroll">
+      <blur-weather></blur-weather>
+    </blur-panel>
+  </div>
+</div>

src/app/pages/dashboard/widgets/weather/_weather.scss

@@ -0,0 +1,28 @@
+.rightHeading{
+  display:block;
+  float:right;
+}
+
+.center{
+  text-align: center;
+}
+
+.weather-info{
+  padding-left: 15px;
+}
+
+.font50up{
+    font-size: 1.5em;
+}
+
+.font-x2{
+    font-size: 2em;
+}
+
+.font-x3{
+  font-size: 3em;
+}
+
+.font-x4{
+  font-size: 4em;
+}

src/app/pages/dashboard/widgets/weather/weather.html

@@ -0,0 +1,14 @@
+<h5 class="font50up">
+    {{geoData.geoplugin_countryName | uppercase}} - {{geoData.geoplugin_city}} <span class="rightHeading">{{ date | date : 'EEEE h:mm'}}</span>
+</h5>
+<table class="font50up">
+    <tr>
+        <td><i class="font-x3 {{weatherIcons[weatherData.weather[0].icon]}}"></i></td>
+        <td><span class="weather-info">{{weatherData.weather[0].main}} - {{weatherData.weather[0].description}}</span></td>
+    </tr>
+    <tr>
+        <td class="center"><i class="font-x2 ion-thermometer"></i></td>
+        <td><span class="weather-info">{{weatherData.main.temp}} °C | <a href>°F</a></span></td>
+    </tr>
+</table>
+

src/app/pages/dashboard/widgets/weather/weather.js

@@ -0,0 +1,65 @@
+'use strict';
+
+blurAdminApp.directive('blurWeather', function () {
+    return {
+        restrict: 'EA',
+        controller: ['$scope', '$http', '$timeout', function ($scope, $http, $timeout) {
+            $scope.url = 'http://api.openweathermap.org/data/2.5/weather';
+            $scope.method = 'GET';
+            $scope.key = '2de143494c0b295cca9337e1e96b00e0';
+            $scope.units = 'metric';
+            $scope.date = new Date();
+            $scope.weatherIcons = {
+                '01d' : 'ion-ios-sunny-outline',
+                '02d' : 'ion-ios-partlysunny-outline',
+                '03d' : 'ion-ios-cloud-outline',
+                '04d' : 'ion-ios-cloud',
+                '09d' : 'ion-ios-rainy',
+                '10d' : 'ion-ios-rainy-outline',
+                '11d' : 'ion-ios-thunderstorm-outline',
+                '13d' : 'ion-ios-snowy',
+                '50d' : 'ion-ios-cloudy-outline',
+                '01n' : 'ion-ios-cloudy-night-outline',
+                '02n' : 'ion-ios-cloudy-night',
+                '03n' : 'ion-ios-cloud-outline',
+                '04n' : 'ion-ios-cloud',
+                '09n' : 'ion-ios-rainy',
+                '10n' : 'ion-ios-rainy-outline',
+                '11n' : 'ion-ios-thunderstorm',
+                '13n' : 'ion-ios-snowy',
+                '50n' : 'ion-ios-cloudy-outline'
+            };
+            $scope.updateWeather = function () {
+                $http({
+                    method: $scope.method, url: $scope.url, params: {
+                        appid: $scope.key,
+                        lat: $scope.geoData.geoplugin_latitude,
+                        lon: $scope.geoData.geoplugin_longitude,
+                        units : $scope.units
+                    }
+                }).then(function success(response) {
+                    $scope.weatherData = response.data;
+                    console.log(response.data);
+                }, function error(response) {
+                    console.log("WEATHER FAILED")
+                });
+            };
+
+            $scope.updateGeoData = function () {
+                $http.jsonp('http://www.geoplugin.net/json.gp?jsoncallback=JSON_CALLBACK').then(function success(response) {
+                    $scope.geoData = response.data;
+                    console.log(response.data);
+                    $scope.updateWeather();
+                }, function error() {
+                    console.log("GEO FAILED")
+                });
+            };
+
+            $timeout(function () {
+                $scope.updateGeoData();
+            }, 100);
+
+        }],
+        templateUrl: 'app/pages/dashboard/widgets/weather/weather.html'
+    };
+});

src/assets/css/main.scss

@@ -31,6 +31,7 @@
 "../../app/pages/dashboard/widgets/trafficChart/trafficChart.scss",
 "../../app/pages/dashboard/widgets/popularApp/popularApp.scss",
 "../../app/pages/dashboard/widgets/blurFeed/blurFeed.scss",
+"../../app/pages/dashboard/widgets/weather/weather.scss",
 "../../app/pages/maps/widgets/leaflet/leaflet.scss",
 "../../app/pages/maps/widgets/google-maps/google-maps.scss",
 "../../app/pages/maps/widgets/map-bubbles/map-bubbles.scss",