[Mapbender-commits] r3050 - branches/beck_dev/http/javascripts

svn_mapbender at osgeo.org svn_mapbender at osgeo.org
Tue Sep 30 06:46:28 EDT 2008


Author: beck
Date: 2008-09-30 06:46:28 -0400 (Tue, 30 Sep 2008)
New Revision: 3050

Added:
   branches/beck_dev/http/javascripts/mod_georss.php
Modified:
   branches/beck_dev/http/javascripts/popup.js
Log:


Added: branches/beck_dev/http/javascripts/mod_georss.php
===================================================================
--- branches/beck_dev/http/javascripts/mod_georss.php	                        (rev 0)
+++ branches/beck_dev/http/javascripts/mod_georss.php	2008-09-30 10:46:28 UTC (rev 3050)
@@ -0,0 +1,83 @@
+<?php
+# $Id:$
+# http://www.mapbender.org/index.php/mod_georss.php
+# Copyright (C) 2002 CCGIS 
+#
+# This program is free software; you can redistribute it and/or modify
+# it under the terms of the GNU General Public License as published by
+# the Free Software Foundation; either version 2, or (at your option)
+# any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU General Public License
+# along with this program; if not, write to the Free Software
+# Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+
+require_once(dirname(__FILE__)."/../php/mb_validateSession.php");
+?>
+var georssWin=null;
+var highlighter;
+var geoms=null;
+function loadGeoRSS(url){
+	$.post("../php/geoRSSToGeoJSON.php",{url:url}, function(jsCode, status){
+			if(status=='success'){
+				var geoObj = eval('(' + jsCode + ')');	
+	       		if (jsCode) {
+		        	if (typeof(geoObj) == 'object') {
+		        		if(geoms)
+		        			delete geoms;
+						geoms = new GeometryArray();
+		           		geoms.importGeoJSON(geoObj);
+		           		if(typeof(highlighter)==='undefined')
+							highlighter = new Highlight(new Array("mapframe1"), "geoRssHL", {"position":"absolute", "top":"0px", "left":"0px", "z-index":30}, 2);
+						else
+							highlighter.clean();
+						for( var i=0;i<geoms.count();i++){
+							highlighter.add(geoms.get(i),"red");
+						}
+						highlighter.paint();
+						eventAfterMapRequest.register("highlighter.paint();");
+					}
+					else {
+					}
+				}
+	       		else {
+				}
+	       	}
+		});
+}
+
+function mod_georssInit(){
+	$(window.frames["mapframe1"].document).mousemove(function(event){
+		mb_getMousePos(event,"mapframe1");
+		mod_georss_run();
+	}).mouseout(mod_georss_run);
+}
+eventInit.register( mod_georssInit);
+
+function mod_georss_run(){
+	if(geoms){
+		var clPoint = new Point(clickX,clickY);
+		for( var i=0;i<geoms.count();i++){
+//TODO respect type of geometry (now only points are supported)
+			pt = realToMap("mapframe1", geoms.getPoint(i,0,0));
+			if(pt.dist(clPoint)<5){
+				if(georssWin && georssWin.isVisible()){
+					georssWin.destroy();
+				}
+				x=parseInt(document.getElementById("mapframe1").style.left);
+				y=parseInt(document.getElementById("mapframe1").style.top);
+			
+				georssWin = new mb_popup({title:geoms.get(i).e.getElementValueByName("title"),
+					html:geoms.get(i).e.getElementValueByName("description"),balloon:true,left:pt.x+x,top:pt.y+y});
+				georssWin.show();
+				return;
+			}
+		}
+	}
+}
+

Modified: branches/beck_dev/http/javascripts/popup.js
===================================================================
--- branches/beck_dev/http/javascripts/popup.js	2008-09-30 10:46:08 UTC (rev 3049)
+++ branches/beck_dev/http/javascripts/popup.js	2008-09-30 10:46:28 UTC (rev 3050)
@@ -4,7 +4,7 @@
 * License (>=v2). Read the file gpl.txt that comes with Mapbender for details. 
 */
 //http://www.mapbender.org/index.php/popup
-var popup_count = 0;
+var popup_count = 1;
 var popup_top = 150;
 
 /**
@@ -18,22 +18,25 @@
  *  width: popup width
  *  height: popup height
  *  title: popup title
- *  frameName: name of the popups iframe if it loads a frame
- *  opacity: opacity of the frame
- *  moveOpacity: opacity while the user moves or resizes the frame
+ *  frameName: name of the popups iframe if it loads a frame  (recommended to set destroy to false)
+ *  opacity: opacity of the frame default:1
+ *  moveOpacity: opacity while the user moves or resizes the frame default:0.8
  *  html:content html of the frame (not parsed if url not false)
  *  url:content url of the frame
  *  minWidth: minimum width of the popup if the user resizes it
  *  maxWidth: maximum width of the popup if the user resizes it
  *  minHeight: minimum height of the popup if the user resizes it
  *  maxHeight: maximum height of the popup if the user resizes it
- *  minTop: minimum top position if the user moves the popup
- *  minLeft: minimum left position if the user moves the popup 
- *  maxRight: maximum right position if the user moves/resizes the popup
+ *  minTop: minimum top position if the user moves the popup default:"document"
+ *  minLeft: minimum left position if the user moves the popup default:"document"
+ *  maxRight: maximum right position if the user moves/resizes the popup 
  *  maxBottom: maximum bottom position if the user moves/resized the popup
- * 	style: additional styles for the popup
- *  destroy: remove dom of popup if user closes it (don't use it for iframes with framename)
+ * 	style: additional styles for the popup window
+ *  destroy: remove dom of popup if user closes it (don't use it for iframes with framename) default:true
  *  closeCallback: function that is called if the user closes the window
+ *  resizeable: allow user to change the size default:true
+ *  dragable: allow user to move the window default:true
+ *  balloon: balloon popup from top, left (disables resizeable and dragable)
  * 
  * @param {String} html the "body" of the popup, can also be "url:http://foo.de" to display a website
  * @param {Number} width width of the popup
@@ -46,23 +49,23 @@
 	//get first free place
 	var create_pos=popup_count;
 	for(var i = 0; i < popup_count;i++)
-//		if(!document.getElementById("popup"+String(i))){
-//			create_pos=i;
-//			break;
-//		}
+		if(!document.getElementById("popup"+String(i))){
+			create_pos=i;
+			break;
+		}
 
-	this.id="popup"+String(create_pos);
-//	this.id="popup"+String(popup_top);
-	
+	this.id="popup"+String(++popup_top);
+		
 	//Set defaults
 	defaults = {
 		left:25*create_pos,
 		top:25*create_pos,
 		width:300,height:250,
 		title:"Title",
-		frameName:this.id
-	}
-		
+		frameName:this.id,
+		id:this.id
+	};
+
 	if(typeof(title)!='object'){
 		this.options = defaults;
 		
@@ -84,6 +87,8 @@
 	else
 		this.options=$.extend(defaults, title);
 
+	this.id = this.options.id;
+	
 	popup_count++;
 	
 	//create dom popup
@@ -109,6 +114,7 @@
  */
 mb_popup.prototype.hide = function(){	
 	$("#"+this.id).hide();
+	$("#balloon_"+this.id).hide();
 }
 
 /**
@@ -116,6 +122,7 @@
  */
 mb_popup.prototype.destroy = function(){	
 	$("#"+this.id).remove();
+	$("#balloon_"+this.id).remove();
 }
 
 /**
@@ -185,10 +192,43 @@
 mb_popup.prototype.setHtml = function(htmll){
 	this.options.url=null;
 	this.options.html=htmll;
-	$("#"+this.id+" .jqmnContent").html(htmll);
+	$("#"+this.id+" .Content").html('<div class="scrollDiv">'+htmll+'</div>');
 }
+/**
+ * behaves like document.open(); (clear popup)
+ */
+mb_popup.prototype.open = function(){
+	oDoc = this.getDocument();
+	if(oDoc!=null){
+		return oDoc.open();
+	}
+	this.setHtml("");
+}
 
 /**
+ * behaves like document.write(); (appends content to the popup)
+ * 
+ * @param {String} text or html to write into the document
+ */
+mb_popup.prototype.write = function(str){
+	oDoc = this.getDocument();
+	if(oDoc!=null){
+		return oDoc.write(str);
+	}
+	this.setHtml(this.options.html+str);
+}
+
+/**
+ * behaves like document.close(); (finish loading state if popup is an iframe)
+ */
+mb_popup.prototype.close = function(){
+	oDoc = this.getDocument();
+	if(oDoc!=null){
+		return oDoc.close();
+	}
+}
+
+/**
  * sets the url of the content
  *
  * @param {String} url new url of the popup  
@@ -196,14 +236,24 @@
 mb_popup.prototype.setUrl = function(url){
 	this.options.url=url;
 	this.options.html=null;
-	try{
-		eval("window.frames."+this.options.frameName+".location = \""+url+"\"");
-	}catch(e){
-		$("#"+this.id+" .jqmnContent").html('<iframe src="'+url+'"></iframe>');
+	
+	oDoc = this.getDocument();
+	if(oDoc){
+		oDoc.location.href = url;
 	}
+	else{
+		$("#"+this.id+" .Content").html('<iframe src="'+url+'"></iframe>');
+	}
 }
 
 /**
+ * reposition
+ */
+mb_popup.prototype.reposition =function(){
+//TODO	
+}
+
+/**
  * gets the visible state of the popup window
  * @return visible state of the popup
  * @type Boolean
@@ -213,6 +263,34 @@
 }
 
 /**
+ * (re) set Some Options of the popup Window and rerender it
+ * @param options object that contains the new options
+ */
+mb_popup.prototype.set = function(options){
+	this.destroy();
+	this.options=$.extend(this.options, options);
+	this.show();
+}
+
+/**
+ * get the DOM document of the client iframe
+ * @return DOM document or null if the popup doesn't contain an iframe
+ */
+mb_popup.prototype.getDocument = function(){
+	iFrame = $("#"+this.id+" iframe")[0];
+	try{
+		//try to load contentWindow first since not every browser 
+		//supports contentDocument (or gives the window instead)
+		oDoc = iFrame.contentWindow || iFrame.contentDocument;
+		if (oDoc.document) {
+	        oDoc = oDoc.document;
+    	}
+    	return oDoc;
+	}
+	catch(e){return null;}
+}
+
+/**
  * get Scroll position
  */
 function getScrollPos() {  
@@ -230,118 +308,158 @@
 		//IE6 standards compliant mode  
 		scrOf.Y = document.documentElement.scrollTop;  
 		scrOf.X = document.documentElement.scrollLeft;  
-	}  
+	}
 	return scrOf;  
 }
 
+
+
 (function($){
 	$.fn.mbPopup = function(options){
 		//default settings
 		defaults = {
-			left:0,top:0,
-			width:300,height:250,
+			left:0,top:0,width:300,height:250,
 			title:"",frameName:"",
 			opacity:1.0,moveOpacity:0.8,html:false,url:false,
 			minWidth:false,maxWidth:false,
 			minHeight:false,maxHeight:false,
 			minTop:"document",minLeft:"document",
 			maxRight:false,maxBottom:false,
+			dragable:true,resizeable:true,balloon:false,
 			style:null,destroy:true,
 			closeCallback:null
 		};
 		//override defaults
 		settings=$.extend(defaults,options)
+		this.settings = settings;
 		
 		//add Styles
-		this.addClass("jqmNotice");
+		this.addClass("mbPopup");
 		
-		this.css({top:settings.top,
-			left:settings.left,
-			width:settings.width,
-			height:settings.height,
+		//append additions styles
+		if(settings.style)
+			this.css(settings.style);
+		
+		//automated settings for balloon popup
+		if(settings.balloon){
+			$("body").append("<div id='balloon_"+settings.id+"' class='balloonBL' style='visibility:hidden;'>");
+			settings.resizeable = false;
+			settings.dragable = false;
+		}
+
+		//calculate positioning (mainly needed for balloon style)
+		pos = $.mbPopupFn.calcPositioning(settings, this);
+
+		//set balloon arm position
+		if(settings.balloon){
+			$("#balloon_"+settings.id).attr("class", "balloon"+(pos.position>=2?"B":"T")+(pos.position%2?"R":"L"))
+				.css({"z-index":(popup_top++),visibility:"visible",left:pos.bX,top:pos.bY});
+			settings.left = pos.pX;
+			settings.top = pos.pY;
+		}
+		
+		//fix IE width and height by adding the padding values
+		if($.browser.msie){
+			settings.width = pos.pW;
+			settings.height = pos.pH;
+		}
+		
+		//Set dimensions
+		this.css({top:settings.top+"px",
+			left:settings.left+"px",
+			width:settings.width+"px",
+			height:settings.height+"px",
 			opacity:settings.opacity
 			});
 		
-		if(settings.style)
-			this.css(settings.style);
-		
 		//Insert content
 		if(settings.url)
 			html = ('<iframe name="'+settings.frameName+'" src="'+settings.url+'"></iframe>');
 		else
 			html = ('<div class="scrollDiv">'+settings.html+'</div>');
 	
-		this.html('<div class="jqmnTitle jqDrag"><h1>'+settings.title+'</h1></div><div class="jqmnContent">'+html+'</div><img src="../img/close_icon.png" class="jqmClose" alt="close" /><div class="jqResize" />');
+		this.html('<div class="Title Drag"><h1>'+settings.title+'</h1></div><div class="Content">'+html+'</div><img src="../img/close_icon.png" class="Close" alt="close" />'+(settings.resizeable?'<div class="Resize" />':''));
 	
 		var data = {El:this,fY:settings.minTop,fX:settings.minLeft,tX:settings.maxRight,tY:settings.maxBottom,
 			fW:settings.minWidth,tW:settings.maxWidth,fH:settings.minHeight,tH:settings.maxHeight,
 			destroy:settings.destroy,opacity:settings.opacity,moveOpacity:settings.moveOpacity,close:settings.closeCallback}
 
 		//Make window Dragable
-		$(".jqDrag", this).bind('mousedown',data,function(event){
-			//set to top
-			event.data.El.css("z-index",popup_top++);
-			event.data.El.css('opacity',event.data.moveOpacity)
-			//create helper div to steal mouse events
-			$("body").append("<div style=\"position:absolute;top:0px;left:0px;width:"+$().width()+"px;height:"+$().height()+"px;z-index:"+(popup_top+2)+(top.ie?";background:url(../img/transparent.gif)":"")+"\" id=\"mouse_catcher\"></div>");
-			$("iframe", event.data.El).hide();
-						
-			//Parse setiings of min and max position
-			var data = $.mbPopupFn.parseDimensions(event);
-			
-			//bind mouse events to popup
-			$().bind("mousemove",data,$.mbPopupFn.drag).bind('mouseup',event.data,$.mbPopupFn.stopdrag);
-		});
+		if(settings.dragable)
+			$(".Drag", this).bind('mousedown',data,function(event){
+				//set to top
+				event.data.El.css("z-index",popup_top++);
+				event.data.El.css('opacity',event.data.moveOpacity)
+				//create helper div to steal mouse events
+				$("body").append("<div style=\"position:absolute;top:0px;left:0px;width:"+$().width()+"px;height:"+$().height()+"px;z-index:"+(popup_top+2)+($.browser.msie?";background:url(../img/transparent.gif)":"")+"\" id=\"mouse_catcher\"></div>");
+				$("iframe", event.data.El).hide();
+							
+				//Parse setiings of min and max position
+				var data = $.mbPopupFn.parseDimensions(event);
+				
+				//bind mouse events to popup
+				$().bind("mousemove",$.extend(data,{drag:true}),$.mbPopupFn.move).bind('mouseup',event.data,$.mbPopupFn.stop);
+			});
 		
 		//Make Window resizable
-		$(".jqResize", this).bind('mousedown',data,function(event){
-			//set to top
-			event.data.El.css("z-index",popup_top++);
-			event.data.El.css('opacity',0.8)
-			//create helper div to steal mouse events
-			$("body").append("<div style=\"position:absolute;top:0px;left:0px;width:"+$().width()+"px;height:"+$().height()+"px;z-index:"+(popup_top+2)+(top.ie?";background:url(../img/transparent.gif)":"")+"\" id=\"mouse_catcher\"></div>");
-			$("iframe", event.data.El).hide();
-
-			//Parse setiings of min and max position
-			var data = $.mbPopupFn.parseDimensions(event);
-			
-			//bind mouse events to popup
-			$().bind("mousemove",data,$.mbPopupFn.resize).bind('mouseup',event.data,$.mbPopupFn.stopresize);
-		});
+		if(settings.resizeable)
+			$(".Resize", this).bind('mousedown',data,function(event){
+				//set to top
+				event.data.El.css("z-index",popup_top++);
+				event.data.El.css('opacity',event.data.moveOpacity)
+				//create helper div to steal mouse events
+				$("body").append("<div style=\"position:absolute;top:0px;left:0px;width:"+$().width()+"px;height:"+$().height()+"px;z-index:"+(popup_top+2)+($.browser.msie?";background:url(../img/transparent.gif)":"")+"\" id=\"mouse_catcher\"></div>");
+				$("iframe", event.data.El).hide();
+	
+				//Parse setiings of min and max position
+				var data = $.mbPopupFn.parseDimensions(event);
+				
+				//bind mouse events to popup
+				$().bind("mousemove",$.extend(data,{drag:false}),$.mbPopupFn.move).bind('mouseup',event.data,$.mbPopupFn.stop);
+			});
 		
 		//closeButton
-		$(".jqmClose", this).bind('click',data, function(event){
+		$(".Close", this).bind('click',data, function(event){
 			if(event.data.close)
 				event.data.close();
-			if(event.data.destroy)
+			if(event.data.destroy){
 				event.data.El.slideUp('slow', function(){$(this).remove();});
-			else
+				$("#balloon_"+event.data.El.attr("id")).remove();
+			}
+			else{
 				event.data.El.slideUp('slow');
+				$("#balloon_"+event.data.El.attr("id")).fadeOut();
+			}
 		});
 		
 		//raise on click
-		this.click(function(){this.style.zIndex=popup_top++});
+		this.click(function(){this.style.zIndex=popup_top++;$("#balloon_"+this.id).css("z-index", popup_top++);});
+		$("#balloon_"+settings.id).click(function(){$("#"+this.id.substr(8)).css("z-index", popup_top++);this.style.zIndex=popup_top++;});
+		
+		//raise top postition
+		popup_top++;
 	};
 	//helper functions
 	$.mbPopupFn = {
-		//on drag
-		drag:function(event){
-			//console.log("tesddt");			
-			var newPos = {X:event.data.X+event.pageX-event.data.pX,
-				Y:event.data.Y+event.pageY-event.data.pY};
-			if(event.data.fX!==false&&newPos.X<event.data.fX)
-				newPos.X=event.data.fX;
-			if(event.data.fY!==false&&newPos.Y<event.data.fY)
-				newPos.Y=event.data.fY;
-			if(event.data.tX!==false&&newPos.X>event.data.tX-event.data.W)
-				newPos.X=event.data.tX-event.data.W;
-			if(event.data.tY!==false&&newPos.Y>event.data.tY-event.data.H)
-				newPos.Y=event.data.tY-event.data.H;
-			
-			event.data.El.css({left:newPos.X,top:newPos.Y});
-		},
-		//on resize
-		resize:function(event){
+		//on mouse action
+		move:function(event){
+			//drag
+			if(event.data.drag){
+				var newPos = {X:event.data.X+event.pageX-event.data.pX,
+					Y:event.data.Y+event.pageY-event.data.pY};
+				if(event.data.fX!==false&&newPos.X<event.data.fX)
+					newPos.X=event.data.fX;
+				if(event.data.fY!==false&&newPos.Y<event.data.fY)
+					newPos.Y=event.data.fY;
+				if(event.data.tX!==false&&newPos.X>event.data.tX-event.data.W)
+					newPos.X=event.data.tX-event.data.W;
+				if(event.data.tY!==false&&newPos.Y>event.data.tY-event.data.H)
+					newPos.Y=event.data.tY-event.data.H;
+				
+				event.data.El.css({left:newPos.X,top:newPos.Y});
+				return;
+			}
+			//resize
 			var newDim = {W:Math.max(event.pageX-event.data.pX+event.data.W,0),
 				H:Math.max(event.pageY-event.data.pY+event.data.H,0)};
 			if(event.data.fW!==false&&newDim.W<event.data.fW)
@@ -358,23 +476,20 @@
 				newDim.H=event.data.tY-event.data.Y;	
 						
 			event.data.El.css({width:newDim.W,height:newDim.H});
+			
 		},
-		stopdrag:function(event){
+		stop:function(event){
 			event.data.El.css('opacity',event.data.opacity)
 			$("iframe", event.data.El).show();
-			$().unbind('mousemove',$.mbPopupFn.drag).unbind('mouseup',$.mbPopupFn.stopdrag);
+			$().unbind('mousemove',$.mbPopupFn.move).unbind('mouseup',$.mbPopupFn.stop);
 			$("#mouse_catcher").remove();
 		},
-		stopresize:function(event){
-			event.data.El.css('opacity',event.data.opacity)
-			$("iframe", event.data.El).show();
-			$().unbind('mousemove',$.mbPopupFn.resize).unbind('mouseup',$.mbPopupFn.stopresize);
-			$("#mouse_catcher").remove();
-		},
 		//parse move and resize dimensions
 		parseDimensions:function(d){
 			var dim = getScrollPos();
-			return {El:d.data.El,
+			var bd = {X:parseInt($(d.data.El).css("border-left-width"))+parseInt($(d.data.El).css("border-right-width")),
+				Y:parseInt($(d.data.El).css("border-top-width"))+parseInt($(d.data.El).css("border-bottom-width"))};
+			ret = {El:d.data.El,
 				fX:(d.data.fX=="window"?dim.X:(d.data.fX=="document"?0:(d.data.fX<0?dim.dW-d.data.fX:d.data.fX))),
 				fY:(d.data.fX=="window"?dim.Y:(d.data.fY=="document"?0:(d.data.fY<0?dim.dH-d.data.fY:d.data.fY))),
 				tX:(d.data.tX=="window"?dim.X+dim.wW:(d.data.tX=="document"?dim.dW:(d.data.tX<0?dim.dW-d.data.tX:d.data.tX))),
@@ -389,6 +504,45 @@
 				H:parseInt(d.data.El.css("height")),
 				pX:d.pageX,pY:d.pageY
 			};
+			if(ret.tX)ret.tX-=bd.X;
+			if(ret.tY)ret.tY-=bd.Y;
+			return ret;	
+		},
+		calcPositioning:function(settings, el){
+			var dim = getScrollPos();
+			
+			pos = {};
+			pos.pH = settings.height + (parseInt(el.css("padding-top"))+parseInt(el.css("padding-bottom")));
+			pos.pW = settings.width + (parseInt(el.css("padding-left"))+parseInt(el.css("padding-right")));
+			if(settings.balloon){
+				pos.bH = $("#balloon_"+settings.id).height();
+				pos.bW = $("#balloon_"+settings.id).width();
+	
+				pos.position = 0;
+				
+				if(settings.top-pos.pH-pos.bH-parseInt(el.css("border-top-width"))<dim.Y){
+					//bubble on top
+					pos.pY = settings.top+pos.bH-parseInt(el.css("border-top-width"));
+				}
+				else{
+					//bubble on bottom
+					pos.pY = settings.top-pos.pH-pos.bH+($.browser.msie?parseInt(el.css("border-bottom-width")):-parseInt(el.css("border-top-width")));
+					pos.position+=2;
+				}
+				if(settings.left+pos.pW+parseInt(el.css("border-left-width"))+parseInt(el.css("border-right-width"))>(dim.X+dim.wW)){
+					//bubble on right
+					pos.pX = settings.left-parseInt(el.css("border-left-width"))-parseInt(el.css("border-right-width"))-pos.pW;
+					pos.position++;
+				}
+				else{
+					//bubble on left
+					pos.pX = settings.left-parseInt(el.css("border-left-width"));
+				}
+				
+				pos.bX=(settings.left-(pos.position%2?pos.bW:0));
+				pos.bY=(settings.top-(pos.position>=2?pos.bH:0));
+			}
+			return pos;
 		}
 	};
 	})



More information about the Mapbender_commits mailing list