[OpenLayers-Commits] r11394 - sandbox/camptocamp/mobile/openlayers/examples

[commits-20090109 at openlayers.org]

Author: pgiraud
Date: 2011-02-24 02:28:54 -0800 (Thu, 24 Feb 2011)
New Revision: 11394

Modified:
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
Log:
Using a listview for the layer switcher

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-24 10:28:36 UTC (rev 11393)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-24 10:28:54 UTC (rev 11394)
@@ -105,7 +105,7 @@
                 <h1>Layers</h1>
             </div>
             <div data-role="content">
-                <div data-role="controlgroup" id="layerslist"></div>
+                <ul data-role="listview" data-inset="true" id="layerslist"> 
             </div>
         </div>
     </body>

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	2011-02-24 10:28:36 UTC (rev 11393)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	2011-02-24 10:28:54 UTC (rev 11394)
@@ -80,9 +80,11 @@
         $('#searchpage').die('pageshow', arguments.callee);
     });
 
+    $('#layerslist').listview();
     $.each(map.layers, function() {
         addLayerToList(this);
     });
+    $('#layerslist').listview('refresh');
     
     map.events.register("addlayer", this, function(e) {
         addLayerToList(e.layer);
@@ -90,17 +92,17 @@
 });
 
 function addLayerToList(layer) {
-    var button = $('<a />', {
-        text: layer.name,
-        href: "",
-        "data-role": "button",
-        "data-icon": "check",
-        "class": layer.visibility ? "checked" : ""
-    })
+    var item = $('<li>', {
+            "data-icon": "check",
+            "class": layer.visibility ? "checked" : ""
+        })
+        .append($('<a />', {
+            text: layer.name
+        }))
         .appendTo('#layerslist')
         .click(function() {
             $.mobile.changePage('mappage');
-            if (layer.isBaseLayer && !layer.getVisibility()) {
+            if (layer.isBaseLayer) {
                 layer.map.setBaseLayer(layer);
             } else {
                 layer.setVisibility(!layer.visibility);
@@ -108,7 +110,7 @@
         });
     layer.events.on({
         'visibilitychanged': function() {
-            $(button).toggleClass('checked');
+            $(item).toggleClass('checked');
         }
     });
 }