QuickWMS-Extension/WMSbrowsers.js: Unterschied zwischen den Versionen

GISWiki - Das freie Portal für Geoinformatik (GIS)
Wechseln zu: Navigation, Suche
 
 
Zeile 1: Zeile 1:
 
<pre>/*
 
<pre>/*
 +
/*
 
* Project : quickWMS - Generic JavaScript WMS Client  
 
* Project : quickWMS - Generic JavaScript WMS Client  
 
* File : WMSbrowsers.js
 
* File : WMSbrowsers.js
Zeile 111: Zeile 112:
 
// ************* openLayer *************  
 
// ************* openLayer *************  
 
// Opens a DHTML layer with the specified name *NS47*
 
// Opens a DHTML layer with the specified name *NS47*
function openLayer(name, parentClass, addStyle, left, top, width, height, visible) //
+
function openLayerR(name, parentClass, addStyle, left, top, width, height, visible) //
 
{
 
{
 
   var layer;
 
   var layer;
Zeile 123: Zeile 124:
 
   {
 
   {
 
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+'">');
 
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
 
// 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
 
// so we have to if a border is present in the style we should enlarge the layer

Aktuelle Version vom 19. August 2005, 20:11 Uhr

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