/*
 Name: Jeeran's JS Framework;
 Built by: Fouad Masoud;
 Date: 22-09-2007
*/ 


/* =Add Load Event Function
	How to use:
		ex. addLoadEvent(functionName);
----------------------------------------------------- */
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

/* =Get Elemets By Class Name Function 
	How to use:
		ex. getElementsByClassName(document,"TagName","className");
----------------------------------------------------- */
function getElementsByClassName(oElm, strTagName, strClassName){
	var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
	var arrReturnElements = new Array();
	strClassName = strClassName.replace(/-/g, "\-");
	var oRegExp = new RegExp("(^|\s)" + strClassName + "(\s|$)");
	var oElement;
	for(var i=0; i<arrElements.length; i++){
		oElement = arrElements[i];
		if(oRegExp.test(oElement.className)){
			arrReturnElements.push(oElement);
		}
	}
	return (arrReturnElements)
}

/* =Prepare Tabs
	How to use:
		1- In the markup assign the class sectionTabs to any ul or ol.
	Tips:
		1- The Li elements must have A element inside them and only A elements.
		2- For this Script to work in the right way; two classes have to be added to the css that controls the page
		   .sectionTabs and .selected and handled there.
	Notes: This function works well, but needs some enhancement;
	Built: FM 22-09-2007
----------------------------------------------------- */
function changeTab(elem){
  
	var tabsContainer = elem.parentNode.parentNode;
	var classNm = tabsContainer.className;
	
	if (!classNm.match("sectionTabs")){
	    tabsContainer = elem.parentNode.parentNode.parentNode;
	}
	
	var links = tabsContainer.getElementsByTagName("li");
	for(i=0; i<links.length; i++){
		links[i].className = "";
	}
	elem.parentNode.className = "selected";

	var panels = tabsContainer.getElementsByTagName("a");
	for(i=0; i<panels.length; i++){
	    panelID=panels[i].getAttribute("href").split("#")[1];
	    document.getElementById(panelID).style.display = "none";
	}
	
	panelID = elem.getAttribute("href").split("#")[1];
	document.getElementById(panelID).style.display = "block"; 
}

/* =Simple Show Hide Function
	How to use:
		1- Use it with onclick, just place the function name "showHide" and the name of the element that you wish 
		   for the affect to be applied on. ex. onclick = "toggle("Banner");"
	TODO: Fix the onclick issue; it shouldnt be used in the markup
	Built: FM 24-09-2007
----------------------------------------------------- */
function toggle(obj) {
	var el = j$Obj(obj);
	if ( el.style.display != 'none' ) {
		el.style.display = 'none';
	}
	else {
		el.style.display = 'block';
	}
	return false;
}

/*
This toggles between the two given image urls.
*/
function toggleImage(ImageID, Image1, Image2)
{
    var Image = j$Obj(ImageID);
    if (Image.src == Image1)
    {
        Image.src = Image2;
    }
    else
    {
        Image.src = Image1;
    }
}

/* =Creat A popup
    How to use:
		1- just add the class popup to any link that u want to open as a popup, juat keep in-mind that the 
		url of the link should be the same url that will be loaded in the popup.
	TODO: Fixs the function to accept height and width parameters.
	Built: FM 24-09-2007
----------------------------------------------------- */
function popup() {
	if (!getElementsByClassName(document,"a","popup")) return false;
  	var links = getElementsByClassName(document,"a","popup");
  	for (var i=0; i<links.length; i++) {
    	links[i].onclick = function() {
			window.open(this.getAttribute("href"),"popup","width=320,height=480");
        	return false;
    	}
  	}
}
addLoadEvent(popup);

/* =Prepare Navigation
	Built: FM 30-09-2007
----------------------------------------------------- */
function showDropdown(elem){
    tm(elem);
}
function hasC(e,c) {
	return (e.className && e.className.indexOf(c)>-1);
};

function addC(e,c) {
	if (!hasC(e,c)){
		if (e.className) e.className += " " + c;
		else e.className = c;
	}
};

function remC(e,c) {
	if (hasC(e,c)) {
		var r = new RegExp("(^|\\s)" + c + "(\\s|$)");
		e.className = e.className.replace(r, "$2");
	}
};
function tm(el) 
{
    var p=el.parentNode;
    var d=document;
    function cl() {remC(p,'selected');d.onclick=null;}
    function sh() {d.onclick=cl;}
    if(hasC(p,'selected')) cl();
    else{
        addC(p,'selected');
        setTimeout(sh, 0);
        try {
            var u=(p.getElementsByTagName("UL")[1]), c=u.childNodes, w=u.clientWidth, e=u, x=0;  
        }
        catch (ig){}
    }
    return false;
}

/* =This will copy/move page elements between the source and target divs
    to move, set KeepOriginal = false, otherwise KeepOriginal = true
    Built by: Laith
    Moved by: FM
----------------------------------------------------- */    
function ThrowObjectInDiv(Object, SourceID, TargetID, KeepOriginal)
{
    var TargetDiv = j$Obj(TargetID);
    var SourceDiv = j$Obj(SourceID);   
  
    // If we want to keep the original, we need to make a copy of the object
    // Otherwise we just append the object itself to the new node and it will move.
    if(KeepOriginal)
    {
        var NewObject = Object.cloneNode(true);
        NewObject.id = Object.id + '-copy';
        TargetDiv.appendChild(NewObject);
    }
    else
    {
        var targetDivContent = TargetDiv.innerHTML;
        TargetDiv.innerHTML = "";
        TargetDiv.appendChild(Object);
        TargetDiv.innerHTML += targetDivContent;
    }
}


var TimeToFade = 1000.0;

function fade(eid)
{
  var element = document.getElementById(eid);
  if(element == null)
    return;
    
   
  if(element.FadeState == null)
  {
    if(element.style.opacity == null || element.style.opacity == '' 
       || element.style.opacity == '1')
      element.FadeState = 2;
    else
      element.FadeState = -2;
  }
    
  if(element.FadeState == 1 || element.FadeState == -1)
  {
    element.FadeState = element.FadeState == 1 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
  }
  else
  {
    element.FadeState = element.FadeState == 2 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}

function animateFade(lastTick, eid)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
  
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? '1' : '0';
    element.style.filter = 'alpha(opacity = ' + (element.FadeState == 1 ? '100' : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
	element.style.display = 'none';
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade;
  if(element.FadeState == 1)
    newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
  
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}

function changeTabs(elemId1,elemId2)
{
  var panel1 = $("#"+ elemId1).attr('href');
  var panel2 =  $("#"+ elemId2).attr('href');
  
    $("#"+ elemId2).removeClass("selected");
    $("#"+ elemId1).addClass("selected");
    

    show(panel1);
    hide(panel2);


}

