From 1751584f65ff94776011614eabb04f05cbc7d168 Mon Sep 17 00:00:00 2001 From: rolux Date: Sat, 24 Jul 2010 21:27:39 +0200 Subject: [PATCH] more maps --- build/js/ox.ui.js | 145 +++++++++++++++++++++++++++++++++------------- 1 file changed, 104 insertions(+), 41 deletions(-) diff --git a/build/js/ox.ui.js b/build/js/ox.ui.js index 9f6da7d..e1d605c 100644 --- a/build/js/ox.ui.js +++ b/build/js/ox.ui.js @@ -2119,7 +2119,7 @@ requires .change(change) .appendTo(that); - self.options.placeholder && that.$input.val(self.option); + self.options.placeholder && that.$input.val(self.option.title); if (self.options.clear) { that.$clear = new Ox.Button({ @@ -2244,7 +2244,7 @@ requires valid: self.valid }); if (self.options.placeholder && that.$input.val() === "") { - that.$input.addClass("OxPlaceholder").val(self.option); + that.$input.addClass("OxPlaceholder").val(self.option.title); } if (self.options.autocomplete || self.options.autocorrect || self.options.validate) { // fixme: duplicated, make a var $document.unbind("keydown", keypress); @@ -2270,7 +2270,7 @@ requires autocompleteCall(); } else { if (that.$input.is(".OxPlaceholder")) { - that.$input.val(self.option); + that.$input.val(self.option.title); //that.$input.focus(); } else { that.$input.focus(); @@ -2424,9 +2424,9 @@ requires that.width = function(value) { that.$element.width(value); that.$input.width(value - (self.options.type == "textarea" ? 0 : 2) - - (self.options.label ? self.options.labelWidth + 18 : 0) - - (self.options.placeholder.length > 1 ? 26 : 0) - - (self.options.clear ? 31 : 0)); + (self.options.label ? self.options.labelWidth + 25 : 0) - + (self.options.placeholder.length > 1 ? 16 : 0) - + (self.options.clear ? 25 : 0)); // fixme: the values above are all weird guesswork return that; } @@ -3936,6 +3936,59 @@ requires init(); + function canContain(outerBounds, innerBounds) { + var outerSpan = outerBounds.toSpan(), + innerSpan = innerBounds.toSpan(); + return outerSpan.lat() > innerSpan.lat() && + outerSpan.lng() > innerSpan.lng(); + } + + function click(event) { + Ox.print("event", event); + getLocationByLatLng(event.latLng, self.map.getBounds(), function(location) { + self.marker && self.marker.remove(); + self.polygon && self.polygon.remove(); + if (location) { + self.marker = location.marker.add(); + self.polygon = location.polygon.add(); + } + }) + } + + function getLocationByLatLng(latlng, bounds, callback) { + Ox.print("ll b", latlng, bounds) + var callback = arguments.length == 3 ? callback : bounds, + bounds = arguments.length == 3 ? bounds : null; + self.geocoder.geocode({ + latLng: latlng + }, function(results, status) { + Ox.print("results", results) + var length = results.length; + if (status == google.maps.GeocoderStatus.OK) { + if (status != google.maps.GeocoderStatus.ZERO_RESULTS) { + if (bounds) { + $.each(results.reverse(), function(i, result) { + if ( + i == length - 1 || + canContain(bounds, result.geometry.bounds || result.geometry.viewport) + ) { + callback(new Location(results[i])); + return false; + } + }); + } else { + callback(new Location(results[0])); + } + } else { + callback(null); + } + } else { + Ox.print("geocode failed:", status); + callback(null); + } + }); + } + function getLocationByName(name, callback) { self.geocoder.geocode({ address: name @@ -3953,33 +4006,13 @@ requires }); } - function getLocationByPoint(point, area, callback) { - var callback = arguments.length == 2 ? area : callback, - area = arguments.length == 2 ? null : area, - options = $.extend({ - "latLng": new google.maps.LatLng(point[0], point[1]) - }, area ? { - "bounds": new google.maps.LatLngBounds( - new google.maps.LatLng(area[0][0], area[0][1]), - new google.maps.LatLng(area[1][0], area[1][1]) - ) - } : {}); - self.geocoder.geocode(options, function(results, status) { - var length = results.length; - if (status == google.maps.GeocoderStatus.OK) { - if (status != google.maps.GeocoderStatus.ZERO_RESULTS) { - - } - } - }); - } - function init() { var counter = 0, length = self.options.places.length; $.extend(self, { geocoder: new google.maps.Geocoder(), - locations: [] + locations: [], + selectedMarker: null }); $.each(self.options.places, function(i, place) { if (Ox.isString(place)) { @@ -4020,12 +4053,17 @@ requires }) }); self.map.fitBounds(self.bounds) + google.maps.event.addListener(self.map, "click", click); google.maps.event.addListener(self.map, "zoom_changed", zoom); $.each(self.locations, function(i, location) { location.marker.add(); }); }; + function resize() { + google.maps.event.trigger(self.map, "resize"); + } + function zoom() { } @@ -4057,15 +4095,21 @@ requires function Marker(location) { var listeners = {}, marker = new google.maps.Marker({ - icon: icon("blue"), + icon: icon("red"), position: location.rectangle.center, title: location.name.formatted - }); + }), + selected = false; function click() { + selected = !selected; marker.setOptions({ - icon: icon("red") + icon: icon(selected ? "blue" : "red") }); - location.polygon.add(); + location.polygon[selected ? "add" : "remove"](); + } + function dblclick() { + click(); + self.map.fitBounds(location.rectangle.bounds); } function icon(color) { return "http://dev.pan.do:8000" + oxui.path + "png/ox.ui/marker" + Ox.toTitleCase(color) + ".png" @@ -4073,11 +4117,24 @@ requires return { add: function() { marker.setMap(self.map); - listeners.click = google.maps.event.addListener(marker, "click", click); + listeners = { + click: google.maps.event.addListener(marker, "click", click), + dblclick: google.maps.event.addListener(marker, "dblclick", dblclick), + }; + return this; + }, + deselect: function() { + }, remove: function() { marker.setMap(null); - google.maps.event.removeListener(listeners.click); + $.each(listeners, function(i, listener) { + google.maps.event.removeListener(listener); + }); + return this; + }, + select: function() { + } }; } @@ -4095,13 +4152,17 @@ requires paths: points }), selected = false; + setOptions(); + function click() { + selected = !selected; + setOptions(); + } function setOptions() { var color = selected ? "#8080FF" : "#FFFFFF"; polygon.setOptions({ clickable: true, fillColor: color, fillOpacity: selected ? 0.1 : 0, - geodesic: true, strokeColor: color, strokeOpacity: 1, strokeWeight: 2 @@ -4110,7 +4171,8 @@ requires return { add: function() { polygon.setMap(self.map); - listeners.click = google.maps.event.addListener(polygon, "click", this.select); + listeners.click = google.maps.event.addListener(polygon, "click", click); + return this; }, deselect: function() { selected = false; @@ -4119,6 +4181,7 @@ requires remove: function() { polygon.setMap(null); google.maps.event.removeListener(listeners.click); + return this; }, select: function() { selected = true; @@ -4142,11 +4205,11 @@ requires }); $.extend(latlng, { sc: new google.maps.LatLng(lat.sw, lng.mc), - se: new google.maps.LatLng(lat.sw, lng.mc), - mw: new google.maps.LatLng(lat.sw, lng.mc), - mw: new google.maps.LatLng(lat.sw, lng.mc), - nw: new google.maps.LatLng(lat.sw, lng.mc), - nc: new google.maps.LatLng(lat.sw, lng.mc), + se: new google.maps.LatLng(lat.sw, lng.ne), + mw: new google.maps.LatLng(lat.mc, lng.sw), + mw: new google.maps.LatLng(lat.mc, lng.ne), + nw: new google.maps.LatLng(lat.ne, lng.sw), + nc: new google.maps.LatLng(lat.ne, lng.mc), }); return { area: area,