added option to enable cloud layer

Author: rossengeorgiev

cache.manifest

@@ -1,9 +1,9 @@
 CACHE MANIFEST
-# version 283
+# version 285
 
 # gogole maps files
-http://maps.google.com/maps/api/js?v=3.10&sensor=false&language=en_us&key=AIzaSyCOqkcNey4CCyG4X0X5qxHAhCgD8g5DwXg
-http://maps.gstatic.com/intl/en_us/mapfiles/api-3/15/18/main.js
+http://maps.google.com/maps/api/js?v=3.10&sensor=false&libraries=weather&language=en_us&key=AIzaSyCOqkcNey4CCyG4X0X5qxHAhCgD8g5DwXg
+http://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/15/18/%7Bmain,weather%7D.js
 http://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/15/18/%7Bcommon,map,util,geometry,poly,overlay%7D.js
 http://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/15/18/%7Bmarker%7D.js
 http://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/15/18/%7Bonion%7D.js

index.html

@@ -98,6 +98,13 @@ <h2><i class="icon-settings rfloat"></i>Settings</h2>
                     <input type="checkbox" id="opt_daylight">
                 </div>
             </div>
+            <div class="row option">
+                <span><b>Cloud layer</b></span>
+                <div class="switch off" id="sw_layers_clouds">
+                    <span class="thumb hourswitch"></span>
+                    <input type="checkbox" id="opt_layers_clouds">
+                </div>
+            </div>
             <div class="row option">
                 <span><b>Imperial units</b></span>
                 <div class="switch off" id="sw_imperial">
@@ -214,7 +221,7 @@ <h2>Chase car mode</h2>
             </div>
         </div>
     </div>
-    <script src="http://maps.google.com/maps/api/js?v=3.10&sensor=false&language=en_us&key=AIzaSyCOqkcNey4CCyG4X0X5qxHAhCgD8g5DwXg" type="text/javascript"></script>
+    <script src="http://maps.google.com/maps/api/js?v=3.10&sensor=false&libraries=weather&language=en_us&key=AIzaSyCOqkcNey4CCyG4X0X5qxHAhCgD8g5DwXg" type="text/javascript"></script>
     <script type="text/javascript" language="javascript" src="js/mobile.js"></script>
 <!--
     <script type="text/javascript" language="javascript" src="js/jquery-1.8.3-min.js"></script>

js/app.js

@@ -479,7 +479,7 @@ $(window).ready(function() {
     if(offline.get('opt_daylight')) $('#sw_daylight').removeClass('off').addClass('on');
 
     // offline and mobile
-    $('#sw_offline, #sw_station, #sw_imperial, #sw_haxis_hours, #sw_daylight, #sw_hide_receivers').click(function() {
+    $('#sw_layers_clouds, #sw_offline, #sw_station, #sw_imperial, #sw_haxis_hours, #sw_daylight, #sw_hide_receivers').click(function() {
         var e = $(this);
         var name = e.attr('id').replace('sw', 'opt');
         var on;
@@ -519,7 +519,10 @@ $(window).ready(function() {
                 else {
                     refreshReceivers();
                 }
-
+                break;
+            case "opt_layers_clouds":
+                if(on) { layers_clouds.setMap(map); }
+                else { layers_clouds.setMap(null); }
         }
     });
 
@@ -529,6 +532,7 @@ $(window).ready(function() {
     if(offline.get('opt_imperial')) $('#sw_imperial').removeClass('off').addClass('on');
     if(offline.get('opt_haxis_hours')) $('#sw_haxis_hours').removeClass('off').addClass('on');
     if(offline.get('opt_hide_receivers')) $('#sw_hide_receivers').removeClass('off').addClass('on');
+    if(offline.get('opt_layers_clouds')) $('#sw_layers_clouds').removeClass('off').addClass('on');
 
     // force re-cache
     $('#sw_cache').click(function() {

js/tracker.js

@@ -26,6 +26,7 @@ var balloon_colors = ["#f00", "blue", "green", "#ff0", "#c700e6", "#ff8a0f", "#0
 
 var map = null;
 var overlay = null;
+var layer_clouds = null;
 
 var notamOverlay = null;
 
@@ -79,6 +80,11 @@ function load() {
 
     if(currentPosition) updateCurrentPosition(currentPosition.lat, currentPosition.lon);
 
+    // initialize clouds layer
+    layers_clouds = new google.maps.weather.CloudLayer();
+    if(offline.get('opt_layers_clouds')) layers_clouds.setMap(map);
+
+    // initalize nite overlay
     nite.init(map);
     if(!offline.get('opt_daylight')) nite.hide();
     setInterval(function() { nite.refresh(); }, 60000); // 1min