﻿// -----------------------------------------------------------------------------------

//
//	Configuration
//

var jcWidth = 200;	
var bToggleEnabled = true;
var offSetObj = null;
var nudgeX = 0;

// -----------------------------------------------------------------------------------

var JSCropBox = Class.create();

JSCropBox.prototype = {
	
	// initialize()	
	initialize: function() {		    	
		if (!document.getElementsByTagName){ return; }
				
		
		var anchors = document.getElementsByTagName('div');            

		// loop through all anchor tags
		for (var i=0; i<anchors.length; i++){
			var anchor = anchors[i];			
			var relAttribute = String(anchor.getAttribute('rel'));			
			
			// use the string.match() method to catch 'JSCropBox' references in the rel attribute
			if ( relAttribute.toLowerCase().match('jscropbox') ){			    														
				//We now need to turn off the border if it's not needed
				var borderDiv = anchor;
				var image = anchor.childNodes[0].childNodes[0];								
				if(image != null && image.offsetWidth >= jcWidth)
				{
				    anchor.onmouseover = function () {myJSCropBox.hoverOn(this); return false;}				
				    anchor.onmouseout = function () {myJSCropBox.hoverOff(this); return false;}								    						        
			
			        if( BrowserDetect.browser == "Firefox" || BrowserDetect.browser == "Safari" )
				    {
				        borderDiv.style.width = jcWidth + 3 +"px";
				        borderDiv.style.height = "126px";
				    }				    				    
			
			        anchor.childNodes[0].style.marginLeft = "3px";
			        anchor.childNodes[0].style.marginRight = "0px";
			        anchor.childNodes[0].style.marginTop = "3px";
			        anchor.childNodes[0].style.marginBottom = "3px";						
			
			        var offSetX = 0;
			        var offSetY = 0;
			
			        if(offSetObj && BrowserDetect.browser == "Explorer")
			        {
			            offSetX = findPos(offSetObj)[0];
			            offSetY = findPos(offSetObj)[1];
			        }						        
			
			        borderDiv.style.borderColor = 'black';	    
				    borderDiv.style.left = findPos(borderDiv)[0] - (offSetX + nudgeX) + "px";				    				    
				    
				    if(BrowserDetect.browser == "Safari")
				        borderDiv.style.top = findPos(borderDiv)[1] - offSetY + 15 + "px";
				    else
				    {
				        borderDiv.style.top = findPos(borderDiv)[1] - offSetY + "px";				        				    				    
				    }
				}
			}
		}				
	},
	
	//
	//	start()
	//	Display overlay and JSCropBox. If image is part of a set, add siblings to imageArray.
	//
	hoverOn: function(borderDiv) {	    	
	    if(borderDiv.childNodes[0] != null && borderDiv.childNodes[0].childNodes[0] != null)
	    {	        	    	        	        	    
	        borderDiv.style.borderColor = '#EB1C24';
	    
	        if(bToggleEnabled)
	        {
	            if(borderDiv.parentNode != null)
	                borderDiv.parentNode.style.position = '';
	        
	            //Need to see the page size to see if i need to go left or not
	            var pageSize = getPageSize();
	            //W H SW, SH
	            var iWidth = parseInt(borderDiv.childNodes[0].childNodes[0].offsetWidth);	        
	            var iLeftPos = parseInt(borderDiv.style.left.replace("px",""));
    	            	        
	            var iEndOfImage = iLeftPos + iWidth;
	            if( iEndOfImage >= parseInt(pageSize[0]) )
	            {
	                //Collision
	                var iDelta = (iLeftPos + iWidth) - parseInt(pageSize[0]) + 15;
	                borderDiv.style.left = iLeftPos - iDelta + "px";	                
	            }	        	        	        	    	        	        
    	            	            	        
	            borderDiv.style.position = "absolute";
	            borderDiv.childNodes[0].style.marginRight = "3px";
    	            	        
	            if( BrowserDetect.browser == "Firefox" || BrowserDetect.browser == "Safari" )
	                borderDiv.style.width =  (iWidth + 6) + "px";
	            else
	                borderDiv.style.width =  iWidth + "px";	        	        
    	            	            	        
	            borderDiv.childNodes[0].style.width = iWidth + "px";
	            
	            if(typeof(SetPop) != "undefined")
	                SetPop(borderDiv);
	        }
	    }
	},
	
	//
	//	start()
	//	Display overlay and JSCropBox. If image is part of a set, add siblings to imageArray.
	//
	hoverOff: function(borderDiv) {
	    
	    if(borderDiv.childNodes[0] != null && borderDiv.childNodes[0].childNodes[0] != null)
	    {		        	        	           
	        borderDiv.style.borderColor = 'black';	                
            if(bToggleEnabled)
            {
                if(borderDiv.parentNode != null)
	                borderDiv.parentNode.style.position = 'relative';
            
                var iWidth = borderDiv.childNodes[0].childNodes[0].offsetWidth;	                	        
	            borderDiv.style.position = "";
	            borderDiv.childNodes[0].style.marginRight = "0px";
    	        
                if( BrowserDetect.browser == "Firefox" || BrowserDetect.browser == "Safari" )
		        {
		            borderDiv.style.width =  jcWidth + 6 + "px";
	                borderDiv.childNodes[0].style.width = jcWidth + 3 + "px";
		        }
		        else
		        {
	                borderDiv.style.width =  jcWidth + "px";
	                borderDiv.childNodes[0].style.width = jcWidth + "px";
	            }	            	            
	        }
	    }
	}
}

// ---------------------------------------------------

function findPos(obj) {
	var curleft = curtop = 0;    
    
    if (obj.offsetParent) {
        do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);                
    }
    
    return [curleft,curtop];
}

// ---------------------------------------------------

//
// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
//
function getPageSize(){
	
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}


	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}

var BrowserDetect = {
	init: function () {
		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
		this.version = this.searchVersion(navigator.userAgent)
			|| this.searchVersion(navigator.appVersion)
			|| "an unknown version";
		this.OS = this.searchString(this.dataOS) || "an unknown OS";
	},
	searchString: function (data) {
		for (var i=0;i<data.length;i++)	{
			var dataString = data[i].string;
			var dataProp = data[i].prop;
			this.versionSearchString = data[i].versionSearch || data[i].identity;
			if (dataString) {
				if (dataString.indexOf(data[i].subString) != -1)
					return data[i].identity;
			}
			else if (dataProp)
				return data[i].identity;
		}
	},
	searchVersion: function (dataString) {
		var index = dataString.indexOf(this.versionSearchString);
		if (index == -1) return;
		return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
	},
	dataBrowser: [
		{ 	string: navigator.userAgent,
			subString: "OmniWeb",
			versionSearch: "OmniWeb/",
			identity: "OmniWeb"
		},
		{
			string: navigator.vendor,
			subString: "Apple",
			identity: "Safari"
		},
		{
			prop: window.opera,
			identity: "Opera"
		},
		{
			string: navigator.vendor,
			subString: "iCab",
			identity: "iCab"
		},
		{
			string: navigator.vendor,
			subString: "KDE",
			identity: "Konqueror"
		},
		{
			string: navigator.userAgent,
			subString: "Firefox",
			identity: "Firefox"
		},
		{
			string: navigator.vendor,
			subString: "Camino",
			identity: "Camino"
		},
		{		// for newer Netscapes (6+)
			string: navigator.userAgent,
			subString: "Netscape",
			identity: "Netscape"
		},
		{
			string: navigator.userAgent,
			subString: "MSIE",
			identity: "Explorer",
			versionSearch: "MSIE"
		},
		{
			string: navigator.userAgent,
			subString: "Gecko",
			identity: "Mozilla",
			versionSearch: "rv"
		},
		{ 		// for older Netscapes (4-)
			string: navigator.userAgent,
			subString: "Mozilla",
			identity: "Netscape",
			versionSearch: "Mozilla"
		}
	],
	dataOS : [
		{
			string: navigator.platform,
			subString: "Win",
			identity: "Windows"
		},
		{
			string: navigator.platform,
			subString: "Mac",
			identity: "Mac"
		},
		{
			string: navigator.platform,
			subString: "Linux",
			identity: "Linux"
		}
	]

};
BrowserDetect.init();

function initJSCropBox() { myJSCropBox = new JSCropBox(); }
Event.observe(window, 'load', initJSCropBox, false);