summaryrefslogtreecommitdiff
path: root/misc/openlayers/examples/mobile-jq.js
diff options
context:
space:
mode:
authorChris Schlaeger <chris@linux.com>2014-08-12 21:56:44 +0200
committerChris Schlaeger <chris@linux.com>2014-08-12 21:56:44 +0200
commitea346a785dc1b3f7c156f6fc33da634e1f1a627b (patch)
treeaf67530553d20b6e82ad60fd79593e9c4abf5565 /misc/openlayers/examples/mobile-jq.js
parent59741cd535c47f25971bf8c32b25da25ceadc6d5 (diff)
downloadpostrunner-ea346a785dc1b3f7c156f6fc33da634e1f1a627b.zip
Adding jquery, flot and openlayers to be included with the GEM.v0.0.4
Diffstat (limited to 'misc/openlayers/examples/mobile-jq.js')
-rw-r--r--misc/openlayers/examples/mobile-jq.js159
1 files changed, 159 insertions, 0 deletions
diff --git a/misc/openlayers/examples/mobile-jq.js b/misc/openlayers/examples/mobile-jq.js
new file mode 100644
index 0000000..7e487cd
--- /dev/null
+++ b/misc/openlayers/examples/mobile-jq.js
@@ -0,0 +1,159 @@
+// Start with the map page
+window.location.replace(window.location.href.split("#")[0] + "#mappage");
+
+var selectedFeature = null;
+
+// 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() + 1);
+ content.height(contentHeight);
+ }
+
+ if (window.map && window.map instanceof OpenLayers.Map) {
+ map.updateSize();
+ } else {
+ // initialize map
+ init(function(feature) {
+ selectedFeature = feature;
+ $.mobile.changePage("#popup", "pop");
+ });
+ initLayerList();
+ }
+}
+
+// one-time initialisation of button handlers
+
+$("#plus").live('click', function(){
+ map.zoomIn();
+});
+
+$("#minus").live('click', function(){
+ map.zoomOut();
+});
+
+$("#locate").live('click',function(){
+ var control = map.getControlsBy("id", "locate-control")[0];
+ if (control.active) {
+ control.getCurrentLocation();
+ } else {
+ control.activate();
+ }
+});
+
+//fix the content height AFTER jQuery Mobile has rendered the map page
+$('#mappage').live('pageshow',function (){
+ fixContentHeight();
+});
+
+$(window).bind("orientationchange resize pageshow", fixContentHeight);
+
+
+
+$('#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();
+ if ($('#query')[0].value === '') {
+ return;
+ }
+ $.mobile.showPageLoadingMsg();
+
+ // Prevent form send
+ e.preventDefault();
+
+ var searchUrl = 'http://ws.geonames.org/searchJSON?featureClass=P&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.hidePageLoadingMsg();
+ });
+ });
+ // only listen to the first event triggered
+ $('#searchpage').die('pageshow', arguments.callee);
+});
+
+
+function initLayerList() {
+ $('#layerspage').page();
+ $('<li>', {
+ "data-role": "list-divider",
+ text: "Base Layers"
+ })
+ .appendTo('#layerslist');
+ var baseLayers = map.getLayersBy("isBaseLayer", true);
+ $.each(baseLayers, function() {
+ addLayerToList(this);
+ });
+
+ $('<li>', {
+ "data-role": "list-divider",
+ text: "Overlay Layers"
+ })
+ .appendTo('#layerslist');
+ var overlayLayers = map.getLayersBy("isBaseLayer", false);
+ $.each(overlayLayers, function() {
+ addLayerToList(this);
+ });
+ $('#layerslist').listview('refresh');
+
+ map.events.register("addlayer", this, function(e) {
+ addLayerToList(e.layer);
+ });
+}
+
+function addLayerToList(layer) {
+ var item = $('<li>', {
+ "data-icon": "check",
+ "class": layer.visibility ? "checked" : ""
+ })
+ .append($('<a />', {
+ text: layer.name
+ })
+ .click(function() {
+ $.mobile.changePage('#mappage');
+ if (layer.isBaseLayer) {
+ layer.map.setBaseLayer(layer);
+ } else {
+ layer.setVisibility(!layer.getVisibility());
+ }
+ })
+ )
+ .appendTo('#layerslist');
+ layer.events.on({
+ 'visibilitychanged': function() {
+ $(item).toggleClass('checked');
+ }
+ });
+}