[Mapbender-commits] r2333 - in branches/nimix_dev/http: css
javascripts
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Thu Apr 3 11:10:00 EDT 2008
Author: nimix
Date: 2008-04-03 11:10:00 -0400 (Thu, 03 Apr 2008)
New Revision: 2333
Modified:
branches/nimix_dev/http/css/popup.css
branches/nimix_dev/http/javascripts/popup.js
branches/nimix_dev/http/javascripts/tooltip.php
Log:
popup css refactoring
Modified: branches/nimix_dev/http/css/popup.css
===================================================================
--- branches/nimix_dev/http/css/popup.css 2008-04-02 10:41:13 UTC (rev 2332)
+++ branches/nimix_dev/http/css/popup.css 2008-04-03 15:10:00 UTC (rev 2333)
@@ -1,9 +1,9 @@
@CHARSET "UTF-8";
/*fixes*/
-div.jqmNotice iframe {width:100%;height:100%;border:none;}
-div.jqmNotice div.scrollDiv {overflow:auto;position:relative;top:0px;left:0px;right:0px;bottom:0px;width:100%;height:100%;}
+div.mbPopup iframe {width:100%;height:100%;border:none;}
+div.mbPopup div.scrollDiv {overflow:auto;width:100%;height:100%;border:none;}
-div.jqmNotice {
+div.mbPopup {
display: none;
overflow:hidden;
position: absolute;
@@ -17,7 +17,7 @@
padding: 30px 10px 5px 10px;
}
-div.jqmNotice .jqResize {
+div.mbPopup .Resize {
position: absolute;
right: 5px;
bottom: 5px;
@@ -26,7 +26,7 @@
background:url(../img/resize.gif);
}
-.jqmnTitle{
+div.mbPopup .Title{
position:absolute;
left:35px;
right:25px;
@@ -35,7 +35,7 @@
padding:0pt;
}
-.jqmnTitle h1{
+div.mbPopup .Title h1{
background-color:#505050;
color:#EEEEEE;
font-size:12px;
@@ -44,14 +44,14 @@
text-align:center;
}
-div.jqmNotice .jqmClose {
+div.mbPopup .Close {
position: absolute;
cursor: pointer;
right: 8px;
top: 10px;
}
-.jqmnContent{
+div.mbPopup .Content{
}
.balloonTL{
Modified: branches/nimix_dev/http/javascripts/popup.js
===================================================================
--- branches/nimix_dev/http/javascripts/popup.js 2008-04-02 10:41:13 UTC (rev 2332)
+++ branches/nimix_dev/http/javascripts/popup.js 2008-04-03 15:10:00 UTC (rev 2333)
@@ -7,6 +7,16 @@
var popup_count = 0;
var popup_top = 150;
+setTimeout("hallo();", 5000);
+function hallo(){
+ rre=new mb_popup({url:"http://www.google.de/"});
+ rre.show();
+ setTimeout("hallo2();", 5000);
+}
+function hallo2(){
+ rre.setUrl("http://www.wheregroup.com/");
+}
+
/**
* @class A class representing a popup window
*
@@ -65,7 +75,7 @@
frameName:id,
id:id
};
-
+
if(typeof(title)!='object'){
this.options = defaults;
this.options.id = id;
@@ -193,7 +203,7 @@
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>');
}
/**
@@ -204,14 +214,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
@@ -221,6 +241,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() {
@@ -242,6 +290,8 @@
return scrOf;
}
+
+
(function($){
$.fn.mbPopup = function(options){
//default settings
@@ -259,53 +309,40 @@
};
//override defaults
settings=$.extend(defaults,options)
+ this.settings = settings;
//add Styles
- this.addClass("jqmNotice");
+ this.addClass("mbPopup");
+ //append additions styles
if(settings.style)
this.css(settings.style);
- settings.height += parseInt(this.css("padding-top"))+parseInt(this.css("padding-bottom"));
- settings.width += parseInt(this.css("padding-left"))+parseInt(this.css("padding-right"));
-
//automated settings for balloon popup
if(settings.balloon){
- var dim = getScrollPos();
-
- bubble_height = 80;
- bubble_width = 100;
+ $("body").append("<div id='balloon_"+settings.id+"' class='balloonBL' style='visibility:hidden;'>");
settings.resizeable = false;
settings.dragable = false;
- settings.hotSpotY=settings.top;
- settings.hotSpotX=settings.left;
- position = 0;
-
- console ={};
- console.log = function(){};
-
- if(settings.hotSpotY-settings.height-bubble_height-parseInt(this.css("border-top-width"))<dim.Y){
- //bubble on top
- settings.top = settings.hotSpotY+bubble_height-parseInt(this.css("border-top-width"));
- }
- else{
- //bubble on bottom
- settings.top = settings.hotSpotY-settings.height-bubble_height+(top.ie?parseInt(this.css("border-bottom-width")):-parseInt(this.css("border-top-width")));
- position+=2;
- }
- if(settings.hotSpotX+settings.width+parseInt(this.css("border-left-width"))+parseInt(this.css("border-right-width"))>(dim.X+dim.wW)){
- //bubble on right
- settings.left = settings.hotSpotX-parseInt(this.css("border-left-width"))-parseInt(this.css("border-right-width"))-settings.width;
- position++;
- }
- else{
- //bubble on left
- settings.left = settings.hotSpotX-parseInt(this.css("border-left-width"));
- }
+ }
- $("body").append("<div id='balloon_"+settings.id+"' class='balloon"+(position>=2?"B":"T")+(position%2?"R":"L")+"' style='z-index:"+(popup_top++)+";left:"+(settings.hotSpotX-(position%2?bubble_width:0))+"px;top:"+(settings.hotSpotY-(position>=2?bubble_height:0))+"px'>");
+ //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",
@@ -319,7 +356,7 @@
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" />'+(settings.resizeable?'<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,
@@ -327,12 +364,12 @@
//Make window Dragable
if(settings.dragable)
- $(".jqDrag", this).bind('mousedown',data,function(event){
+ $(".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)+(top.ie?";background:url(../img/transparent.gif)":"")+"\" id=\"mouse_catcher\"></div>");
+ $("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
@@ -344,12 +381,12 @@
//Make Window resizable
if(settings.resizeable)
- $(".jqResize", this).bind('mousedown',data,function(event){
+ $(".Resize", this).bind('mousedown',data,function(event){
//set to top
event.data.El.css("z-index",popup_top++);
- event.data.El.css('opacity',0.8)
+ 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>");
+ $("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
@@ -360,7 +397,7 @@
});
//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){
@@ -448,6 +485,42 @@
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;
}
};
})
Modified: branches/nimix_dev/http/javascripts/tooltip.php
===================================================================
--- branches/nimix_dev/http/javascripts/tooltip.php 2008-04-02 10:41:13 UTC (rev 2332)
+++ branches/nimix_dev/http/javascripts/tooltip.php 2008-04-03 15:10:00 UTC (rev 2333)
@@ -38,7 +38,7 @@
var mouseMoves=0;
var tooltipWin=null;
-var point;
+var point, tt_rpt;
var numberOfFinishedAjaxCalls = 0;
buttonWfs_toDigitize_on ="0";
@@ -48,6 +48,16 @@
}).mouseout(function(){mouseMoves=0;});
});
+eventAfterMapRequest.register(function(){
+ if(!tooltipWin||!tooltipWin.isVisible())
+ return;
+ point = realToMap("mapframe1",tt_rpt);
+ x=point.x+parseInt(document.getElementById("mapframe1").style.left);
+ y=point.y+parseInt(document.getElementById("mapframe1").style.top);
+
+ tooltipWin.set({left:x,top:y});
+});
+
eventMouseMove.register(function(event){
mb_getMousePos(event,"mapframe1");
// if(tooltipWin&&tooltipWin.isVisible()&&(Math.abs(clickX-point.x)>15||Math.abs(clickY-point.y)>15))
@@ -73,13 +83,15 @@
y=point.y+parseInt(document.getElementById("mapframe1").style.top);
if(tooltipWin&&tooltipWin.isVisible())
tooltipWin.destroy();
+ tt_rpt = mapToReal("mapframe1", point);
tooltipWin = new mb_popup({title:searchPopupTitle,html:createListOfGeometries(),width:270,height:150,balloon:true,left:x,top:y});
tooltipWin.show();
}
function requestWfs(){
point = new Point(clickX, clickY);
-
+
+
var ind = getMapObjIndexByName("mapframe1");
var db_wfs_conf_id = [];
js_wfs_conf_id = [];
More information about the Mapbender_commits
mailing list