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

[commits-20090109 at openlayers.org]

Author: pgiraud
Date: 2011-02-23 05:22:05 -0800 (Wed, 23 Feb 2011)
New Revision: 11313

Added:
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
Modified:
   sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
Log:
Moving javascript code into a separate file

Modified: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-23 13:21:47 UTC (rev 11312)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.html	2011-02-23 13:22:05 UTC (rev 11313)
@@ -12,6 +12,7 @@
         <link rel="stylesheet" href="style.mobile.css" type="text/css">
         <script src="../build/OpenLayers.js"></script>
         <script src="mobile.js"></script>
+        <script src="mobile-jq.js"></script>
         <style>
             html {
                 height: 100%;
@@ -51,83 +52,6 @@
                 display: none;
             }
         </style>
-        <script>
-            $(document).ready(function() {
-                // Start with the map page
-                if (window.location.hash && window.location.hash!='#mappage') {
-                    $.mobile.changePage('mappage');
-                }
-
-                // fix height of content
-                function fixContentHeight() {
-                    var footer = $("div[data-role='footer']:visible"),
-                        content = $("div[data-role='content']:visible:visible"),
-                        viewHeight = $(window).height(),
-                        contentHeight = viewHeight - footer.outerHeight();
-
-                    if ((content.outerHeight() + footer.outerHeight()) !== viewHeight) {
-                        contentHeight -= (content.outerHeight() - content.height());
-                        content.height(contentHeight);
-                    }
-                    if (window.map) {
-                        map.updateSize();
-                    } else {
-                        // initialize map
-                        init();
-                    }
-                }
-                $(window).bind("orientationchange resize pageshow", fixContentHeight);
-                fixContentHeight();
-                
-                // Map zoom  
-                $("#plus").click(function(){
-                    map.zoomIn();
-                });
-                $("#minus").click(function(){
-                    map.zoomOut();
-                });
-                $("#locate").click(function(){
-                    map.getControlsBy("id", "locate-control")[0].activate();
-                });
-                $('#query').keyup(function(e){
-                    if (e.which === 13) { // enter
-                        $.mobile.pageLoading();
-
-                        // Prevent form send
-                        e.preventDefault();
-
-                        $('#search_results').empty();
-
-                        var searchUrl = 'http://ws.geonames.org/searchJSON?featureClass=P&style=full&amp;&amp;maxRows=10';
-                        searchUrl += '&name_startsWith=' + $('#query')[0].value;
-                        $.getJSON(searchUrl, function(data) {
-                            $.each(data.geonames, function() {
-                                var place = this;
-                                $('<li>')
-                                    .hide()
-                                    .append($('<h2 />', {
-                                        text: place.name
-                                    }))
-                                    .append($('<p />', {
-                                        html: '<b>' + place.countryName + '</b> ' + place.fcodeName
-                                    }))
-                                    .appendTo('#search_results')
-                                    .click(function() {
-                                        $.mobile.changePage('mappage');
-                                        var lonlat = new OpenLayers.LonLat(place.lng, place.lat);
-                                        map.setCenter(lonlat.transform(gg, sm), 10);
-                                    })
-                                    .show();
-                            });
-                            $('#search_results').listview('refresh');
-                            $.mobile.pageLoading(true);
-                        });
-                    }
-
-                });
-            });
-
-        </script>
     </head>
     <body>
         <h1 id="title">OpenLayers with jQuery Mobile</h1>
@@ -139,12 +63,6 @@
         </p>
 
         <div data-role="page" id="mappage">
-<!--             <div data-role="header"> -->
-<!--                 <input id="west" type="button" data-icon="arrow-l" value="west"> -->
-<!--                 <input id="north" type="button" data-icon="arrow-u" value="north"> -->
-<!--                 <input id="south" type="button" data-icon="arrow-d" value="south"> -->
-<!--                 <input id="east" type="button" data-icon="arrow-r" value="east"> -->
-<!--             </div> -->
             <div data-role="content">
                 <div id="map"></div>
             </div>

Added: sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js
===================================================================
--- sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	                        (rev 0)
+++ sandbox/camptocamp/mobile/openlayers/examples/mobile-jq.js	2011-02-23 13:22:05 UTC (rev 11313)
@@ -0,0 +1,74 @@
+$(document).ready(function() {
+    // Start with the map page
+    if (window.location.hash && window.location.hash!='#mappage') {
+        $.mobile.changePage('mappage');
+    }
+
+    // fix height of content
+    function fixContentHeight() {
+        var footer = $("div[data-role='footer']:visible"),
+        content = $("div[data-role='content']:visible:visible"),
+        viewHeight = $(window).height(),
+        contentHeight = viewHeight - footer.outerHeight();
+
+        if ((content.outerHeight() + footer.outerHeight()) !== viewHeight) {
+            contentHeight -= (content.outerHeight() - content.height());
+            content.height(contentHeight);
+        }
+        if (window.map) {
+            map.updateSize();
+        } else {
+            // initialize map
+            init();
+        }
+    }
+    $(window).bind("orientationchange resize pageshow", fixContentHeight);
+    fixContentHeight();
+
+    // Map zoom  
+    $("#plus").click(function(){
+        map.zoomIn();
+    });
+    $("#minus").click(function(){
+        map.zoomOut();
+    });
+    $("#locate").click(function(){
+        map.getControlsBy("id", "locate-control")[0].activate();
+    });
+    $('#query').keyup(function(e){
+        if (e.which === 13) { // enter
+        $.mobile.pageLoading();
+
+        // Prevent form send
+        e.preventDefault();
+
+        $('#search_results').empty();
+
+        var searchUrl = 'http://ws.geonames.org/searchJSON?featureClass=P&style=full&amp;&amp;maxRows=10';
+        searchUrl += '&name_startsWith=' + $('#query')[0].value;
+        $.getJSON(searchUrl, function(data) {
+            $.each(data.geonames, function() {
+                var place = this;
+                $('<li>')
+                .hide()
+                .append($('<h2 />', {
+                    text: place.name
+                    }))
+                    .append($('<p />', {
+                        html: '<b>' + place.countryName + '</b> ' + place.fcodeName
+                        }))
+                        .appendTo('#search_results')
+                        .click(function() {
+                            $.mobile.changePage('mappage');
+                            var lonlat = new OpenLayers.LonLat(place.lng, place.lat);
+                            map.setCenter(lonlat.transform(gg, sm), 10);
+                        })
+                        .show();
+                    });
+                    $('#search_results').listview('refresh');
+                    $.mobile.pageLoading(true);
+                });
+            }
+
+        });
+    });