// JavaScript Document

function addText(targetElement, text)
{
	var newtext = document.createTextNode(text);
	var p = document.createElement("p");
	p.appendChild(newtext);
	var target = document.getElementById(targetElement);
	target.appendChild(p);
}

//Create a div with an id
function createDiv(id)
{
	 var s = document.createElement("div");
	 s.id = id;
	 return s;
}

//Insert Content
function insertAfter(newElement, tElement)
{
	var targetElement = document.getElementById(tElement);
	if(targetElement)
	{
	  var parent = targetElement.parentNode;
	  if(parent.lastChild == targetElement)
	  {
		parent.appendChild(newElement);
	  }
	  else
	  {
	 	parent.insertBefore(newElement, targetElement.nextSilbling);
	  }
	}
	//No tElement enter then add to body
	else
	{
		document.body.appendChild(newElement);
	}
}


//Gets the page constraints
//@param: Boolean
function getPageSize(s)
{
	if(s == true)
	{
		return  window.innerWidth || (document.documentElement && document.documentElement.clientWidth) || document.body.clientWidth;
	}
	else
	{
		return  window.innerHeight || (document.documentElement && document.documentElement.clientHeight) || document.body.clientHeight;
	}
}

//Gets the scroll positions
//@param: Boolean
function getScrollPos(s) 
{
	var docElem = document.documentElement;
	if(s==true)
	{
		return  document.body.scrollLeft || window.pageXOffset || (docElem && docElem.scrollLeft);
	}
	else
	{
		return document.body.scrollTop || window.pageYOffset || (docElem && docElem.scrollTop);
	}
}


//Gets an objects offsets
//@param {Object} obj
function getElementSize(obj, s)
{
	if(s==true)
	{
		return  obj.offsetWidth || obj.style.pixelWidth;
	}
	else
	{
		return  obj.offsetHeight || obj.style.pixelHeight;
	}
}


//Centers an object
//@param {Object} obj
function center(elementID)
{
    //var obj = document.getElementById(elementID);
	var obj = elementID;
	var pageSizeWidth = getPageSize(true);
	var pageSizeHeight = getPageSize(false);
	var elementWidth = getElementSize(obj, true);
	var elementHeight = getElementSize(obj, false);
	var scrollPosX = getScrollPos(true);
	var scrollPosY = getScrollPos(false);
    var x = Math.round((pageSizeWidth - elementWidth) / 2 + scrollPosX);
    var y = Math.round((pageSizeHeight- elementHeight) / 2 + scrollPosY);
    obj.style.left = x + 'px';
    obj.style.top = y + 'px';
}

//XHTML valid external links
function externalLinks()
{
	if (!document.getElementsByTagName) return;
	var anchors = document.getElementsByTagName("a");
	for (var i=0; i<anchors.length; i++)
	{
		var anchor = anchors[i];
		if (anchor.getAttribute("href") && anchor.getAttribute("rel") == "external")
		{
			anchor.target = "_blank";
		}
	}
}

addLoadEvent(externalLinks);


function scrollTo(elementToScroll)
{
	var element = document.getElementById(elementToScroll);
	
	var yPos = getElementYpos(element);
	var scrollY = getScrollPos(false);
	
	console.log(yPos);
	console.log(scrollY);
}

function getElementYpos(elementID)
{
	var ypos = elementID.offsetTop
	if (elementID.offsetParent) 
	{
		while (elementID = elementID.offsetParent) 
		{
			ypos += elementID.offsetTop;
		}
	}
	return ypos
 }
	
/*
function addClass(elementID, value)
{
	var e = document.getElementById(elementID);
	
	if(!e.className)
	{
		e.className = value;
	}
	else
	{
		var newClassName = e.className;
		newClassName += " ";
		newClassName += value;
		e.className = newClassName;
	}
}
*/
//AnimateElement with ease
function moveElement(elementID, final_x, final_y, interval)
{
	if(!document.getElementById) return false;
	if(!document.getElementById(elementID)) return false;
	var element = document.getElementById(elementID);

	
	if(element.movement)
	{
	  clearTimeout(element.movement);	
	}
	
	
	var xpos = parseInt(element.style.left);
	var ypos = parseInt(element.style.top);
	//Check to make sure element has reached destination
	if(xpos == final_x && ypos == final_y)
	{
		return true;
	}
	if(xpos < final_x)
	{
		var dist = Math.ceil((final_x - xpos)/10);
		xpos = xpos + dist;
	}
	if(xpos > final_x)
	{
		var dist = Math.ceil((xpos - final_x)/10);
		xpos = xpos - dist;
	}
	if(ypos < final_y)
	{
		var dist = Math.ceil((final_y - ypos)/10);
		ypos = ypos + dist;
	}
	if(ypos > final_y)
	{
		var dist = Math.ceil((ypos - final_y)/10);
		ypos = ypos - dist;
	}
	element.style.left = xpos + "px";
	element.style.top = ypos + "px";
	var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
	element.movement = setTimeout(repeat, interval);
}


// convert the color to rgb from hex
function hexToRGB(c)
{
	var color = c;
	if(c.indexOf('#') != -1)
	{
		var temp = c.split('#');
		color = temp[1];
	}
	var rgb = [parseInt(color.substring(0,2),16), parseInt(color.substring(2,4),16), parseInt(color.substring(4,6),16)];
	return rgb;
}

//Color FADE
//@param id: elementID
//  element: background, color, border
//      end: contains
//    steps: 25
//	  speed: 30
//highlight: true - if you want it to fade back out
function colorFade(id, element, end, steps, speed, highlight)
{
  var start,startrgb,endrgb,er,eg,eb,step,rint,gint,bint,step, originalColor;
  var target = document.getElementById(id);
  steps = steps || 20;
  speed = speed || 20;
  //clear interval
  if(target.timer)
  {
  	clearInterval(target.timer);
  }
  //Save some default colors here
  if(end == 'warning')
  {
	  endrgb = hexToRGB('f9bcbc'); 
  }
  else if(end == 'success')
  {
	  endrgb = hexToRGB('A2F26C')
  }
  else if(end == 'highlight')
  {
	  endrgb = hexToRGB('FFFF9C')
  }
  else
  {
	  //Custom color
	  endrgb = hexToRGB(end);
  }
    
  er = endrgb[0];
  eg = endrgb[1];
  eb = endrgb[2];
  if(!target.r) 
  {
    //Check what were fading
	if(element == 'background')
	{
		start = target.style.backgroundColor;
    }
	else if(element == 'border')
    {
		start = target.style.borderColor;
    }
	else
	{
		start = target.style.color;
    }
	//Check incase undefined or whatever
	if (start == undefined || start == "" || start == "transparent") 
	{
		start = "#FFFFFF";
	}
	
	if(highlight == true)
	{
		originalColor = start;
	}
	else
	{
	    originalColor = false;
	}
	
	startrgb = hexToRGB(start);
    r = startrgb[0];
    g = startrgb[1];
    b = startrgb[2];
    target.r = r;
    target.g = g;
    target.b = b;
  }
  rint = Math.round(Math.abs(target.r-er)/steps);
  gint = Math.round(Math.abs(target.g-eg)/steps);
  bint = Math.round(Math.abs(target.b-eb)/steps);
  if(rint == 0) { rint = 1 }
  if(gint == 0) { gint = 1 }
  if(bint == 0) { bint = 1 }
  target.step = 1;
  target.timer = setInterval( function() { animateColor(id,element,steps,er,eg,eb,rint,gint,bint,originalColor) }, speed);
}

// incrementally close the gap between the two colors //
function animateColor(id,element,steps,er,eg,eb,rint,gint,bint,originalColor)
{
	var target = document.getElementById(id);
    //Clear the timeout if finished
    if(target.movement)
    {
	  clearTimeout(target.movement);
    }
  
    var color;
    if(target.step <= steps)
    {
     var r = target.r;
     var g = target.g;
     var b = target.b;
     //Work out tints
	if(r >= er)
	{
		r = r - rint;
    }
	else
	{
		r = parseInt(r) + parseInt(rint);
    }
    if(g >= eg)
	{
		g = g - gint;
    }
	else
	{
		g = parseInt(g) + parseInt(gint);
    }
    if(b >= eb) 
	{
		b = b - bint;
    }
	else
	{
		b = parseInt(b) + parseInt(bint);
    }
    color = 'rgb(' + r + ',' + g + ',' + b + ')';
    
	//What element to style
	if(element == 'background')
	{
		target.style.backgroundColor = color;
    }
	else if(element == 'border')
	{
		target.style.borderColor = color;
    }
	else
	{
		target.style.color = color;
    }
	
    target.r = r;
    target.g = g;
    target.b = b;
    target.step = target.step + 1;
  }
  else
  {
    clearInterval(target.timer);
    color = 'rgb(' + er + ',' + eg + ',' + eb + ')';
    if(element == 'background')
	{
		target.style.backgroundColor = color;
    } 
	else if(element == 'border')
	{
		target.style.borderColor = color;
    }
	else
	{
		target.style.color = color;
    }
	if(originalColor != false)
	{
		//If highlight is set then we wait 1 second and undo
		var s = "colorFade('"+id+"','"+element+"','"+originalColor+"',"+25+","+30+","+false+")";
		target.movement = setTimeout(s, 1000);
	}
	else
	{
		clearTimeout(target.movement);
	}
  }
}

function setOpacity(e, o)
{
	var element = document.getElementById(e);
	element.style.opacity = (o / 100);
	element.style.MozOpacity = (o / 100);
	element.style.KhtmlOpacity = (o / 100);
	element.style.filter = "alpha(opacity=" + o + ")";
	element.alpha = o;
	if(o == 0)
	{
		element.style.display = 'none';
	}
	else
	{
		element.style.display = "block";
	}
}

function setOpac(elementID, opacityToFade, interval, opactiy, timer)
{
	var element = document.getElementById(elementID);
	//element.alpha = opactiy;
	if(opactiy == 100)
	{
	  element.style.opacity = 1;
	  element.style.MozOpacity = 1;
	  element.style.KhtmlOpacity = 1;
	  element.style.filter = "alpha(opacity=" + 100 + ")";
	  element.alpha = 100;
	}
	else
	{
	  element.style.opacity = (opactiy / 100);
	  element.style.MozOpacity = (opactiy / 100);
	  element.style.KhtmlOpacity = (opactiy / 100);
	  element.style.filter = "alpha(opacity=" + opactiy + ")";
	  element.alpha = opactiy;
	}
	if(timer == "" || timer == null)
	{
		changeOpac(elementID, opacityToFade, interval);
	}
	else
	{
		timer = timer * 1000;
		var s = "changeOpac('"+elementID+"','"+opacityToFade+"','"+interval+"')";
		element.newTimer = setTimeout(s, timer);
	}
}

//AnimateElement with ease
function changeOpac(elementID, opacityToFade, interval)
{
	//Get Element
	var element = document.getElementById(elementID);
	//Clear if finished
	if(element.fade)
	{
	  clearTimeout(element.fade);	
	}
	var o = element.alpha;
	//console.log("o = "+o+"/"+opacityToFade);
	//Check to make sure element has reached destination
	if(o == opacityToFade)
	{
		if(opacityToFade == 0)
		{
			element.style.display = "none";
		}
		else
		{
			element.style.display = "block";
		}
		clearTimeout(element.fade);	
		return true;
	}
	else
	{
		if(o < opacityToFade)
		{
			var dist = Math.ceil((opacityToFade - o)/10);
			o = o + dist;
		}
		if(o > opacityToFade)
		{
			var dist = Math.ceil((o - opacityToFade)/10);
			o = o - dist;
		}
		element.style.opacity = (o / 100);
		element.style.MozOpacity = (o / 100);
		element.style.KhtmlOpacity = (o / 100);
		element.style.filter = "alpha(opacity=" + o + ")";
		element.alpha = o;
		
		var repeat = "changeOpac('"+elementID+"',"+opacityToFade+","+interval+")";
		element.fade = setTimeout(repeat, interval);
	}
}



function slideElementIn(elementID, d)
{
	var element = document.getElementById(elementID);
	if(d == 1)
	{
		if(element.timer)
		{
	  		clearInterval(element.timer);	
		}
		
		if(element.hideTimer)
		{
	  		clearInterval(element.hideTimer);	
		}
		
		//First check the element has anything set
		if(!element.maxh)
		{
			element.style.display = 'block';
			element.style.height = 'auto';
			//maxh is as far we want to go
			element.maxh = element.offsetHeight;
			element.style.height = '0px';
		}
		if(element.style.opacity == "")
		{
			element.style.opacity = 0;
		}
		if(element.style.overflow == "")
		{
			element.style.overflow = 'hidden';
		}
		
		element.style.display = 'block';
		//clearTimeout(element.hideTimer);
		
		if(element.offsetHeight > element.maxh)
		{
			clearInterval(element.timer);
			return;
		}
		else
		{
			//If has no maxHieght set to 0
			customeDoSlide(element,1, element.offsetHeight);
			element.timer = setInterval(function(){slideElementIn(elementID,1)}, 10);
			//element.timer = setInterval(function(){customeDoSlide(element,1, element.offsetHeight)}, 15);
		}
	}
	else
	{
		if(element.timer)
		{
	  		clearInterval(element.timer);	
		}
		
		if(element.hideTimer)
		{
	  		clearInterval(element.hideTimer);	
		}
		//
		if(element.style.overflow == "")
		{
			element.style.overflow = 'hidden';
		}
		//
		if(element.offsetHeight < 22)
		{
			clearInterval(element.hideTimer);
			element.style.display = 'none';
			return;
		}
		else
		{
			//If has no maxHieght set to 0
			customeDoSlide(element,-1, element.offsetHeight);
			element.hideTimer = setInterval(function(){slideElementIn(elementID,-1)}, 10);
			//element.timer = setInterval(function(){customeDoSlide(element,1, element.offsetHeight)}, 15);
		}
	}
}

function slideElementToggle(elementID)
{
	var element = document.getElementById(elementID);
	if(element.style.display == 'none')
	{
		slideElementIn(elementID, 1);
	}
	else if(element.style.display == "block")
	{
		slideElementIn(elementID, -1);
	}
	else
	{
		console.log("Not been set");
	}
}

function customeDoSlide(elementID, d, newHeight)
{
	var h = newHeight;
	//get currentHeight
	//offsetHeight = Height of an element relative to the element's offsetParent. 
	
	//FInd out what direction to slide in
	if(d == 1)
	{
		//h ++;
		var dist = Math.ceil((h - elementID.maxh)/10);
		h = h - dist;
		elementID.style.height = h + "px";
		if(h <= 100)
		{
		  	elementID.style.opacity = (h / 100)/2;
    	  	elementID.style.MozOpacity = (h / 100)/2;
    	  	elementID.style.KhtmlOpacity = (h / 100)/2;
    	  	elementID.style.filter = "alpha(opacity=" + h/2 + ")";
		  	elementID.alpha = h/2;
		}
		else
		{
		 	elementID.style.opacity = 1;
    	  	elementID.style.MozOpacity = 1;
    	  	elementID.style.KhtmlOpacity = 1;
    	  	elementID.style.filter = "alpha(opacity=" + 100 + ")";
		  	elementID.alpha = 100;
		}
	}
	else
	{
		var dist = Math.ceil((h - 0)/10);
		h = h - dist;
		//h = h - 5;
		elementID.style.height = h + "px";
		elementID.style.opacity = (h / 100);
    	elementID.style.MozOpacity = (h / 100);
    	elementID.style.KhtmlOpacity = (h / 100);
    	elementID.style.filter = "alpha(opacity=" + h + ")";
		elementID.alpha = h;
	}
}



//Lightbox
function showOverlay(fadeIn, fadeAmount, func)
{
	//check to make sure element is not already created
	var overlay = document.getElementById('overlay');
	
	if(overlay == null || overlay == undefined || overlay == "")
	{
		//console.log("create element");
		//create a new div for the background
		var lightBox = createDiv('overlay');
		//insert bottom of body 
		insertAfter(lightBox);
		
		//Find element
		var overlay = document.getElementById('overlay');
		//insertAfter(overlay, 'header');
	}
	
	overlay.style.left = '0px';
	overlay.style.top = '0px';
	overlay.style.position = 'absolute';
	overlay.style.width = getPageSize(true) + 'px';
	overlay.style.height = getPageSize(false) + getScrollPos(false) + 'px';
	overlay.style.backgroundColor = 'black';
	overlay.style.display = 'block';
	overlay.style.zIndex = '400';
	//If fadeIn is true then fade
	if(fadeIn == true)
	{
		setOpac('overlay', fadeAmount, 25, 0);
	}
	else
	{
		setOpacity('overlay', fadeAmount);
	}
	//If you want to pass own fucntion in then do so
	if(func != null)
	{
		overlay.onclick = function()
		{
	  	  func();
		}
		
	}
	else
	{
		//Click outside the box and hide
		overlay.onclick = function()
		{
	  	hideOverlay('overlay', fadeIn, fadeAmount);
		}
	}
}

function hideOverlay(overlay, fadeIn, fadeAmount)
{
	//var overlay = getElementById(element);
	if(fadeIn == true)
	{
		setOpac('overlay', 0, 25, fadeAmount);
	}
	else
	{
		setOpacity('overlay', 0);
	}
}

function getActiveStyleSheet() {
	var link = document.getElementsByTagName("link");
	var count = link.length;
	var i, a;
	
	for(i=0; i < count; i++) {
		a = link[i];
		
		if (a.getAttribute("rel") =="stylesheet" && !a.disabled) {
				console.log(a.getAttribute("title"));
		}
	}
 	/*if(a.getAttribute("rel") == "stylesheet" && a.getAttribute("title") && !a.disabled) {
 		console.log(a.getAttribute("title")); //.indexOf("style") != -1
 	} else {
 		console.log(a.getAttribute("title"));
 	}
  
  return null;*/
}