[Mapbender-commits] r6631 - trunk/mapbender/lib
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Mon Jul 26 05:35:41 EDT 2010
Author: kmq
Date: 2010-07-26 09:35:41 +0000 (Mon, 26 Jul 2010)
New Revision: 6631
Added:
trunk/mapbender/lib/mb.ui.displayFeatures.js
Log:
moved georss functionality into a widget
Added: trunk/mapbender/lib/mb.ui.displayFeatures.js
===================================================================
--- trunk/mapbender/lib/mb.ui.displayFeatures.js (rev 0)
+++ trunk/mapbender/lib/mb.ui.displayFeatures.js 2010-07-26 09:35:41 UTC (rev 6631)
@@ -0,0 +1,299 @@
+
+var originalI18nObject = {
+ "labelLoadError" : "Could not load Document",
+ "labelName":"Name",
+ "labelUntitled":"Untitled",
+ "labelUrlBox": "Paste URL here",
+ "sProcessing": "Processing...",
+ "sLengthMenu": "Show _MENU_ entries",
+ "sZeroRecords": "No matching records found",
+ "sInfo": "SLowing _START_ to _END_ of _TOTAL_ entries",
+ "sInfoEmpty": "Showing 0 to 0 of 0 entries",
+ "sInfoFiltered": "(filtered from _MAX_ total entries)",
+ "sInfoPostFix": "",
+ "sSearch": "Search:",
+ "sUrl": "",
+ "oPaginate": {
+ "sFirst": "First",
+ "sPrevious": "Previous",
+ "sNext": "Next",
+ "sLast": "Last"
+ }
+
+
+};
+
+var translatedI18nObject = Mapbender.cloneObject(originalI18nObject);
+
+
+var displayFeatures = {
+
+ options: {
+ url: "",
+ position: 'right'
+ },
+ _feeds: {},
+ _popup : null,
+
+ _create: function(){
+ var that = this, o = this.options;
+ if(o.url){
+ that._load(o.url);
+ }
+ this._popup = $('<div></div>').dialog({autoOpen : false, height: 500, width: 500});
+ this.element.click( function(e){
+ var map = that.element.mapbender();
+ var pos = map.getMousePosition(e);
+ var clickPoint = map.convertPixelToReal(new Point(pos.x,pos.y));
+ var feed = null;
+ var requestGeometries = [];
+ // This uses two methods to determine wether a clickposition is on a geometry
+ // - Points are represented as icons, so we check if the click is on an icon
+ // - Polygons don't have a dom Element when not using Rapheljs, so we go ask postgis
+ // after that's finished the results are merged and displayed in a box
+ var pointGeometries = {};
+ var g,h,nodes = null;
+ for (var i in that._feeds){
+ feed = that._feeds[i] ;
+ requestGeometries = [];
+
+ for(var j = 0; j < feed.geomArray.count(); j++){
+ g = feed.geomArray.get(j);
+ h = feed.highlightArray[j];
+ nodes = h.getNodes();
+ if(g.geomType == geomType.point){
+ // we only add one point per highlight so we can assume there's only one node
+ if(!nodes[0]){ continue;}
+ var rect = nodes[0].getBoundingClientRect();
+ if(e.clientX >= rect.left && e.clientX <= rect.right &&
+ e.clientY >= rect.top && e.clientY <= rect.bottom){
+ // we just need the keys to exist
+ // theywill be merged with the ones coming from the
+ // server
+ pointGeometries[j] = true;
+ // console.log(nodes[0]);
+ }
+
+ }else{
+ requestGeometries.push(g.toText());
+ }
+ }
+ var req = new Mapbender.Ajax.Request({
+ url: "../php/intersection.php",
+ method: "intersect",
+ parameters: {
+ clickPoint: clickPoint.toText(),
+ geometries: requestGeometries
+ },
+ callback: (function(geomArray,pointGeometries){ return function(result, success, message){
+ if(!success){
+ return;
+ }
+ // this is basically an onclick handler, !intersects means
+ // the click didn't happen on the polygon
+ $.extend(result.geometries,pointGeometries);
+ if(!result.geometries || result.geometries.length <1){
+ return;
+ }
+
+
+ $("*",that._popup).remove();
+ var $tabs = $("<ul></ul>");
+ // this iterates over an object where the keys are _not_ the incremential
+ // basically a sparse array. therefore I cannot be used to count the entries in the object
+ // this is why j is used
+ var j = 0;
+ for(i in result.geometries){
+ var g = geomArray.get(i);
+ title = g.e.getElementValueByName("title");
+ name = g.e.getElementValueByName("name");
+ if(typeof(name) == "string"){
+ title = name != "false" ? name : title;
+ if (icon == "false"){
+ g.e.setElement("Mapbender:icon","../img/marker/red.png");
+ }
+ }else{
+ //sane browsers go here
+ title = name != false ? name : title;
+ if (icon === false){
+ g.e.setElement("Mapbender:icon","../img/marker/red.png");
+ }
+ }
+ description = g.e.getElementValueByName("description");
+ $tabs.append('<li><a href="#rsspopup_'+ i +'">'+ title + '</a></li>');
+ that._popup.append('<div id="rsspopup_'+ i +'"><h1>'+ title +'</h1><p>'+ description +'</p></h1>');
+ j++;
+ }
+ if(j > 1){
+ var $tabcontainer = $("<div><div>");
+ $tabcontainer.append($tabs);
+ $tabcontainer.append($('div',that._popup));
+ that._popup.append($tabcontainer);
+ $tabcontainer.tabs();
+ }
+ that._popup.dialog('open');
+
+
+ };
+ }
+ )(feed.geomArray, pointGeometries)
+ });
+ req.send();
+ requestGeometries = [];
+ pointGeometries = {};
+ }
+ });
+ },
+
+ _load : function(url){
+ var that = this, o = this.options;
+ $.ajax({ url: that._endpointURL,
+ data: {url: o.url},
+ type: 'POST',
+ dataType: "json",
+ success : function(data,textStatus,xhr){
+ if(data.errorMessage){
+ $("<div class='labelLoadError'>ERROR<div>").dialog({ buttons: {"OK":function(){ $(this).dialog("close"); } } } );
+ return;
+ }
+ that._display(data);
+ },
+ error: function(XMLHttpRequest, textStatus, errorThrown){
+ $("<div class='labelLoadError'>"+ translatedI18nObject.labelLoadError +"</div>").dialog({ buttons: {"OK":function(){ $(this).dialog("close"); }} });
+ }
+ });
+
+ },
+
+ _display : function(geoJSON){
+
+ var that = this, o = this.options;
+ var $map = $(that.element).mapbender();
+ var markers = [];
+ var title = "";
+ var $table = $("<table><thead><tr><th class='labelName'>"+ translatedI18nObject.labelName +"</th></tr></thead><tbody></tbody></table>");
+
+ if(geoJSON.features){
+ // we always transform _from_ 4326 geoRSS and KML use this as their default
+ var projSrc = new Proj4js.Proj('EPSG:4326');
+ var projDest = new Proj4js.Proj($map.epsg);
+ var markeroptions = {width: "19px", height: "34px"};
+ var g = null;
+
+ var geomArray = new GeometryArray();
+ var highlightArray = [];
+ geomArray.importGeoJSON(geoJSON);
+ for(var i =0; i < geomArray.count(); i++){
+ var h = new Highlight([this.element.attr('id')], "mapframe1_" + parseInt(Math.random()*100000,10),{
+ "position":"absolute",
+ "top": "0px",
+ "left": "0px",
+ "z-index": "80" },1);
+ g = geomArray.get(i);
+ icon = g.e.getElementValueByName("Mapbender:icon");
+ title = g.e.getElementValueByName("title");
+ name = g.e.getElementValueByName("name");
+
+ if(name != "false" && name !== false){
+ title = name;
+ }
+ if(icon == "false" || icon === false){
+ g.e.setElement("Mapbender:iconOffsetX", -10);
+ g.e.setElement("Mapbender:iconOffsetY", -34);
+ g.e.setElement("Mapbender:icon","../img/marker/red.png");
+ }
+
+ description = g.e.getElementValueByName("description");
+ $row = $("<tr><td>"+ title +"</td></tr>");
+ $row.css("cursor","pointer");
+ $row.click((function(title,description){
+ return function(){
+ $("*",that._popup).remove();
+ description = description.replace('<a ','<a target="_new" ');
+ that._popup.append($("<div><h1>"+title+"</h1><p>"+description +"</p></div>")).dialog('open');
+ };
+ })(title,description));
+ $("tbody",$table).append($row);
+ h.add(g);
+ highlightArray.push(h);
+
+ title = "";
+ name = "";
+ }
+ for(var i in highlightArray){
+ highlightArray[i].paint();
+ }
+ $map.events.afterMapRequest.register(function () {
+ for(var i in highlightArray){
+ highlightArray[i].paint();
+ }
+ });
+
+ that._feeds[url] = {
+ geomArray: geomArray,
+ highlightArray: highlightArray
+ };
+
+
+ }
+
+ var $tableDialog = $("<div></div>").dialog({
+ width: "450",
+ height: "500",
+ autoOpen: true,
+ position: o.position,
+ beforeclose: (function(url){
+ return function(){
+ delete that._feeds[url];
+ for(var i in highlightArray){
+ highlightArray[i].clean();
+ }
+ };
+ })(url),
+ buttons: {"Close": function(){
+ $(this).dialog('close');
+ $(this).dialog('destroy');
+ }
+ }
+ });
+ $tableDialog.append($table);
+
+ $table.dataTable({"bJQueryUI": true ,
+ "oLanguage":{
+ "sUrl":"../extensions/dataTables-1.5/lang/"+Mapbender.languageId +".txt"
+ } });
+
+ }
+};
+
+
+
+
+var displayGeoRSS = $.extend({},displayFeatures,{
+ _endpointURL: "../php/geoRSSToGeoJSON.php"
+});
+console.log(displayGeoRSS);
+$.widget('ui.georss',displayGeoRSS);
+
+
+var displayKML = $.extend({},displayFeatures, {
+ _endpointURL: "../php/kmlToGeoJSON.php"
+});
+$.widget('ui.kml',displayKML);
+
+
+var displayGeoJSON = $.extend({},displayFeatures,{
+ _endpointURL: "",
+ _load: function(){
+ var self = this, o = this.options;
+ $.ajax({ url: o.url,
+ type: "GET",
+ dataType: "json",
+ success : function(data,textStatus,xhr){
+ self._display(data);
+ }
+ });
+
+ }
+});
+$.widget('ui.geojson',displayKML);
More information about the Mapbender_commits
mailing list