QuickWMS-Extension/WMSbrowsers.js

/*
/*
* 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;
	}
}