// Starts JQUERY javascript
 $(function() // same as $(document).ready(function()
  {
  
  // Starts open external links as new target - used accross the site //
		  $('a[@href^=http]').attr('target', '_blank');
		  $('a[@href*=public.metrovancouver]').attr('target', '_self');
		  $('a[@href*=www.metrovancouver]').attr('target', '_self');
		  $('a[@href$=.pdf]').attr("target", "_blank");
  		  $('a[@href$=.doc]').attr("target", "_blank");
  // Ends open external links as new target - used accross the site //
  
	//Start Reformat multiline html content in SP Lists
	$('.MsoNormal, .MsoNormal span,  .MsoNormal ~ span').css("color","#5a5f69").css("font-family","tahoma").css("font-size","8pt"); // gets all the MsoNormal class and span decendants and span siblings
	$('.MsoNormal ~ span').find('span').css("color","#5a5f69").css("font-family","tahoma").css("font-size","8pt"); //finds all siblings of MsoNormal class and finds decendents spans
	$('.MsoNormal, .MsoNormal ~ span').find('font').attr("color","#5a5f69"); //if someone font is asigned to black it will overwrite it.
	//End Reformat multiline html content in SP Lists
	
//////////////////////////////////////////////////////////////////////////////////////////////////////------- Starts jquery for hiding/showing collapsable items for grouped items ----///////////////
	//set cursor for the clickable heading to be hand, and effect of underline
			//$('.expand-all, .collapse-all, .connection-clicker').css({color:'#617f9e'});			
			$('.expand-all, .collapse-all, .collapsed-title, .connection-clicker, .ajax-connection-clicker, .ajax-close, .details-click').css({cursor:'pointer'}).hover(
			function(){$(this).css("text-decoration","underline");},
			function(){$(this).css("text-decoration","none");}
			);

 	//hides "expand all and collapse all" for the lists which don't have any items showing by default (MultiDropDownFilter used) or for users who has javascript disabled
	 if($('.collapsed-title').is(":visible")){$('.hideexpandall').show();}
	 
	//This takes care of removing the padding before webparts. we use it when we collapse multiple webparts
	if($('.removeWebpartPadding').is(":visible")){$('div.ms-PartSpacingVertical').removeClass("ms-PartSpacingVertical").css('padding-top','2px');}
			//sets background of the table columns header to grey and to heights 20 px
			$('.hide-content-tablehead').children().css({background:'#F4F4F4',height:'20px'});

			//this hides all the collapsable content and table head titles			
   			$('.hide-content, .hide-content-tablehead').hide();
			 
			//expand-all and collapse-all events
			$('.expand-all').click(function(){
				$('.hide-content, .hide-content-tablehead').animate({height:'show', opacity:'show'}, 'slow');
				$('.collapsed-title').addClass("expanded-title");
			});
			$('.collapse-all').click(function(){
				$('.hide-content, .hide-content-tablehead').animate({height:'hide', opacity:'hide'}, 'slow');
				$('.collapsed-title').removeClass("expanded-title");
			});

			//clicking event on the group title
			  $('.collapsed-title,expanded-title').click(function() 
			  {
  			  //sets a variable with a title attr value of the group heading we clicked on
  			  var y =$(this).attr("title");
				  if ($('.hide-content[@title='+y+']').is(":visible"))    //action for clickin on the item which is expanded
				  {
					$(this).removeClass("expanded-title");
					$('.hide-content[@title='+y+']').animate({height:'hide', opacity:'hide'}, 'slow');
					if ($('.hide-content').is(":hidden")){$('.hide-content-tablehead').animate({height:'hide', opacity:'hide'}, 'slow');} // hides table columns headers
				  } 
				  else   //this is action for clicking on the item which is collapsed
				  {
					$('.current-item').animate({height:'hide', opacity:'hide'}, 'slow'); //hides item which was opened before
					$('.current-item-heading').removeClass("expanded-title");
					$('.hide-content[@title='+y+'], .hide-content-tablehead').addClass('current-item').animate({height:'show', opacity:'show'}, 'slow');	
					$(this).addClass('current-item-heading').addClass('expanded-title');
				  }
			  });
////---------- Ends jquery for hiding/showing collapsable items--------------////////////////

////-----------Start Hiding content details with no plus image ------------------/////////////
$(".background-alternate:even").css("background-color", "#EAEAEA");
  	$('.details-hide').hide();
	$('.details-click').css({cursor:'pointer'}).hover(
		function(){$(this).css("text-decoration","underline");},
		function(){$(this).css("text-decoration","none");}
		);

	//clicking event on the group title
	  $('.details-click').click(function() 
	  {
  	//sets a variable with a title attr value of the group heading we clicked on
  		  
 		  var y =$(this).attr("title");
		  if ($('.details-hide[@title='+y+']').is(":visible"))    //action for clickin on the item which is expanded
		  {
			$('.details-hide[@title='+y+']').animate({height:'hide', opacity:'hide'}, 'slow');
			if ($('.details-hide').is(":hidden")){$('.hide-content-tablehead').animate({height:'hide', opacity:'hide'}, 'slow');} // hides table columns headers
		  } 
		  else   //this is action for clicking on the item which is collapsed
		  {
			$('.details-current-item').animate({height:'hide', opacity:'hide'}, 'slow'); //hides item which was opened before
			$('.details-current-item-heading');
			$('.details-hide[@title='+y+'], .hide-content-tablehead').addClass('details-current-item').animate({height:'show', opacity:'show'}, 'slow');	
			$(this).addClass('details-current-item-heading');
		  }
	  });
////-----------End Hiding content details with no plus image ------------------/////////////
//////////////////////////////////////////////////////////////////////////////////////////////////




/////////////////////////////////////////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////////////////////////////////////////////////
//------------------------Starts Ajax code for connection ------------------------------------ //
// housing page uses it  (Affordable Housing > Facilities )
/*
		$('.ajax-connection-clicker').click(function() 
		{
			
  			  //sets a variable with a title attr value of the group heading we clicked on
  			var loadContentId =$(this).attr("id");   //sets variable for the id of the clicked item which will match id of items on the page where data stored
    		var loadPage = $('.ajax-box').attr("id"); //sets variable for page where data stored for purpose of reusing code    		
    		
			$('.connection-hide-description').animate({height:'hide', opacity:'hide'}, 300);	//hides description
	        $('.ajax-box').animate({height:'hide', opacity:'hide'}, 500);	       
	        
	        $('.connection-loader').remove(); //removes previous instances of loading bar
			$('.ajax-box').before('<div class="connection-loader">LOADING...</div>');   //adds loading bar before the ajax-box div			
			$('.connection-loader').fadeIn('fast');  //loads loading bar	
						
			//setTimeout(function() { $('.ajax-box').load(loadPage+' #'+loadContentId,'',showNewContent);},200);
			$('.ajax-box').load(loadPage+' #'+loadContentId,'',showNewContent);
			$('.ajax-connection-current-item-heading').removeClass('ajax-connection-current-item-heading');
			$(this).addClass('ajax-connection-current-item-heading');
		    
			function showNewContent() {
				$('.ajax-box').animate({height:'show', opacity:'show'}, 500);
				$('.connection-loader').fadeOut('fast');
			}	
		});
*/
		$('.ajax-connection-clicker').click(function() 
		{			
			var aElems = null;					// Array holding the elements that will act as containers for the data retrieved
			var recordId =$(this).attr("id");	// ID of the record to be returned
			var targetPage = "";				// Name of the target page
			var currElem = null;				// Current container element (our web part) that will store the data retrieved from the target page
			var parentEl = null;				// Tab container of the current list item clicked
			var bgColor = "white";				// Var holding background color for the current container element
			var errMsg = "There was an error retrieving data: ";
			
			// Reset the highlight for item list clicked on all list items
			$('.ajax-connection-current-item-heading').removeClass('ajax-connection-current-item-heading');		
				
			// Make list item clicked stand out by changing css
			$(this).addClass('ajax-connection-current-item-heading');
			
			// Processing should be done *only* for the web parts within the same tab with the list item clicked
			// (i.e. aElems should be elements with same parent div container with class "tab-page" as the list item clicked)			
			//parentEl = $(this).parents().find(".tab-page");
			parentEl = $(this).parents(".tab-page");
			
			//alert(parentEl.length);
			
			// If the page does not have tabs, then retrieve all containers, else retrieve only those for the current tab			
			aElems = (parentEl.length == 0) ? $(".ajax-box") : parentEl.children().find(".ajax-box");		
			
			// Get out if we don't have any web parts to fill with data
			if (aElems == null) {return false;}			
				
			// Removes all existing instances of loading bar
			$('.connection-loader').remove(); 			
			
			// Hide the description attached to the web part in the CData section			
			$('.connection-hide-description').hide();
									
			// For each web part on the page, load content
			for (var i=0; i < aElems.length; i++)
			{	
				//alert(aElems.length);
							
				currElem = $(aElems[i]);
				targetPage = currElem.attr("targetPage");				
		        
		        // Add loading bar in the CData section of the current web part			
				currElem.before("<div class='connection-loader'><strong>LOADING...</strong></div>");   

				// Hide current web part content
		        currElem.animate({height:"hide", opacity:0.25}, 500);	
		        
				// Display loading bar for the current web part	
				currElem.prev(".connection-loader").fadeIn("fast");
							
				// Load the result from the targeted page in the current web part
				//$(aElems[i]).load(targetPage+' #'+recordId);

				//alert(currElem.get(0).id + "\n" + recordId);
				
				// Load the result from the targeted page in the current web part
				currElem.load(targetPage+' #'+recordId, function(response, status, xhr)
				{
					if (status != "error")
					{						
						//alert(currElem.html());
						
						// We set the background color of the targeted container dynamically, based on whether we have fragment data or not						
						bgColor = (currElem.html() != "") ? "#ebf1d1" : "white";
						currElem.css("background-color", bgColor);						
						
						// Initialize and setup Shadowbox
						//Shadowbox.init({counterType: "skip"});
						//Shadowbox.clearCache();
						//Shadowbox.setup();
						
						/*
						// Hide all thumbnail images except the first one
						var aImgs = currElem.children().find(".mv-thumbnail");
						
						for (var j=0; j < aImgs.length; j++)
						{
							if (j > 0)
							{
								$(aImgs[j]).hide();
							}
						}
						*/
					}
					else
					{						
						alert(errMsg + "\n" + xhr.status + "\n" + xhr.statusText);
					}
				});

	
				// Show current web part content
				currElem.animate({height:"show", opacity:1}, 500);	
				
				// Fade out the "Loading..." div attached to current web part
				currElem.prev(".connection-loader").fadeOut('fast');
			}
		});		
		
			/// hiding content when you change the tab
			$('h2.tab, .ajax-close').click(function()
			{
				$('.ajax-connection-clicker').removeClass('ajax-connection-current-item-heading');
				$('.ajax-connection-hide-description').show();
				$('.ajax-box').empty();
			});

/////////////////////////////////////////////////////////////////////////////////////////////////////
////---------- Starts jquery for hiding/showing connected items-------////////////////
			  $('.connection-clicker').click(function() 
			  {
  			  //sets a variable with a title attr value of the group heading we clicked on
  			  var y =$(this).attr("title");
				  if ($('.connection-hidden-content[@title='+y+']').is(":visible"))  
				  //action for clicking on the item which has connected information already shown
				  {
					$(this).removeClass('connection-current-item-heading');
					$('.connection-current-item').fadeOut(500);
					setTimeout(function() {$('.connection-hide-description').fadeIn(1000);},400);
				  } 
				  else   //this is action for clicking on the item which doesnt have connected information shown
				  {
					$('.connection-current-item').fadeOut(500); //hides item which was opened before
					$('.connection-current-item-heading').removeClass('connection-current-item-heading');
					$('.connection-hide-description').fadeOut(500);	//hides description
					$(this).addClass('connection-current-item-heading');
					setTimeout(function() {$('.connection-hidden-content[@title='+y+']').addClass('connection-current-item').fadeIn(1000);
},400);
				  }
			    });
				/// hiding content when you change the tab
				$('h2.tab').click(function()
				{
					$('.connection-clicker').removeClass('connection-current-item-heading');
					$('.connection-hidden-content').hide();
					$('.connection-hide-description').show();

				});
			 
////---------- Ends jquery for hiding/showing connected items-------////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////////

///------------ Starts jquery code for hiding search results till the button is clicked -------//////
///------------ Starts jquery code for hiding search results till the button is clicked -------//////

  });

// Ends JQUERY javascript

////////////////////////////////////  JAVASCRIPT FUNCTIONS  /////////////////////////////////////////
// start functions for the hover-over/click on multiple items and have divs with description to show/hide //

function Show(current) {
	HideAll()
	if (current != 0)
	{
	var theid=document.getElementById(current)
		theid.style.display = 'block';
		theid.style.background= '#ebf1d1';
	}
	var hide=document.getElementById('hide')
		if(hide.style.display = 'block')
		{
		hide.style.display = 'none';
		}
}

function HideAll() { 
	for (var i = 1; i<=50; i++) 
	{ // menus are hidden when the document loads up, but only if javascript is enabled. 
	if (document.getElementById(i)) {document.getElementById(i).style.display='none';} 
	} 
}

//End

// start functions for the hover-over/click on multiple items and have divs with description to show/hide
// but for the calendar
function ShowCalendar(current) {
	HideAllCalendar()
	var theid=document.getElementById(current)
		theid.style.display = 'block';
	var hide=document.getElementById('hide')
		if(hide.style.display = 'block')
		{
			hide.style.display = 'none';
		}
}

function HideAllCalendar() { 
	for (var i = 1; i<=350; i++) 
	{ // menus are hidden when the document loads up, but only if javascript is enabled. 
	if (document.getElementById(i)) {document.getElementById(i).style.display='none';} 
	} 
}
// end
// end functions for the hover over/ click and have divs to show/hide

//this is for mouseOut event
function ShowMouseOver(current) {
	var theid=document.getElementById(current)
		theid.style.display = 'block';
		theid.style.background= '#ebf1d1';
	var hide=document.getElementById('hide')
		if(hide.style.display = 'block')
		{
			hide.style.display = 'none';
		}
}

function HideMouseOver(current) {
	var theid=document.getElementById(current)
	if (theid.style.display = 'block')	
	theid.style.display = 'none';
}
// end of mouseOut event

// this will create popup-divs with positioning according to the position of popuplink ///
function PopUpWindow(popup,popuplink,positioning) 
{
	HideAllPopUpWindow(popup);
	var popupBox=document.getElementById(popup)
		popupBox.style.display = 'block';
		
		//popupBox.style.width = width+'px';
	setPosition(popupBox,popuplink,positioning)
}

function setPosition(popupBox,popuplink,positioning) {
  	var image=document.getElementById(popuplink);
	switch (positioning)
	{
	case 'bottom':
	popupBox.style.top = image.offsetTop + image.offsetHeight +5+'px';
	popupBox.style.left = image.offsetLeft - popupBox.offsetWidth + image.offsetWidth+'px';
	break;
	
	case 'right':
	popupBox.style.top = image.offsetTop+'px';
	popupBox.style.left = image.offsetLeft + image.offsetWidth+5+'px';
	break;

	case 'left':
	popupBox.style.top = image.offsetTop+'px';
	popupBox.style.left = image.offsetLeft  - popupBox.offsetWidth-5+'px';
	break;

	default:
	popupBox.style.top = image.offsetTop + image.offsetHeight + 5+'px';
	popupBox.style.left = image.offsetLeft - popupBox.offsetWidth + image.offsetWidth+'px';
	}
}

// this is for the close image for the popup window
// don't use for hover over events
function ClosePopUpWindow(current) {
	var theid=document.getElementById(current)
	if (theid.style.display = 'block')	
	theid.style.display = 'none';
}

//Hides all pop windows - use with mouseOut javascript
function HideAllPopUpWindow(popup) { 
// fades out all summit popup windows
	$('.popUpSummit').fadeOut(400);
	var name=popup.split("-");
	for (var i = 1; i<=80; i++) 
	{ // menus are hidden when the document loads up, but only if javascript is enabled. 
	if (document.getElementById(name[0]+'-'+i)) {document.getElementById(name[0]+'-'+i).style.display='none';} 
	} 
}

//start specific functions for popup on the hotspot
function PopUpWindowHotspot(popup,popuplink,x_top,y_top,x_bottom,y_bottom, positioning) {
		HideAllPopUpWindow(popup);
		
		var popupBox=document.getElementById(popup);
		popupBox.style.display = 'block';
		setPositionHotspot(popupBox,popuplink,x_top,y_top,x_bottom,y_bottom, positioning);

}

function setPositionHotspot(popupBox,popuplink,x_top,y_top,x_bottom,y_bottom, positioning) {
  	var image=document.getElementById(popuplink);

	switch (positioning)
	{
	case 'bottom':
	popupBox.style.top = image.offsetTop + y_bottom +'px';
	popupBox.style.left = image.offsetLeft + x_bottom - popupBox.offsetWidth-5+'px';
	break;
	
	case 'right':
	popupBox.style.top = image.offsetTop + y_top +'px';
	popupBox.style.left = image.offsetLeft + x_bottom+20+'px';
	break;

	case 'left':
	popupBox.style.top = image.offsetTop + y_top +'px';
	popupBox.style.left = image.offsetLeft + x_top - popupBox.offsetWidth-2+'px';
	break;

	default:
	popupBox.style.top = image.offsetTop + y_bottom +'px';
	popupBox.style.left = image.offsetLeft + x_bottom - popupBox.offsetWidth-5+'px';
	}
}
//end specific functions for popup on the hotspot
// end pop up div window show/hide


//// pulls values of the Query Variables 
function returnQueryParam(param)
{
	var qrStr = window.location.search;
	var spQrStr = qrStr.substring(1);
//	var arrQrStr = new Array();

	// splits each of pair
	var arr = spQrStr.split('&');
	var val='';
	for (var i=0;i<arr.length;i++)
		{
		// splits each of field-value pair
		var index = arr[i].indexOf('=');
		var key = arr[i].substring(0,index);
		val = arr[i].substring(index+1);
		if (key == param) 
		{	
		 return val;
		 break;
		 }
		// saves each of field-value pair in an array variable
//		arrQrStr[key] = val;
		}
		val ="";
		return val;
}

////////////////////////////////////////////////////////////////////////////////////
function facebookSare() 
{
	u=location.href;
	t=document.title;
	window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=1,status=1');
	return false;
}

/////////////////////////////////////////////////////////////////////////////////////