Starting to fix slider behavior

1 files changed, 57 insertions, 32 deletions

diff --git a/gmap_arcgis.js b/gmap_arcgis.js
index caf5c8c..21f6e20 100644
--- a/gmap_arcgis.js
+++ b/gmap_arcgis.js
@@ -6,7 +6,12 @@ function gmapArcgis(config) {
 
     map:            config.map,
 
-    deforestation:  [],
+    slider:  [],
+
+    // Set the current map
+    setMap: function(map) {
+      this.map = map;
+    },
 
     // Add polygons from a given ArcGIS MapServer Layer
     showPolygon: function(element) {
@@ -38,7 +43,7 @@ function gmapArcgis(config) {
         });
       }
       else {
-        google.maps.event.addListener(params.overlay.getMapService(), 'update', function() {
+        google.maps.event.addListener(this.config['layers'][element].overlay.getMapService(), 'update', function() {
           this.config['layers'][element].callback(this.map, this.config['layers'][element]) ; this.unblockUI();
         });
       }
@@ -79,6 +84,8 @@ function gmapArcgis(config) {
     
       // TODO: support for clickable polygons
       this.showPolygon(element);
+
+      return this.config['layers'][element].overlay;
     },
     
     // Add makers to the map
@@ -161,11 +168,13 @@ function gmapArcgis(config) {
       jQuery.blockUI();
     },
 
+    // Toggle KML visibility
     toggleKML: function(params) {
       // TODO
       return;
     },
     
+    // Toggle layer visibility
     toggleLayers: function(element) {
       this.config['layers'][element].overlay.setOpacity(0);
     },
@@ -183,6 +192,7 @@ function gmapArcgis(config) {
       }
     },
 
+    // Block the UI and show an overlay
     showOverlay: function(t) {
       if ($.browser.msie === false) {
         message = this.config.overlayMessage;
@@ -210,42 +220,60 @@ function gmapArcgis(config) {
       }
     },
     
-    // Display deforestation
-    deforestationUpdate: function(layer) {
-      var defaultOpacity = 0.45;
-    
-      if (this.deforestation[layer] == undefined) {
-        this.deforestation[layer] = this.addLayers({
-          uri:         URL_ARCGIS_DESMATAMENTO,
-          opacity:     defaultOpacity,
-          layers:      [layer],
-          overlayTime: 3000,
-          callback:    updateDeforestationOpacity,
-        });
+    // Display slider
+    sliderUpdate: function(layer) {
+      this.sliderOpacity = 0.45;
+
+      if (this.slider[layer] == undefined) {
+        this.config['layers']['slider'].layers   = [layer];
+        this.config['layers']['slider'].opacity  = this.sliderOpacity;
+        this.config['layers']['slider'].callback = this.sliderUpdateOpacity;
+
+        this.slider[layer] = this.addLayers('slider');
       }
       else {
-        updateDeforestationOpacity(map, { layers: [layer] });
+        this.sliderUpdateOpacity(layer);
       }
-    
-      function updateDeforestationOpacity(map, params) {
-        for (var i in this.deforestation) {
-          if (params.layers[0] == i) {
-            this.deforestation[i].setOpacity(0.45);
-          }
-          else {
-            this.deforestation[i].setOpacity(0);
-          }
+
+    },
+
+    // Fix slider opacity
+    sliderUpdateOpacity: function(layer) {
+      for (var i in this.slider) {
+        if (i == layer) {
+          this.slider[i].setOpacity(0.45);
+        }
+        else {
+          this.slider[i].setOpacity(0);
         }
-    
-        // The second and all subsequent layers shall be intialized without opacity.
-        defaultOpacity = 0;
       }
     
+      // The second and all subsequent layers shall be intialized without opacity.
+      this.sliderOpacity = 0;
     },
 
+    // See http://alistapart.com/article/getoutbindingsituations
+    //createBoundedWrapper: function(object, method) {
+    //  return function() {
+    //    return method.apply(object, arguments);
+    //  };
+    //},
+
     // Setup slider
     activateSlider: function() {
       var self = this;
+      //var sliderUpdate = jQuery.proxy(this.sliderUpdate, this);
+      //var sliderUpdate = this.sliderUpdate.bind(this);
+      //var sliderUpdate = function(event, ui) {
+      //  self.sliderUpdate(ui.value);
+      //}
+      //var sliderUpdate = function(event, ui) {
+      //  return function() {
+      //    return self.sliderUpdate.call(self, ui.value);
+      //  }
+      //}
+      //var sliderUpdate = self.createBoundedWrapper(self, self.sliderUpdate); 
+
       // Max is the number of layers in the service
       $("#slider").slider({
           value: 1,
@@ -253,15 +281,12 @@ function gmapArcgis(config) {
           max:  11,
           step:  1,
           animate: true,
+          //change: sliderUpdate,
           change: function(event, ui) {
-            self.deforestationUpdate.bind(self, ui.value);
+            self.sliderUpdate.call(self, ui.value);
           },
       });
     },
 
-    setMap: function(map) {
-      this.map = map;
-    },
-
   }
 };