Fixing different things in the mobile aware examples:

- css styling for the zoom panel control,
 - creating a new mobile-base.js file shared by sencha and jq examples,
 - (re-)simplyfing mobile.js


git-svn-id: http://svn.openlayers.org/trunk/openlayers@11496 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

examples/mobile-base.js

@@ -0,0 +1,108 @@
+// API key for http://openlayers.org. Please get your own at
+// http://bingmapsportal.com/ and use that instead.
+var apiKey = "AqTGBsziZHIJYYxgivLBf0hVdrAk9mWO5cQcb8Yux8sW5M8c8opEC2lZqKR1ZZXf";
+
+// initialize map when page ready
+var map;
+var gg = new OpenLayers.Projection("EPSG:4326");
+var sm = new OpenLayers.Projection("EPSG:900913");
+
+var init = function () {
+
+    var vector = new OpenLayers.Layer.Vector("Vector Layer", {});
+
+    var geolocate = new OpenLayers.Control.Geolocate({
+        id: 'locate-control',
+        geolocationOptions: {
+            enableHighAccuracy: false,
+            maximumAge: 0,
+            timeout: 7000
+        }
+    });
+    // create map
+    map = new OpenLayers.Map({
+        div: "map",
+        theme: null,
+        projection: sm,
+        units: "m",
+        numZoomLevels: 18,
+        maxResolution: 156543.0339,
+        maxExtent: new OpenLayers.Bounds(
+            -20037508.34, -20037508.34, 20037508.34, 20037508.34
+        ),
+        controls: [
+            new OpenLayers.Control.Attribution(),
+            new OpenLayers.Control.TouchNavigation({
+                dragPanOptions: {
+                    interval: 0, // non-zero kills performance on some mobile phones
+                    enableKinetic: true
+                }
+            }),
+            geolocate
+        ],
+        layers: [
+            new OpenLayers.Layer.OSM("OpenStreetMap", null, {
+                transitionEffect: 'resize'
+            }),
+            new OpenLayers.Layer.Bing({
+                key: apiKey,
+                type: "Road",
+                // custom metadata parameter to request the new map style - only useful
+                // before May 1st, 2011
+                metadataParams: {
+                    mapVersion: "v1"
+                },
+                name: "Bing Road",
+                transitionEffect: 'resize'
+            }),
+            new OpenLayers.Layer.Bing({
+                key: apiKey,
+                type: "Aerial",
+                name: "Bing Aerial",
+                transitionEffect: 'resize'
+            }),
+            new OpenLayers.Layer.Bing({
+                key: apiKey,
+                type: "AerialWithLabels",
+                name: "Bing Aerial + Labels",
+                transitionEffect: 'resize'
+            }), 
+            vector
+        ]
+    });
+    map.zoomToMaxExtent();
+
+    var style = {
+        fillOpacity: 0.1,
+        fillColor: '#000',
+        strokeColor: '#f00',
+        strokeOpacity: 0.6
+    };
+    geolocate.events.register("locationupdated",this,function(e) {
+        vector.removeAllFeatures();
+        vector.addFeatures([
+            new OpenLayers.Feature.Vector(
+                e.point,
+                {},
+                {
+                    graphicName: 'cross',
+                    strokeColor: '#f00',
+                    strokeWidth: 2,
+                    fillOpacity: 0,
+                    pointRadius: 10
+                }
+            ),
+            new OpenLayers.Feature.Vector(
+                OpenLayers.Geometry.Polygon.createRegularPolygon(
+                    new OpenLayers.Geometry.Point(e.point.x, e.point.y),
+                    e.position.coords.accuracy/2,
+                    50,
+                    0
+                ),
+                {},
+                style
+            )
+        ]);
+        map.zoomToExtent(vector.getDataExtent());
+    });
+};