/*
 * AJAX - Toyota Glossary
 * By Agus Daud
 * Hothouse 2007
 * Last Modified 14 September 2007
 * Write base on Jquery 1.2 and JTip
 */
 
//on page load (as soon as its ready) call GlossaryTips_init

//Delay function Tooltips
function Tooltips (options) {
	if ( "undefined" != typeof Tooltips._instantiated) {
		return (Tooltips._instantiated);	
	}
	if ( "undefined" == typeof options) {
		options = {};	
	}
	this.delay = ("undefined" == typeof options.delay) ? 250 : options.delay;
	this.timeout = new Object();
	
	Tooltips._instantiated = this;
};

//Special for GCT
function GlossaryTips_init() {
	
	selectChanged(1);
	selectChanged(2);
	selectChanged(3);
	
	GlossaryTips_initGlobal();
	
}

function GlossaryTips_initGlobal() {
	
	var tooltip = new Tooltips();
	
	$("a.jTipx")
	.hover(function(e){
		
		if (!this.href.split('#')[1]) return;
		
		var popupid = this.id+'_popup';
		
		if (tooltip.timeout['#'+popupid]) {
			clearTimeout(tooltip.timeout['#'+popupid]);
			tooltip.timeout['#'+popupid] = null;
		}
		
		linkId = this.id;
		var de = document.documentElement;
		var w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
		var hasArea = w - getAbsoluteLeft(linkId);
		var clickElementy = getAbsoluteTop(linkId) - 196; //set y position
		var arrowOffset = getElementWidth(linkId) - 163;
		var clickElementx = getAbsoluteLeft(linkId) + arrowOffset; //set x position
		//var clickElementx = getAbsoluteLeft(linkId); //set x position
		
		$('.glossary_popup').remove();
		
		//Create Popup skeleton
		var html = '<div id="'+popupid+'"class="glossary_popup">';
		html +='<div class="JTContainer">';
		html += '</div>';
		html += '</div>';
		
		$('body').prepend(html);
		
		//Put back into default mode
		//$('.JTContainer').removeClass('alter');
		//alert(clickElementx);
		
		var spaceToBody = getAbsoluteLeft("container_header");
		
		//Get the white space betweeen window and body 
		staticX  = clickElementx-spaceToBody;
		
		//alert(staticX);
		
		if (staticX > 300) {
			$('.JTContainer').addClass('alter');
			
			staticX = staticX - 332;
			
			//Set max x position so it doesn't go out of scope
			if (staticX > 215) {
				staticX = 215;
			}
			
			//alert(staticX );
			
		} else {
			//Do nothing because it's default mode		
		}
		
		$('#'+popupid).css({position: 'absolute', left: (staticX+spaceToBody)+"px", top: clickElementy+"px"});
		$('#'+popupid).show( 'fast' );
		
		var XMLurl = '/toyota/main/actions/getArticleXML/0,,'+this.href.split('#')[1]+',.xml';
		var HTMLurl = this.href;
		
		timer();
		
			$.ajax({   
				
				type: "GET",
				url: XMLurl,
				cache: false,
				async: true,
				timeout: 30000,
				error: function (data,error,extra) {
					/*alert('Error: '+error);
					if (error == 'timeout') {
						var html = 'Connection to server has timed out, please try again later.';
						$('#'+popupid + ' .JTContainer').html(html);	
					}*/
				},
				beforeSend: function() {
					var html = '<div id="JTLoader">&nbsp;</div>';
					$('#'+popupid + ' .JTContainer').html(html);
				},
				success: function(data,status) {
					
					$(data).find('glossary').each(function() {
						
						var $glossary = $(this);
						
						html = '<div class="header">';
						html += '<h3>'+$glossary.find('title').eq(0).text()+'</h3>';
						html += '</div>';
						html += '<div class="summary">';
						
						if (!$glossary.find('medium').attr('url')) {
						
							html += '<div class="glossary_text long">';
						
						} else {
						
							html += '<div class="glossary_image">';
							html += '<img src="'+$glossary.find('medium').attr('url')+'" />';
							html += '</div>';
							html += '<div class="glossary_text">';
						}
						
						if ($glossary.find('summary').text()) {
							
							var summary = $glossary.find('summary').text();
							
							summary = summary .replace(/&#60;/g,"<");
							summary = summary .replace(/&#62;/g,">");
							summary = summary .replace(/&#61;/g,"=");
							summary = summary .replace(/&#34;/g,"'");
							summary = summary .replace(/&#47;/g,"/");
							summary = summary .replace(/&#33;/g,"!");
							summary = summary .replace(/&#45;/g,"-");
							
							html += summary + '<br/><br/>';
							html += '<p><a class="arrow-double-grey" href="'+HTMLurl+'">Find out more</a></p>';
							
						} else {
							
							var definition = $glossary.find('definition').text();
							
							definition = definition.replace(/&#60;/g,"<");
							definition = definition.replace(/&#62;/g,">");
							definition = definition.replace(/&#61;/g,"=");
							definition = definition.replace(/&#34;/g,"'");
							definition = definition.replace(/&#47;/g,"/");
							definition = definition.replace(/&#33;/g,"!");
							definition = definition.replace(/&#45;/g,"-");
							
							html += definition + '<br/><br/>';	
						}
						
						if ($glossary.find('link').attr('url')) {
							html += '<p><a class="arrow-double-grey" href="'+$glossary.find('link').attr('url')+'">'+$glossary.find('link').attr('title')+'</a></p>';
						}
						
						html += '</div>';
						html += '</div>';
						
						$('#'+popupid + ' .JTContainer').html(html);
						
					});
				}
		});

				
	}, function(){
		
		var popupid = this.id+'_popup';
		
		tooltip.timeout['#'+popupid] = setTimeout (function() {
			$('#'+popupid).remove();
		}, tooltip.delay);
				

	})
	.click(function(){
		
		var popupid = this.id+'_popup';
		
		$('#'+popupid + ' .JTContainer').hide();
	});
   
   
   function timer() {
	   $(".glossary_popup")
	   .hover(function () {
			
			var tipId = "#" + $(this).attr("id");
			if (tooltip.timeout[tipId]) {
				clearTimeout(tooltip.timeout[tipId]);
				tooltip.timeout[tipId] = null;
			}
		}, function () {
			
			// Restart hide timeout
			var tipId = "#" + $(this).attr("id");
			tooltip.timeout[tipId] = setTimeout( function() {
				$(tipId).remove();											  
			}, tooltip.delay );
		});
   }
}

function getElementWidth(objectId) {
	x = document.getElementById(objectId);
	//alert(x.offsetWidth);
	if (x.offsetWidth > 80) {
		return x.offsetWidth/6;
	} else {
		return x.offsetWidth/2;	
	}
}

function getAbsoluteLeft(objectId) {
	// Get an object left position from the upper left viewport corner
	o = document.getElementById(objectId)
	oLeft = o.offsetLeft            // Get left position from the parent object
	while(o.offsetParent!=null) {   // Parse the parent hierarchy up to the document element
		oParent = o.offsetParent    // Get parent object reference
		oLeft += oParent.offsetLeft // Add parent left position
		o = oParent
	}
	return oLeft
}

function getAbsoluteTop(objectId) {
	// Get an object top position from the upper left viewport corner
	o = document.getElementById(objectId)
	oTop = o.offsetTop            // Get top position from the parent object
	while(o.offsetParent!=null) { // Parse the parent hierarchy up to the document element
		oParent = o.offsetParent  // Get parent object reference
		oTop += oParent.offsetTop // Add parent top position
		o = oParent
	}
	return oTop
}

function blockEvents(evt) {
	  if(evt.target){
	  evt.preventDefault();
	  }else{
	  evt.returnValue = false;
	  }
}



$(document).ready(function() {
	//Init Tooltips
	GlossaryTips_initGlobal();
});