QuickWMS-Extension/WMSbrowsers.js
GISWiki - Das freie Portal für Geoinformatik (GIS)
Version vom 19. August 2005, 21:11 Uhr von 84.137.174.26 (Diskussion)
/*
/*
* Project : quickWMS - Generic JavaScript WMS Client
* File : WMSbrowsers.js
* Author : Pedro Pereira Gonçalves
* email : pedro.goncalves@esa.int or pedro@inovagis.org
* Version : 0.1
* Description: Defines browser types, writes the HTML, and access to layers.
* Any addition of browser support should be added here
* Please read coderules.txt before making any change.
* It also Defines the styles and text constants for this application.
* Tested on : Netscape 7.0, IE 5.5, IE 6.0, Netscape 4.7(only functions marked with *NS47*)
* Last Change : 2003-04-23
* Dependencies : none
* Future Developments : more browser types.. ?
* License : OpenSource (check license.txt in the same directory)
* History :
2003-04-23 : Documentation added
2003-03-20 : File Created
* Objects : browser - defines the type of browser
* Functions : openLayer, closeLayer, createLayer, getLayer,
*/
/// images and paths
var path_skin = "http://www.giswiki.org/extensions/quickwms/blue_skin/";
var empty_IMG = path_skin + "empty.gif";
var waiting_IMG = path_skin + "waiting.gif";
var white_IMG = path_skin + "white.gif";
// mouse constants
var mouseGrid=5;
// user interface texts - English version
var TXT_OnRequestingData = "Requesting data ...";
var TXT_Updated = " updated ...";
var TXT_WaitingFor = " Waiting for ";
var TXT_Requests = " requests ";
var TXT_Layer = "Layer";
var TXT_ReceivedLayer = "was correctly downloaded";
var TXT_Request = " request ";
var TXT_LayerUpdated = "All layers retrieved.<BR> Updating ...";
var TXT_QueryDataReceived = "Query information was received...";
var TXT_UserCancel = "Request was canceled by user";
var TXT_onChange = "onChange";
// opacity Thresholds
var highLightThreshold = 40;
var statusThreshold = 60;
// predefined STYLES
var WMS_selectBorder="border-style:dashed;border-width:5;border-color:#C0C0C0";
var WMS_zoomBorder="border-style:dashed;border-width:2;border-color:#C0C0C0";
var browser = new Object("browser");
// Detect browser & version
browser.isIE60 = (navigator.userAgent.indexOf("MSIE 6.0") >= 0);
browser.isIE55 = (navigator.userAgent.indexOf("MSIE 5.5") >= 0);
browser.isIE50 = (navigator.userAgent.indexOf("MSIE 5.0") >= 0);
browser.isMoz09 = ((navigator.userAgent.indexOf("Mozilla/5.0") >= 0) &&
(navigator.userAgent.indexOf("Netscape") < 0) &&
(navigator.userAgent.indexOf("rv:0.9") >= 0));
browser.isMoz10 = ((navigator.userAgent.indexOf("Mozilla/5.0") >= 0) &&
(navigator.userAgent.indexOf("Netscape") < 0) &&
(navigator.userAgent.indexOf("rv:1.0") >= 0));
//2003-10-13:pedro - change this to catch mozilla 1.4.1 or Gecko .. I've lost the logic behind these names and versions
browser.isMoz50 = ((navigator.userAgent.indexOf("Mozilla/5.0") >= 0) &&
(navigator.userAgent.indexOf("Netscape") < 0) &&
(navigator.userAgent.indexOf("Gecko") > 0));
if (browser.isMoz50) { browser.isMoz10=true}
browser.isNS6 = (navigator.userAgent.indexOf("Netscape6") >= 0);
//2003-10-13:pedro - change this to catch netscape 7.1
browser.isNS7 = (navigator.userAgent.indexOf("Netscape/7.") >= 0);
//browser.isNS7 = (navigator.userAgent.indexOf("Netscape/7.0") >= 0);
browser.isNS47x = document.layers;
// Detect functionality grouping
browser.isDOM = (browser.isNS7 || browser.isNS6 || browser.isMoz09 || browser.isMoz10 || browser.isMoz50 || browser.isIE60) && document.getElementById;
browser.isOldNS = (browser.isNS47x);
browser.isOldIE = (browser.isIE55 || browser.isIE50) && document.all;
// Detect browser name
browser.name = "Unknown";
if (browser.isIE60)
browser.name = "Internet Explorer 6.0";
if (browser.isIE55)
browser.name = "Internet Explorer 5.5";
if (browser.isIE50)
browser.name = "Internet Explorer 5.0";
//2003-10-13:pedro - to include netscape 7.1
if (browser.isNS7)
browser.name = "Netscape 7.x";
// browser.name = "Netscape 7.0";
if (browser.isNS6)
browser.name = "Netscape 6.0";
if (browser.isNS47x)
browser.name = "Netscape Navigator 4.7x";
if (browser.isMoz09)
browser.name = "Mozilla 0.9x";
if (browser.isMoz10)
browser.name = "Mozilla 1.0x";
// ************* openLayer *************
// Opens a DHTML layer with the specified name *NS47*
function openLayerR(name, parentClass, addStyle, left, top, width, height, visible) //
{
var layer;
if (browser.isOldNS)
{
if (addStyle.indexOf('inherit')>0) document.writeln('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="inherit" class="'+parentClass+'">');
else document.writeln('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="' + (visible ? '"show"' : '"hide"') + ' class="'+parentClass+'">');// style="'+addStyle +'">');
}
else
{
document.write('<div id="' + name + '" class="'+parentClass+'" style="position:relative; left:' + left + 'px; top:' + top + 'px; width:' + width + 'px; height:' + height + 'px;' + ' visibility:' + (visible ? 'visible;' : 'hidden;') + ';'+addStyle+'">');
// attention if the styles in IE the border is inside the layer while in netscape is outside
// so we have to if a border is present in the style we should enlarge the layer
if (browser.isIE55 || browser.isIE60) setLayerPos(name,left,top,width,height);
}
}
function openLayer(name, parentClass, addStyle, left, top, width, height, visible) //
{
var layer;
if (browser.isOldNS)
{
if (addStyle.indexOf('inherit')>0) document.writeln('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="inherit" class="'+parentClass+'">');
else document.writeln('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="' + (visible ? '"show"' : '"hide"') + ' class="'+parentClass+'">');// style="'+addStyle +'">');
}
else
{
document.write('<div id="' + name + '" class="'+parentClass+'" style="position:absolute; left:' + left + 'px; top:' + top + 'px; width:' + width + 'px; height:' + height + 'px;' + ' visibility:' + (visible ? 'visible;' : 'hidden;') + ';'+addStyle+'">');
// attention if the styles in IE the border is inside the layer while in netscape is outside
// so we have to if a border is present in the style we should enlarge the layer
if (browser.isIE55 || browser.isIE60) setLayerPos(name,left,top,width,height);
}
}
function getLayerHtml(name, parentClass, addStyle, left, top, width, height, visible) //
{
var layer;
var content="";
if (browser.isOldNS)
{
if (addStyle.indexOf('inherit')>0) content+=('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="inherit" class="'+parentClass+'">');
else content+=('<layer name="' + name + '" left="' + left + '" top="' + top + '" width="' + width + '" height="' + height + '" visibility="' + (visible ? '"show"' : '"hide"') + ' class="'+parentClass+'">');// style="'+addStyle +'">');
}
else
{
content+=('<div id="' + name + '" class="'+parentClass+'" style="position:absolute; left:' + left + 'px; top:' + top + 'px; width:' + width + 'px; height:' + height + 'px;' + ' visibility:' + (visible ? 'visible;' : 'hidden;') + ';'+addStyle+'">');
// attention if the styles in IE the border is inside the layer while in netscape is outside
// so we have to if a border is present in the style we should enlarge the layer
//if (browser.isIE55 || browser.isIE60) setLayerPos(name,left,top,width,height);
}
return content;
}
function writeIMG(name, src, left, top, width, height,styles){
if (browser.isOldNS) {
// have to include a layer tag in Netscape 4.7 to define image position
var contentIMG='<layer id="p'+name+'" left="' + left + '" top="' + top + '" width="' + width + '" height="'+height+'" visibility="inherit">';
contentIMG+='<img border="1" name="'+name+'" width="'+width+'" height="'+height+'" src="'+src+'" style="">';
contentIMG+='</layer>';
document.write(contentIMG);
return (findLayer('p'+name,document).document.images[0]);
}
else{
document.write("<img name='"+name+"' style='"+styles+";position:absolute;top:"+top+";left:"+left+"' width="+width+" height="+height+" src='"+src+"'>");
return document.images[name];
}
}
function GetImgHTML(name, src, left, top, width, height,styles){
if (browser.isOldNS) {
// have to include a layer tag in Netscape 4.7 to define image position
var contentIMG='<layer id="p'+name+'" left="' + left + '" top="' + top + '" width="' + width + '" height="'+height+'" visibility="inherit">';
contentIMG+='<img border="1" name="'+name+'" width="'+width+'" height="'+height+'" src="'+src+'" style="">';
contentIMG+='</layer>';
return contentIMG;
}
else{
var contentIMG="<img name='"+name+"' style='"+styles+";position:absolute;top:"+top+";left:"+left+"' width="+width+" height="+height+" src='"+src+"'>";
return contentIMG;
}
}
// ************* closeLayer *************
// Closes a DHTML layer *NS47*
function getCloseLayerHTML()
{ if (browser.isOldNS) {return '</layer>';}
else {return '</div>';}
}
function closeLayer()
{ if (browser.isOldNS) {document.writeln('</layer>');}
else {document.write('</div>');}
}
// ************* createLayer *************
// Create a DHTML layer with the specified name
function createLayer(name, left, top, width, height, visible, content)
{
var layer;
if (browser.isOldNS)
{
document.write('<layer bgcolor="#CC00EE" name="' + name + '" left=' + left + ' top=' + top + ' width=' + width + ' height=' + height + ' visibility=' + (visible ? '"show"' : '"hide"') + '>');
document.write(content);
document.write('</layer>');
layer = getLayer(name);
layer.width = width;
layer.height = height;
}
else
{
document.write('<div id="' + name + '" style="position:absolute; overflow:none; left:' + left + 'px; top:' + top + 'px; width:' + width + 'px; height:' + height + 'px;' + ' visibility:' + (visible ? 'visible;' : 'hidden;') + '">');
document.write(content);
document.write('</div>');
}
}
// ************* getLayer *************
// Return a reference to the named layer. Null if the layer cannot be found.
function getLayer(name)
{
var layer = null;
if (browser.isOldNS)
layer = findLayer(name, parent.document);
if (browser.isOldIE)
layer = eval('document.all.' + name);
if (browser.isDOM)
layer = document.getElementById(name);
if (!layer)
{
layer = document.getElementById(name);
}
return layer;
}
// This method is specifically for old NS versions that have the document.layers
// structure. It will look for the named layer in the specified document, and
// if there are layers in the layers, it will search those recursively.
function findLayer(name, doc)
{
var i, layer;
//alert("name:" + name);
for (i = 0; i < doc.layers.length; i++)
{
layer = doc.layers[i];
//alert(layer.name);
if (layer.name == name)
return layer;
if (layer.document.layers.length > 0)
{
//alert("go find " +name);
layer = findLayer(name, layer.document);
if (layer != null)
return layer;
}
}
return null;
}
// ************* hideLayer *************
// Hides the layer with the specified layer name
function hideLayer(layerName)
{
var layer = getLayer(layerName);
if (browser.isOldNS)
layer.visibility = "hide";
if (browser.isOldIE || browser.isDOM)
layer.style.visibility = "hidden";
}
// ************* showLayer *************
// Shows the layer with the specified layer name
function showLayer(layerName)
{
var layer = getLayer(layerName);
if (browser.isOldNS)
layer.visibility = "show";
if (browser.isOldIE || browser.isDOM)
layer.style.visibility = "visible";
}
//************ getVisibility ************
// Returns "visible" if the layer is presently visible, or "hidden" if it is hidden
function getVisibility(layerName)
{
var layer = getLayer(layerName);
var visStatus = "visible";
if (browser.isOldNS)
{
if (layer.visibility == "show")
visStatus = "visible";
if (layer.visibility == "hide")
visStatus = "hidden";
}
if (browser.isOldIE || browser.isDOM)
visStatus = layer.style.visibility;
return visStatus;
}
//************ isVisible ************
// Returns true if the specified layer is visible; false otherwise
function isVisible(layerName)
{return (getVisibility(layerName) == "visible");}
//************ setLayerPos ************
// Sets the position and size of a specified layer
function setLayerPos(layerName,left, top, width, height)
{
if (browser.isOldNS){
}
else{
layer = getLayer(layerName).style;
if (left) layer.left=left;
if (top) layer.top=top;
if (width) layer.width=width;
if (height) layer.height=height;
// check if a border exists .. if so then add the border size to the layer width
if (browser.isIE55 || browser.isIE60){
if (layer.borderWidth) {
layer.width = width +parseInt(layer.borderWidth)*2;
layer.height = height+parseInt(layer.borderWidth)*2;
}
}
}
}
// ************* setLayerHTML *************
// Sets the HTML content of the layer with the specified layer name
function setLayerHTML(layerName, content)
{
var layer = getLayer(layerName);
if (browser.isOldNS)
{
layer.document.open();
layer.document.write(content);
layer.document.close();
}
if (browser.isOldIE || browser.isDOM)
{
layer.innerHTML = content;
}
}
//************ assignMouseEvent ************
// Assigns an event handler for mouseover events
// Valid values for eventName are : mouseout, mouseover, mousemove, mouseup, mousedown
function assignMouseEvent(layerName, eventName, eventFcn, isInCapturePhase)
{
var layer = getLayer(layerName);
if ((browser.isNS6 || browser.isNS7 || browser.isMoz09 || browser.isMoz10))
{layer.addEventListener(eventName, eventFcn, isInCapturePhase);}
if (browser.isIE60 || browser.isIE55 || browser.isIE50)
{layer.attachEvent("on"+eventName, eventFcn);}
if (browser.isNS47x)
{
// STILL NOT TESTED ON NETSCAPE 4.7
//img=layer.images;//[layerName];
//layer = getLayer(layerName).document.layers["p"+layerName+"Top"].document.images[0];
//alert_Obj(layer.document.layers["p"+layerName+"Top"]);//.document);
switch (eventName)
{
case "mouseout":
// document.captureEvents(Event.MOUSEOUT);
//layer.onmouseout = eventFcn;
layer.reference.topImage.onmouseout=eventFcn;
break
case "mouseover":
//layer.captureEvents(Event.MOUSEOVER);
//layer.onmouseover = eventFcn;
layer.reference.topImage.mouseover=eventFcn;
break
case "mousemove":
//alert(layer.reference);
layer.document.captureEvents(Event.MOUSEMOVE);
layer.reference.topImage.onmousemove=eventFcn;
break
case "mouseup":
layer.reference.topImage.onmouseup=eventFcn;
break
case "mousedown":
layer.reference.topImage.onmousedown=eventFcn;
break
}
//*/
}
}
//************ stopEventPropagation ************
// Stops events propagation
function stopEventPropagation(event)
{
if (browser.isIE50 || browser.isIE55 || browser.isIE60)
{
window.event.cancelBubble = true;
window.event.returnValue = false;
}
else if (browser.isNS6 || browser.isNS7 || browser.isMoz09 || browser.isMoz10 || browser.isMoz50)
{
event.stopPropagation();
event.preventDefault();
}
}
// ****************************************************************
// ********************** Auxiliary Functions *********************
// ****************************************************************
function areEqual(var1, var2){
var rr=true;
for (i in var1){if (var1[i]!=var2[i]) rr=false}
return rr;
}
function copy(source, dest){
for (i in source){dest[i]=source[i]}
return true;
}
function layerPoint(layer,X,Y)
{ this.X=X;
this.Y=Y;
this.layer=layer;
}
function getImageXY(e)
{
if (browser.isIE50 || browser.isIE55 || browser.isIE60)
e = window.event;
if (browser.isOldNS)
{
mouseX=e.pageX;
mouseY=e.pageY;
}
else
{
mouseX=e.clientX;
mouseY=e.clientY;
}
}
