//Setting the tool object definition
var myTool = [];

/*
 * JavaScript: for tools_redesign.jsp
 *
 * @file              /javascript/toolsredesign.js
 * @author            zavoale@barclaysglobal.com
 * @revision          $Id$
*/

function Tool(toolName,url,newWindow,regRequired,recentlyUpdated,disabledFlag,authStatus){
	this.toolName = toolName;
	this.linkUrl = url;
	this.linkNewWindow = [];
	this.disabledFlag = disabledFlag;
	this.regRequired = regRequired;
	this.recentlyUpdated = recentlyUpdated;
	this.authStatus = authStatus;
	this.toolData = new Overlay();
	this.preloadComplete = 0;

	this.construct(newWindow);
}

Tool.prototype.construct = function(newWindow) {
	this.linkNewWindow = newWindow;
}

function Item(){	
	this.shortDesc = null;
	this.longDesc = null;
	this.imgURL = null;
	this.imgObj = new Image();
	this.link = null;
}

function Pdf(){
	this.linkText = [];
	this.linkURL = [];
}

function Demo(){
	this.linkURL = null;
}

function Overlay(){
	this.item = [];
	this.pdf = [];
	this.demo = null;
}

Tool.prototype.addToolDataItem = function(shortDesc, longDesc, img){
	var len = this.toolData.item.length;
	this.toolData.item[len] = new Item();
	
	this.toolData.item[len].shortDesc = shortDesc;
	this.toolData.item[len].longDesc = longDesc;
	this.toolData.item[len].imgURL = img;
}

Tool.prototype.addToolDataPDF = function(linkText, linkURL){
	var len = this.toolData.pdf.length;
	this.toolData.pdf[len] = new Pdf();
	
	this.toolData.pdf[len].linkText = linkText;
	this.toolData.pdf[len].linkURL = linkURL;
}
 
Tool.prototype.addDemo = function(linkURL, demoW, demoH){
	this.toolData.demo = new Item();
	this.toolData.demo.linkURL = linkURL;
}
 
Tool.prototype.imgPreLoadTool = function(){
	var len = this.toolData.item.length;
	for (var i=0; i<len; i++){
		this.toolData.item[i].imgObj.src = this.toolData.item[i].imgURL;
	}
}

Tool.prototype.imgPreLoad = function(){
	var tDlen = this.toolData.item.length;
	if (!this.preloadComplete) {
		for (var i=0; i<tDlen; i++){
			this.toolData.item[i].imgObj.src = this.toolData.item[i].imgURL;
		}
	}
	this.preloadComplete=1;
}

// vanilla_getElementsByClass is just a basic function to get all the tool box elements but not use JQuery.
// this is needed to workaround an IE6 bug where there was a flicker for a background
// this is based on part of www.sitepoint.com's Core methods.
// function returns an array of elements that have the class specified
function vanilla_getElementsByClass(theClass) {
  var elementArray = [];
  if (typeof document.all != "undefined")
  {
    elementArray = document.all;
  }
  else
  {
    elementArray = document.getElementsByTagName("*");
  }

  var matchedArray = [];
  var pattern = new RegExp("(^| )" + theClass + "( |$)");

  for (var i = 0; i < elementArray.length; i++)
  {
    if (pattern.test(elementArray[i].className))
    {
      matchedArray[matchedArray.length] = elementArray[i];
    }
  }

  return matchedArray;
}


function startOlay(){
	
	$('#dialog').jqm({
    	onShow: function(h){
				h.w.fadeIn(1000);
				h.w.show();
			},

			onHide: function(h){
				if($('.media-box')){$('.media-box object, .media-box embed').remove();}
				h.w.fadeOut(500);
				if (h.o) h.o.remove();
				$('#launchUrl').removeClass('btn-lnch-dbl');
				$('#launchUrl').unbind("click");
		}
	});

	$('input.jqmdX')
	  .hover(function(){$(this).addClass('jqmdXFocus'); },function(){$(this).removeClass('jqmdXFocus');})
	  .focus(function(){this.hideFocus=true; $(this).addClass('jqmdXFocus');})
	  .blur(function(){$(this).removeClass('jqmdXFocus');});
}

function openDemo(tool_id, tool_ttl){
	var balloon = "&nbsp;";
	$('.dialog-title-box h2').html(tool_ttl+balloon);
	var mb = $('.media-box');
	var obj = document.getElementById('bcflash');	
	if(obj){$(obj).remove();}
	
	var demoURL = myTool[tool_id].toolData.demo.linkURL;
 	var demoW = '580px';
	var demoH = '425px'; 
	var swf_obj = '';
	
	swf_obj += '<object id="bcflash">';
	swf_obj += '<param name="movie" value="' + demoURL + '" />';
	swf_obj += '<param name="wmode" value="transparent" />';
	swf_obj += '<param name="menu" value="false" />';
	swf_obj += '<param name="quality" value="high" />';
	swf_obj += '<param name="swliveconnect" value="true" />';
	swf_obj += '<param name="type" value="application/x-shockwave-flash" />';
	swf_obj += '<embed src="' + demoURL + '" width="' + demoW + '" height="' + demoH + '" name="bcflash" swLiveConnect="true"></embed>';
	swf_obj += '</object>';
	mb.append(swf_obj);
}

function openTlsRts(t, olay_pg, t_id, tool_ttl){
	var slides = [];
	var imgs = [];
	var sds = [];
	var lds = [];
	var lnks = [];
	var pdfUrl;
	var pdfText;
	
	var obj = document.getElementById('bcflash');
	if(obj){$(obj).remove();}
	
	if(olay_pg == 'olay_tools'){
		var itemArr = myTool[t_id].toolData.item;
		var pdfArr = myTool[t_id].toolData.pdf;
	}
	
	for(var i=0; i<itemArr.length; i++){
		imgs[i] = itemArr[i].imgURL;
		sds[i] = itemArr[i].shortDesc;
		lds[i] = itemArr[i].longDesc;
		lnks[i] = itemArr[i].link;
	}
	
	for(var i=0; i<pdfArr.length; i++){
		pdfUrl = pdfArr[i].linkURL;
		pdfText = pdfArr[i].linkText;
	}
	
	for (var i in imgs){
		slides[i] = new Image();
		slides[i].src = imgs[i];
	}
	
 	if($(t).hasClass('widget')){
		$('.dialog-title-box a').hide();
	} else {
		$('.dialog-title-box a').show();
	}
	
	var sh = $('#sholder');
	if(sh){$(sh).remove();}
	
	$('.dialog-title-box h2').html(tool_ttl);

	//CG: Added P+ stuff (this should eventually be re-worked
	if (myTool[t_id].regRequired=='true' && !(myTool[t_id].authStatus=='recognized' || myTool[t_id].authStatus=='signedin')) {
		$('#olay-lock').html('<a href="javascript:void(0);" class="icon-lock">P+</a>');
	} else {
		$('#olay-lock').html('');
	}
	
	var loc_pr = $('.lock-box');
	var lock_li = $('.icon-lock');
 	$(lock_li).each(function(i){
		$(this).hover(
			function(event){
				var act_el = event.target;
				$('.balloon').remove();
				showBalloon(act_el,t_id,"Tool Overlay");
				$('.balloon').css('display','inline');
			},
			function(){
				$(loc_pr).hover(
					function(event){
						var et = event.target;
						if($(et).hasClass('balloon')){
							$('.balloon').css('display','inline');
						}
					},
					function(){
						$('.balloon').hide();
					}
				);
			}
		);
	});

	function opBalloon(loc){
		$(loc).each(function(i){
			$(loc[i]).hover(
				function(event){
					var et = event.target;
					if($(this).siblings('.balloon')){
						$('.balloon').remove();
					}
					var p_id = $(et).attr("id");
					var t_id = p_id.substring(5,p_id.length);
					showBalloon(et, t_id);
					$('.balloon').css('display','inline');
				},
				function(){
					$(loc_pr).hover(
						function(event){
							var et = event.target;
							if($(et).hasClass('balloon')){
								$(bal).css('display','inline');
							}
						},
						function(){
							$('.balloon').hide();
						}
					);
				}
			);
		});	
	}	

	if (myTool[t_id].recentlyUpdated=='true') {
		$('#olay-updated').html('<span class="icon-updated">UPDATED!</span>');
	} else {
		$('#olay-updated').html('');
	}

	var fImg = document.createElement('img');
	fImg.id = 'sholder';
	fImg.src = imgs[0];
	$(fImg).insertBefore('.screen-indx');

	var desc_c = $('.desc-lnks')[0];	
	if(desc_c)desc_c.innerHTML = '';

	var desc_box = $('.desc-lnks')[0];
	var ul = document.createElement('ul');
	ul.className = 'ul-block';

	//short description
	for (var i=0; i<sds.length; i++){
		var sdesc = sds[i];
		var a = document.createElement('a');
		a.innerHTML = sdesc;
		var li = document.createElement('li');
		li.appendChild(a);
		ul.appendChild(li);
	}
	ul.firstChild.firstChild.className = 'desc-lnks-on';

	var dv_pdfbox = document.createElement('div');
	desc_box.appendChild(ul);
	if(pdfUrl != undefined){
		desc_box.appendChild(dv_pdfbox);
		if(olay_pg == 'olay_tools'){
			dv_pdfbox.innerHTML ='<a href="' + pdfUrl + '" onclick="_hbLink(\''+pdfText+'-Guide\',\'Tool Overlay\'); _hbSet(\'cv.c18\',\''+pdfText+'-Guide|Tool Overlay\'); _hbDownload(\'Tool Overlay:'+pdfText+'-Guide\')" target="_blank">' + pdfText + '<img src="/images/learn/strategies/icon_pdf.gif" width="16" height="16" class="pdf-lnk" alt=""/></a>';
		}
	}

	var indx = $('.screen-indx')[0];
	if(indx)indx.innerHTML = '';

	var sd = $('#sdesc-div');
	if(sd){$(sd).remove();}
	var sdesc_div = document.createElement('div');
	sdesc_div.id = 'sdesc-div';
	$(sdesc_div).insertAfter('.screen-indx');
	$('#sdesc-div').append(lds[0]);

	function changeSD(sd){
		sdesc_div.innerHTML = '';
		$('#sdesc-div').append(sd);
	}
	function changeSlides(el_img, ar_img){
		el_img[0].src = ar_img.src;
	}
	var ld = $('.desc-lnks').find('ul').children('li').children('a');
	var screen_indx = $('.screen-indx')[0];

	if(ld.length > 1){
		var sindx_ul = document.createElement('ul');
		sindx_ul.className = 'ul-inline';
		for(var i=0; i<ld.length; i++){
			var li = document.createElement('li');
			sindx_ul.appendChild(li);
		}
		screen_indx.appendChild(sindx_ul);
		sindx_ul.firstChild.className = 'scrindx-selected';
	}
	
	var slide_indx = $('.screen-indx').find('li');	
	
	function clearDesc(){
		$(ld).each(function(i){
			ld[i].className = 'desc-lnks';
		});
	}
	
	$(ld).each(function(i){
		$(ld[i]).mouseover(function (event) {
			var el_a = event.target;
			var el_img = $('#sholder');
			var slideindx = $(el_a).parents('.box-b').siblings('.box-a').find('.screen-indx').find('li');
			clearDesc();
			this.className = 'desc-lnks-on';
			if(slide_indx.length>0){
				$(el_img[0]).each(function(){				
					$(slide_indx).each(function(j){
						slide_indx[j].className = '';
					});
					slide_indx[i].className = 'scrindx-selected';
				});
			}
			changeSlides(el_img, slides[i]);
			changeSD(lds[i]);		
		});
	});

	if(slide_indx.length>0){
		$(slide_indx).each(function(i){		
			$(slide_indx[i]).mouseover(function (event) {
				event.stopPropagation();
				var el_a = event.target;
				var el_img = $('#sholder');
				clearDesc();

				$(el_img[0]).each(function(){
					$(slide_indx).each(function(j){
						slide_indx[j].className = '';
					});
					slide_indx[i].className = 'scrindx-selected';
				});
				changeSlides(el_img, slides[i]);
				changeSD(lds[i]);
				$(ld[i]).each(function(){
					ld[i].className = 'desc-lnks-on';
				});
				$(slide_indx[i]).mouseout(function () {
				});
			});
		});
	}
}

function showBalloon(act_el,t_id,balLoc){
	$('#sign-bub-link').remove(); //needed this for FF3
	var balloon = document.createElement('div');
	balloon.className = 'balloon';
	var bcbox = document.createElement('div');
	bcbox.className = 'balloon-content';
	var btip = document.createElement('div');
	btip.className = 'balloon-tip';
	var locStr = 'SignIn Bubble: '+balLoc;
	var regLocStr = 'Register Bubble: '+balLoc;
	var hbLink = "_hbLink('"+myTool[t_id].toolName+"-Launch','"+locStr+"');";
	var regHbLink = "_hbLink('"+myTool[t_id].toolName+"-Launch','"+regLocStr+"');";
	bcbox.innerHTML = '<p class="balloon-hdr">Registration required</p><p>Please <a id="sign-bub-link" onclick="'+hbLink+'" href="'+myTool[t_id].linkUrl+'">Sign in</a> or <a href="/profile/registration_start.htm"  onclick="'+regHbLink+'">Register</a></p>';
	
	var prt_el = $(act_el).parents('.lock-box');
	$(balloon).append(bcbox);
	$(balloon).append(btip);
	$(balloon).insertAfter(act_el);
	//$(prt_el).append(balloon);

	if (myTool[t_id].linkNewWindow) {
		$('#sign-bub-link').click( function() {
			named_tool_popup(this.href,myTool[t_id].linkNewWindow.height,myTool[t_id].linkNewWindow.width,"");
			return false;
		});
	}
}

function setOlay(t, tool_id, tool_ttl){
	if($(t).hasClass('opn-tools')){
		var olay_pg = 'olay_tools';
		$('#olay-play').hide();
		$('#olay-tools').show();

		if (myTool[tool_id].disabledFlag != 'true') {
			//sets the tracking string
			var olayLaunchWss =  "&lid="+myTool[tool_id].toolName+"-Launch&lpos=Tool Overlay";
			
			//sets the launch button in overlay
			$('#launchUrl').attr('href',myTool[tool_id].linkUrl);
			$('#launchUrl').attr('name',olayLaunchWss);
			$('#launchUrl').attr('name',olayLaunchWss);

			//This will use the href to launch the tool

			if (myTool[tool_id].linkNewWindow) {
				$('#launchUrl').unbind("click");
				$('#launchUrl').click( function() {
						named_tool_popup(this.href,myTool[tool_id].linkNewWindow.height,myTool[tool_id].linkNewWindow.width,"");
						return false;
				});
			}
		} else {
			$('#launchUrl').addClass('btn-lnch-dbl');
			$('#launchUrl').click( function() {return false;});
		}
		
		openTlsRts(t, olay_pg, tool_id, tool_ttl);
	}

	if ($(t).hasClass('demo-task')) {
		var demoWss = "&lid="+myTool[tool_id].toolName+"-Demo&lpos=Tool";
		$(this).attr('name',demoWss);
	}

	if($(t).hasClass('icon-play')){
		$('#olay-tools').hide();
		$('#olay-play').show();
		openDemo(tool_id, tool_ttl);
	}

}

$(document).ready(function(){
	var isOpened = $('.tool-on').parents('.tool-box');
	var links = $('.tool-desc');
	if($(links).hasClass('tool-on')){
		$('h1.ttl').hover(
			function(){
				if($(this).hasClass('ttl')){
					$(this).css('color','#00549f');
				}
				if($(this).parents('.tool-desc').hasClass('tool-off')){
					var thumb_div = $(this).parents('.tool-desc').siblings('.action-box').find('.thumb-jsp');
					var thumb_src = $(thumb_div).css('backgroundImage');
					
					var myimg = document.createElement('div');
					myimg.className = 'thumb-el';
					$(myimg).css('backgroundImage',thumb_src);

					var img_div = document.createElement('div');
					img_div.className = 'tool-thumb';
					$(myimg).clone().appendTo(img_div);
					var par = $(this).parents('.tool-box').find('.ie-relpos');
					$(img_div).prependTo(par);
				}
			},
			function(){
				$(this).css('color','#333');
				if($('.tool-thumb')){
					$('.tool-thumb').remove();
				}
			}
		);
	}
	
	if($('.icon-play').length>0){
		var fla_a = $('.icon-play');
		$(fla_a).each(function(i){
			$(fla_a[i]).hover(
				function (){
					$(this).siblings('.fla_tip').show();
					$(this).parents('li').css('position','relative');
				},
				function (){
					$(this).siblings('.fla_tip').hide();
					$(this).parents('li').css('position','static');
				}
			);
		});
	}
  // ************************************
  // begin Fix for artf74383 IE6 Flicker.
  // Replacing JQuery mouseover, mouseoff event handlers with non JQuery ones.
  // That fixes the flicker.  Can still use JQuery class manipulators.

  // ORIG BLOCK BELOW
  // $('.tool-box').mouseover(function(){
  //  if($(this).hasClass('cons-b')){
  //    $(this).removeClass('cons-b').toggleClass('cons-b-hvr');
  //  }
  //  if($(this).hasClass('cons-a')){
  //    $(this).removeClass('cons-a').toggleClass('cons-a-hvr');
  //  }
  // });
  // $('.tool-box').mouseout(function(){
  //  if($(this).hasClass('cons-b-hvr')){
  //    $(this).removeClass('cons-b-hvr').toggleClass('cons-b');
  //  }
  //  if($(this).hasClass('cons-a-hvr')){
  //    $(this).removeClass('cons-a-hvr').toggleClass('cons-a');
  //  }
  // });

  // NEW BLOCK - this is so user sees the lighter background color, then when mouseover they see darker background
  // This loop will find all the toolboxes get all elements by classname
  // vanilla_getElementsByClass is just a basic function to get all the tool box elements but not use JQuery.

  // loop through the set of toolboxes (big squares on the landing page) and assign onmouseover, onmouseoff to each one.
  // the key here is to not use JQuery to assign the event handlers.
  // Notice the subtle diff... Browser supported onmouseover vs JQuery's mouseover method.
  // Modified the way rollovers work to reduce javascript (changed to change its parent to hvr)
	var toolboxes = vanilla_getElementsByClass('tool-box');
	for (var i=0; i< toolboxes.length; i++) {
		for (var i=0; i< toolboxes.length; i++) {
			$(toolboxes[i]).hover(			
				function() {
					if($(this).hasClass('cons-b')){
						$(this).removeClass('cons-b').toggleClass('cons-b-hvr');
					}
					if($(this).hasClass('cons-a')){
						$(this).removeClass('cons-a').toggleClass('cons-a-hvr');
					}
				},		    
				function() {
					if($(this).hasClass('cons-b-hvr')){
						$(this).removeClass('cons-b-hvr').toggleClass('cons-b');
					}
					if($(this).hasClass('cons-a-hvr')){
						$(this).removeClass('cons-a-hvr').toggleClass('cons-a');
					}
			    }
			);
		}
	}
  // end Fix for artf74383 IE6 Flicker.
  // ************************************

  if(isOpened.length>0){// check if container opened. Tools & Charsts tab
		for(var i=0; i<isOpened.length; i++){
			myTool[isOpened[i].id].imgPreLoad();
		}
		startOlay();
		var lnk = $(isOpened).find('.jqModal');
		$(lnk).each(function(j){
			$(lnk[j]).click(function (event){
				var is_lnk = event.target;
				var toolId = $(is_lnk).parents('.tool-box')[0].id;
				var tool_ttl = $(is_lnk).parents('.tool-wborder').children('.tool-desc').children('.ttl-ln').children('.ttl').text();			
				setOlay(is_lnk, toolId, tool_ttl);
			});
		});
	}
	
	$(links).each(function(i){
		if($(links[i]).hasClass('tool-on')){
			//isolates opened tool containers from further process
		} else {
			$(links[i]).click(function (event) {
				var tool_opnr = event.target;
				var tool = $(tool_opnr).parents('.tool-box');
				var box = $(this).nextAll(".action-box");
				$(tool).each(function(tsk){
					if($(tool[tsk]).hasClass('task-box')){//Tasks tab.
						var tool_id = tool[tsk].id;
						var lnk = $(this).find('.jqModal');						
            var tool_ttl = myTool[tool_id].toolName;
						$(lnk).click(function (event){
							var is_lnk = event.target;							
							setOlay(is_lnk, tool_id, tool_ttl);
						});
						startOlay();
					} else {
						var tool_id = $(tool_opnr).parents('.tool-box')[0].id;
						myTool[tool_id].imgPreLoad();
						var tool_ttl = $(links[i]).children('.ttl-ln').children('h1').text();
						var lnk = $(this).find('.jqModal');
						$(lnk).click(function (event){
							var is_lnk = event.target;
							setOlay(is_lnk, tool_id, tool_ttl);
						});
						startOlay();
					}
				});
			});
		}
	});
	
	function opBalloon(loc){
		$(loc).each(function(i){
			$(loc[i]).hover(
				function(event){
					var et = event.target;
					if($(this).siblings('.balloon')){
						$('.balloon').remove();
					}
					var p_id = $(et).attr("id");
					var t_id = p_id.substring(5,p_id.length);
					var balLoc = "";
					if($(et).parents().hasClass('leftnav-lnks-box')){
						balLoc = "Left Navigation";
					}
					if($(et).parents().hasClass('tool-box')){
						balLoc = "Body";
					}
					showBalloon(et, t_id, balLoc);
					$('.balloon').css('display','inline');
				},
				function(){
					$(loc_pr).hover(
						function(event){
							var et = event.target;
							if($(et).hasClass('balloon')){
								$(bal).css('display','inline');
							}
						},
						function(){
							$('.balloon').hide();
						}
					);
				}
			);
		});	
	}
	var loc_pr = $('.lock-box');
	var loc = $(loc_pr).find('.icon-lock');
	if(loc.length>0){
		opBalloon(loc);
	}
	
	$(links).each(function(i){
		$(links[i]).click(function () {
			var box = $(this).nextAll(".action-box")[0];
			if($('.tool-thumb')){
				$('.tool-thumb').remove();
			}
			if ($(box).is(":hidden")) {
				$(box).slideDown(200);
				$(links[i]).removeClass("tool-off");
				$(links[i]).addClass("tool-on");
			} else {
				$(box).slideUp(75);
				$(links[i]).removeClass("tool-on");
				$(links[i]).addClass("tool-off");
			}
		});
	});

	$('#whats-new').click(function() { $('#ntf-dialog').fadeIn(1000); return false; });
	$('#closeNtf').click(function() { $('#ntf-dialog').fadeOut(250); })
});