Add mobile-drawing example, Close: #3143, r=crschmidt

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11651 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2011-03-07 12:49:51 +00:00
parent 77a214764c
commit 7865f4d1f3
2 changed files with 82 additions and 0 deletions
--- a/examples/mobile-drawing.html
+++ b/examples/mobile-drawing.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>OpenLayers Mobile Drawing</title>
+        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0;">
+        <meta name="apple-mobile-web-app-capable" content="yes">
+        <link rel="stylesheet" href="style.mobile.css" type="text/css">
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
+        <script src="../lib/OpenLayers.js"></script>
+        <script src="mobile-drawing.js"></script>
+        <script src="http://192.168.1.122:8124/debug.js?ns=OpenLayers.Console"></script>
+        <script>
+            OpenLayers.Console.log("mobile-drawing");
+        </script>
+        <style>
+            html, body {
+                margin: 0;
+                padding: 0;
+                height: 100%;
+            }
+            #map {
+                position: relative;
+                width: 100%;
+                height: 100%;
+            }
+            .olControlAttribution {
+                font-size: 10px;
+                bottom: 5px;
+                right: 5px;
+            }
+            #title, #tags, #shortdesc {
+                display: none;
+            }
+        </style>
+    </head>
+    <body>
+        <h1 id="title">Mobile Drawing Example</h1>
+        <div id="tags">
+            mobile, drawing
+        </div>
+        <p id="shortdesc">
+            A full-screen map with drawing tools for mobile devices.
+        </p>
+        <div id="map"></div>
+        <script>
+            init();
+        </script>
+    </body>
+</html>
--- a/examples/mobile-drawing.js
+++ b/examples/mobile-drawing.js
@@ -0,0 +1,33 @@
+
+function init() {
+
+    var vector = new OpenLayers.Layer.Vector();
+    var toolbar = new OpenLayers.Control.EditingToolbar(vector);
+
+    map = new OpenLayers.Map({
+        div: 'map',
+        projection: 'EPSG:900913',
+        units: 'm',
+        numZoomLevels: 18,
+        maxResolution: 156543.0339,
+        maxExtent: new OpenLayers.Bounds(
+            -20037508.34, -20037508.34, 20037508.34, 20037508.34
+        ),
+        controls: [
+            new OpenLayers.Control.TouchNavigation({
+                dragPanOptions: {
+                    interval: 100
+                }
+            }),
+            new OpenLayers.Control.ZoomPanel(),
+            toolbar
+        ],
+        layers: [new OpenLayers.Layer.OSM(), vector],
+        center: new OpenLayers.LonLat(0, 0),
+        zoom: 1,
+        theme: null
+    });
+
+    toolbar.controls[0].activate();
+
+};