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

[commits-20090109 at openlayers.org]

Author: igorti
Date: 2011-02-24 06:28:23 -0800 (Thu, 24 Feb 2011)
New Revision: 11419

Modified:
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
   sandbox/camptocamp/mobile/openlayers/examples/mobile.js
Log:
Added vector layer and SelectFeature cntrol

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-24 14:13:35 UTC (rev 11418)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-24 14:28:23 UTC (rev 11419)
@@ -54,6 +54,7 @@
           </div>
           <ul data-role="listview" data-inset="true" id="search_results"></ul> 
         </div>
+
         <div data-role="page" id="layerspage">
           <div data-role="header">
             <h1>Layers</h1>
@@ -62,5 +63,15 @@
             <ul data-role="listview" data-inset="true" data-theme="d" data-dividertheme="c" id="layerslist"> 
           </div>
         </div>
+
+		<div id="popup" data-role="dialog">
+			<div data-position="inline" data-theme="d" data-role="header">
+				<h1>Details</h1>
+			</div>
+			<div data-theme="c" data-role="content">
+				<ul id="details-list" data-role="listview">
+				</ul>
+			</div>
+		</div>
     </body>
 </html>

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	2011-02-24 14:13:35 UTC (rev 11418)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	2011-02-24 14:28:23 UTC (rev 11419)
@@ -1,3 +1,5 @@
+var selectedFeature = null;
+
 $(document).ready(function() {
     // Start with the map page
     if (window.location.hash && window.location.hash!='#mappage') {
@@ -23,7 +25,7 @@
         }
     }
     $(window).bind("orientationchange resize pageshow", fixContentHeight);
-    fixContentHeight();
+    fixContentHeight(); 
 
     // Map zoom  
     $("#plus").click(function(){
@@ -40,6 +42,31 @@
             control.activate();
         }
     });
+
+	var sprinters = getFeatures();
+	
+	var sprintersLayer = new OpenLayers.Layer.Vector("Sprinters");
+	sprintersLayer.addFeatures(sprinters);
+	
+	map.addLayer(sprintersLayer);
+	
+	var selectControl = new OpenLayers.Control.SelectFeature(sprintersLayer, {onSelect: function(feature){
+		selectedFeature = feature;
+		$.mobile.changePage($("#popup"), "pop");
+	}});
+	
+	map.addControl(selectControl);
+	selectControl.activate();
+	
+	$('div#popup').live('pageshow',function(event, ui){
+	  	var li = "";
+		for(var attr in selectedFeature.attributes){
+			li += "<li><div style='width:25%;float:left'>" + attr + "</div><div style='width:75%;float:right'>" 
+			+ selectedFeature.attributes[attr] + "</div></li>";
+		}
+		$("ul#details-list").empty().append(li).listview("refresh");
+	});
+
     $('#searchpage').live('pageshow',function(event, ui){
         $('#query').bind('change', function(e){
             $('#search_results').empty();
@@ -131,3 +158,27 @@
         }
     });
 }
+
+function getFeatures(){
+	var features = {
+      "type": "FeatureCollection", 
+      "features": [
+        	{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [1332700, 7906300]}, 
+			"properties": {"Name": "Igor Tihonov", "Country":"Sweden", "City":"Gothenburg"}},
+			{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [790300, 6573900]}, 
+			"properties": {"Name": "Marc Jansen", "Country":"Germany", "City":"Bonn"}},
+			{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [568600, 6817300]}, 
+			"properties": {"Name": "Bart van den Eijnden", "Country":"Netherlands", "City":"Utrecht"}},
+			{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [-7909900, 5215100]}, 
+			"properties": {"Name": "Christopher Schmidt", "Country":"United Stated", "City":"Boston"}},
+			{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [-937400, 5093200]}, 
+			"properties": {"Name": "Jorge Gustavo Rocha", "Country":"Portugal", "City":"Braga"}},
+			{ "type": "Feature", "geometry": {"type": "Point", "coordinates": [-355300, 7547800]}, 
+			"properties": {"Name": "Jennie Fletcher ", "Country":"Scotland", "City":"Edinburgh"}}
+       ]
+   	};
+
+	var reader = new OpenLayers.Format.GeoJSON();
+	
+	return reader.read(features);
+}

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile.js
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile.js	2011-02-24 14:13:35 UTC (rev 11418)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile.js	2011-02-24 14:28:23 UTC (rev 11419)
@@ -61,8 +61,8 @@
             new OpenLayers.Layer.Google(
                 "Google Satellite",
                 {type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
-            ),
-            vector
+            )/*,
+            vector*/
         ],
         center: new OpenLayers.LonLat(0, 0),
         zoom: 1