X-Git-Url: https://dev.renevier.net/?a=blobdiff_plain;ds=inline;f=js%2Fsyp.js;h=40735c791cbb516ea273c0fe40a0e85d58ecb28b;hb=3c74920cb66b4e6c47c7e8a0eaeed40ffb7e8544;hp=7e69fb75ae61b6b930101cdfce0fdf535a07aabd;hpb=0feade23ffa41ac299b252a93be4da11bc2a16b7;p=syp.git diff --git a/js/syp.js b/js/syp.js index 7e69fb7..40735c7 100644 --- a/js/syp.js +++ b/js/syp.js @@ -17,11 +17,10 @@ OpenLayers.Control.SypAttribution = OpenLayers.Class (OpenLayers.Control.Attribu }); var SYP = { - Settings: { - MARKER_ICON: "openlayers/img/marker-blue.png", - MARKER_ICON_HEIGHT: 25, - MARKER_SELECT_ICON: "openlayers/img/marker-green.png", - MARKER_SELECT_ICON_HEIGHT: 25 + Markers: { + ICON: "media/marker-normal.png", + SELECT_ICON: "media/marker-selected.png", + HEIGHT: 25 }, map: null, @@ -32,10 +31,10 @@ var SYP = { init: function() { this.map = new OpenLayers.Map("map", { controls:[ + new OpenLayers.Control.SypAttribution(), new OpenLayers.Control.Navigation(), new OpenLayers.Control.PanZoom(), - new OpenLayers.Control.Permalink(), - new OpenLayers.Control.SypAttribution() + new OpenLayers.Control.Permalink() ], projection: new OpenLayers.Projection("EPSG:900913"), displayProjection: new OpenLayers.Projection("EPSG:4326") @@ -50,19 +49,7 @@ var SYP = { this.selectControl.activate(); if (!this.map.getCenter()) { - var centerBounds = new OpenLayers.Bounds(); - - var mapProj = this.map.getProjectionObject(); - var sypOrigProj = new OpenLayers.Projection("EPSG:4326"); - - var bottomLeft = new OpenLayers.LonLat(sypOrig[0],sypOrig[1]); - bottomLeft = bottomLeft.transform(sypOrigProj, mapProj); - var topRight = new OpenLayers.LonLat(sypOrig[2],sypOrig[3]) - topRight = topRight.transform(sypOrigProj, mapProj); - - centerBounds.extend(bottomLeft); - centerBounds.extend(topRight); - this.map.zoomToExtent(centerBounds); + this.map.setCenter(new OpenLayers.LonLat(0, 0), 0); } }, @@ -71,26 +58,36 @@ var SYP = { }, createDataLayer: function(map) { + var defaultStyle = new OpenLayers.Style({ + externalGraphic: this.Markers.ICON, + graphicHeight: "${height}" + }, { + context: { + height: function(feature) { + var defaultHeight = SYP.Markers.HEIGHT || 32; + var increase = 4 * (feature.attributes.count - 1); + return Math.min(defaultHeight + increase, 50); + } + } + }); + var selectStyle = new OpenLayers.Style({ + externalGraphic: this.Markers.SELECT_ICON, + graphicHeight: this.Markers.HEIGHT || 32 + }); var styleMap = new OpenLayers.StyleMap ( - {"default": { - externalGraphic: this.Settings.MARKER_ICON, - graphicHeight: this.Settings.MARKER_ICON_HEIGHT - || 32 - }, - "select": { - externalGraphic: this.Settings.MARKER_SELECT_ICON, - graphicHeight: this.Settings.MARKER_SELECT_ICON_HEIGHT - || 32 - } - }); + {"default": defaultStyle, + "select": selectStyle}); var layer = new OpenLayers.Layer.GML("KML", "items.php", { + strategies: [ + new OpenLayers.Strategy.Cluster() + ], styleMap: styleMap, format: OpenLayers.Format.KML, projection: this.map.displayProjection, eventListeners: { scope: this, - loadend: this.checkForFeatures + loadend: this.dataLayerEndLoad } }); @@ -108,12 +105,38 @@ var SYP = { return control; }, + dataLayerEndLoad: function() { + if (!this.checkForFeatures()) { + return; + } + + var map = this.map; + if (map.getControlsByClass("OpenLayers.Control.ArgParser")[0].lat + == undefined) { // map center was not set in ArgParser control. + var orig = this.Utils.mbr (this.dataLayer); + var centerBounds = new OpenLayers.Bounds(); + + var mapProj = map.getProjectionObject(); + var sypOrigProj = new OpenLayers.Projection("EPSG:4326"); + + var bottomLeft = new OpenLayers.LonLat(orig[0],orig[1]); + bottomLeft = bottomLeft.transform(sypOrigProj, mapProj); + var topRight = new OpenLayers.LonLat(orig[2],orig[3]) + topRight = topRight.transform(sypOrigProj, mapProj); + + centerBounds.extend(bottomLeft); + centerBounds.extend(topRight); + map.zoomToExtent(centerBounds); + } + }, + checkForFeatures: function() { var features = this.dataLayer.features; if (features.length == 0) { var message = SypStrings.noImageRegistered; this.Utils.displayUserMessage(message, "warn"); } + return !!features.length; }, createPopup: function(position, contentHTML) { @@ -131,6 +154,15 @@ var SYP = { }, onFeatureUnselect: function (feature) { + var map = feature.layer.map; + var permaControl = map.getControlsByClass("OpenLayers.Control.Permalink"); + if (permaControl[0]) { + permaControl[0].div.style.display = ""; + } + if (!feature.popup) { + this.map.events.unregister("movestart", this, this._unselect); + return; + } var popup = feature.popup; if (popup.visible()) { popup.hide(); @@ -139,32 +171,95 @@ var SYP = { onFeatureSelect: function(feature) { var map = feature.layer.map; + if (feature.attributes.count > 1) { + this.unselect(feature); + var lonlat = new OpenLayers.LonLat(feature.geometry.x, feature.geometry.y); + map.setCenter(lonlat, map.zoom + 1); + return; + } + var permaControl = map.getControlsByClass("OpenLayers.Control.Permalink"); + if (permaControl[0]) { + permaControl[0].div.style.display = "none"; + } var popup = feature.popup; - var brCorner = SYP.Utils.brCorner(map, 8); + var popupPos = null; + if (sypSettings.popupNearfeature) { + popupPos = feature.geometry.getBounds().getCenterLonLat(); + } else { + popupPos = SYP.Utils.brCorner(map, 8); + } // we cannot reuse popup; we need to recreate it in order for IE // expressions to work. Otherwise, we get a 0x0 image on second view. - if (popup) { + if (popup) { popup.destroy(); } var contentHTML; - if (feature.attributes.name) { + if (feature.cluster[0].attributes.name) { contentHTML = "