﻿// JScript File For Career Map

		function changeMap(newMap,bHideMenu,mapLeft,mapTop)
		{
			HidePathwayNumbers(newMap);

			currentPathwayId = '';
			if (newMap != '')
			{
				currentPathwayId = newMap.substring(1); // ignore the leading 'p'
				newMap = '_' + newMap;
			}

			HideEditor('CareerPathwayEditor');
			HideEditor('PathwayRouteFinder');
			
			if (bHideMenu) 
			{
				ShowHideMe('careernav');    
			}
	
            if (mapLeft != undefined && mapTop != undefined) {
                zoom('reset');
                //zoom('in');
//				document.getElementById('movePic').style.left		= mapLeft + 'px';
//				document.getElementById('movePic').style.top		= mapTop + 'px';
//				document.getElementById('NumbersLayer').style.left	= mapLeft + 'px';
//				document.getElementById('NumbersLayer').style.top	= mapTop + 'px';		
			}

      

//CODE FOR SHOWING EXTRA VACANCIES POPUP PANEL
            if (IsCareerPathwaySelected()  || (mapLeft != undefined && mapTop != undefined))
            {
                HidePathwayNumbers('');
                //$(document).ready(function(){
                    $("#extraJobs").dialog("destroy");
                    
                    //$("#extraJobs").css("display","block");
    
                    //call to ajax to get the data for this dialog
                    var vparts = GetExtraVacancies(newMap.substring(2)).split('|');
                    posLeft = vparts[0];
                    dlgColour  = vparts[1];
                    
                    
                    if ( typeof mapLeft != 'undefined')
                        $("#extraJobs").dialog({ position:[380,300], width:600, height:400 , draggable: true, dialogClass: 'flora'});
                    else if (posLeft == 'true' )
                        $("#extraJobs").dialog({ position:[210,300], width:600, height:400 , draggable: true, dialogClass: 'flora'});
                    else
                        $("#extraJobs").dialog({ position:[850,300], width:600, height:400 , draggable: true, dialogClass: 'flora'});
                        
                    ChangeCareerMapPopupTab(1);
                   
                    try
                    {
                        //$("#extraJobs").attr("title",vparts[2]);
                        $(".ui-dialog-title").text(vparts[2]);    
                        $(".flora.ui-dialog .ui-dialog-titlebar").addClass(dlgColour);
                        
                        if (dlgColour == "yellow") $(".flora.ui-dialog .ui-dialog-title").css("color", "black");
                    } catch (excep) { }

                    HandleProtectedParagraphs();
                    
                //});
            }
//END OF CODE FOR SHOWING EXTRA VACANCIES POPUP PANEL

            document.getElementById('movePic').src = 'images/careermaps/careermaps' + newMap + '.gif';
		}

		function HidePathwayNumbers(pID)
		{	
			var TheNumbers = document.getElementsByClassName('p_Numbers');
			
			for(i = 0; i < TheNumbers.length; i++)
			{
				var sClassName = TheNumbers[i].className;	
				var arrClasses = sClassName.split(' ');
				var bKeep = false;
				for(n = 0; n < arrClasses.length; n++)
				{
					if (arrClasses[n] == pID)
						bKeep = true;
				}

				if (!bKeep)
					TheNumbers[i].style.display = 'none';
				else
					TheNumbers[i].style.display = '';	
			}
		}
		
		
		
							function ZoomChangeMapBtnCoords(whichWay)
					{
						var TheBtns = document.getElementsByClassName('ChangeMapBtn');

						if (whichWay == 'in')
						{
							for(i = 0; i < TheBtns.length; i++)
							{
								// Get the coords
								var sCoords = TheBtns[i].coords;

								// Sort out the new coords
								var arrCoords = sCoords.split(',');
								var iLeft = TrimString(arrCoords[0]);
								var iTop = TrimString(arrCoords[1]);
								var iRight = TrimString(arrCoords[2]);
								var iBottom = TrimString(arrCoords[3]);

								iLeft = Math.floor(iLeft * 1.4);
								iTop = Math.floor(iTop * 1.4);
								iRight = Math.floor(iRight * 1.4);
								iBottom = Math.floor(iBottom * 1.4);

								TheBtns[i].coords = iLeft +','+ iTop +','+ iRight +','+ iBottom;
							}
						}
						else if (whichWay == 'out')
						{
							for(i = 0; i < TheBtns.length; i++)
							{
								// Get the coords
								var sCoords = TheBtns[i].coords;

								// Sort out the new coords
								var arrCoords = sCoords.split(',');
								var iLeft = TrimString(arrCoords[0]);
								var iTop = TrimString(arrCoords[1]);
								var iRight = TrimString(arrCoords[2]);
								var iBottom = TrimString(arrCoords[3]);
				
								iLeft = Math.floor(iLeft / 1.4);
								iTop = Math.floor(iTop / 1.4);
								iRight = Math.floor(iRight / 1.4);
								iBottom = Math.floor(iBottom / 1.4);

								TheBtns[i].coords = iLeft +','+ iTop +','+ iRight +','+ iBottom + ' ';
							}
						}
						else if (whichWay == 'reset')
						{
							var sOriginalBtnCoords = document.getElementById('OriginalChangeBtnCoords').value;
							var sBtnCoords = sOriginalBtnCoords.split('&&');
					
							for (i = 0; i < sBtnCoords.length; i++)
							{
								if (sBtnCoords[i] == '') continue;
								if (sBtnInfo == undefined || $('#' + sBtnInfo[0]).length == 0) continue;

								var sBtnInfo = sBtnCoords[i].split('=');
								document.getElementById(sBtnInfo[0]).coords = sBtnInfo[1];
							}
						}
					}

					var currentPathwayId = '';	// Id of selected career pathway line

					var pathwayRouteStartJobId = '';
					var pathwayRouteEndJobId = '';

					function IsCareerPathwaySelected()
					{
						return (currentPathwayId != '');
					}

					function HideEditor(editorId)
					{
						var ePathways = document.getElementById('PHE_Pathway');
						if (ePathways) {
							if (ePathways.style.visibility === 'visible') {
								this.ShowHideMe('PHE_Pathway');
							}
						}

						document.getElementById(editorId).style.visibility = 'hidden';						
					}

					function CalculatePathwayRoute()
					{
						var startJobId = Value('PathwayRouteFinderStartJob');
						var startPathwayId = ddlid('PathwayRouteFinderStartPathway');
						if (startPathwayId == null) startPathwayId = '';
						var endJobId = Value('PathwayRouteFinderEndJob');
						var endPathwayId = ddlid('PathwayRouteFinderEndPathway');
						if (endPathwayId == null) endPathwayId = '';
						Place(CareerMapsDisplayControl.FireCalculatePathwayRoute('PathwayRouteFinderResults',startJobId,startPathwayId,endJobId,endPathwayId));
					}

					function OnJobSelect(jobId)
					{
						if (IsCareerPathwaySelected())
						{
							EditJobParents(jobId);
						}
						else
						{
							// Is Pathway Route Job Selected
							if (pathwayRouteStartJobId != '')
							{
								// Reset the pathway route finder starting job
								pathwayRouteStartJobId = '';

								OnPathwayRouteEndJobSelected(jobId);
							}
							else
							{
								pathwayRouteStartJobId = jobId;

								OnPathwayRouteStartJobSelected(jobId);
							}
						}
						if (typeof ajaxTimer != 'undefined' ) 
							{ajaxTimer.resetTimer();}	
					}

					function OnPathwayRouteStartJobSelected(jobId)
					{
						Place(CareerMapsDisplayControl.FireSetPathwayRouteFinderStartJob(jobId));
						document.getElementById('PathwayRouteFinder').style.visibility = 'visible';
					}

					function OnPathwayRouteEndJobSelected(jobId)
					{
						Place(CareerMapsDisplayControl.FireSetPathwayRouteFinderEndJob(jobId));
					}

					function EditJobParents(jobId)
					{
						if (IsCareerPathwaySelected())
						{
							Place(CareerMapsDisplayControl.FireShowCareerPathwayEditor(currentPathwayId,jobId));
							document.getElementById('CareerPathwayEditor').style.visibility = 'visible';
							this.GetExpanding();
						}
					}

					function RemoveJobParent(childParentJobLinkId, childJobId, pathwayId)
					{

						Place(CareerMapsDisplayControl.FireRemoveParentJobLink(childParentJobLinkId, pathwayId,childJobId ));
						GetExpanding();
					}

					var selectedPathwayIDs =	function() {	
													var sIDs = '',
														ePathwayCheckboxes = document.getElementsByClassName('PHE_Selected_Pathways'), i;

													for(i = 0; i < ePathwayCheckboxes.length; i+=1) {
														if (ePathwayCheckboxes[i].checked) {
															sIDs += ePathwayCheckboxes[i].value + ',';
														}
													}

													if (sIDs !== '') {
														sIDs = sIDs.substring(0,sIDs.length-1);
													}

													return sIDs;
												};

					function RemoveFromPathways(JobID)
					{
						var pathways = this.selectedPathwayIDs(), i,
							ePathwayCheckboxes = document.getElementsByClassName('PHE_Selected_Pathways');
						
						var res = CareerMapsDisplayControl.RemoveFromPathways(JobID, pathways);

						if (res.value != '') {
							Place(res);
						}
						else {
							for (i = 0; i < ePathwayCheckboxes.length; i+=1) {
								ePathwayCheckboxes[i].checked = false;		
							}		
						}
						if (typeof ajaxTimer != 'undefined' ) 
							ajaxTimer.resetTimer();	
					}

					function AddJobParent(parentJobListId,childJobId)
					{
						var selectedParentJobId = ddlid(parentJobListId);

						Place(CareerMapsDisplayControl.FireAddParentJobLink(selectedPathwayIDs(),childJobId,selectedParentJobId ));
						GetExpanding();
						
						//HideEditor('CareerPathwayEditor');
						if (typeof ajaxTimer != 'undefined' ) 
							ajaxTimer.resetTimer();
					}



					function ShowDetails(obj)
					{
						document.getElementById('pJobName').value = obj.title;
						document.getElementById('pCoords').value = obj.id;
					}

					function SaveCoordsToPathway()
					{
						var sCoord = document.getElementById('pCoords').value;

						var Pathways = document.getElementById('pPathways');
						var sPathways = '';
						for (i = 0; i < Pathways.options.length; i++)
						{
							if (Pathways.options[i].selected)
								sPathways = sPathways + Pathways.options[i].id + ',';
						}
						
						res = CareerMapsDisplayControl.SaveCoordsToPathway(sCoord, sPathways);
						alert(res.value);
					}

					// This currently only works for area tags of the shape circle.. based on 3 sets of coords for circles
					function zoom(whichWay)
					{
						ZoomChangeMapBtnCoords(whichWay);

						var eMovePic = document.getElementById('movePic');
						var eNumLayer = document.getElementById('NumbersLayer');

						var height = eMovePic.height;
						var width = eMovePic.width;
						var left = parseInt(eMovePic.style.left,10) || 0;
						var top = parseInt(eMovePic.style.top,10) || 0;

						if (whichWay == 'in')
						{
							eMovePic.height = height * 1.4;
							eMovePic.width = width * 1.4;
							eNumLayer.height = height * 1.4;
							eNumLayer.width = width * 1.4;

							// Need to do the maths to keep the image at the same center pos						
							eMovePic.style.left = (left - ((eMovePic.width / 2) - (width / 2))) + PosYOffset;
							eMovePic.style.top = (top - ((eMovePic.height / 2) - (height / 2))) + PosXOffset;
							eNumLayer.style.left = (left - ((eMovePic.width / 2) - (width / 2))) + PosYOffset;
							eNumLayer.style.top = (top - ((eMovePic.height / 2) - (height / 2))) + PosXOffset;

							PosXOffset = Math.floor(PosXOffset * 1.4);
							PosYOffset = Math.floor(PosYOffset * 1.4);
		
							var TheAreas = document.getElementsByClassName('hotspot');
							for(i = 0; i < TheAreas.length; i++)
							{
								// Get the info
								var sID = TheAreas[i].id;
								var sCoords = TheAreas[i].coords;
								var eNumbers = document.getElementById('num'+sID);
								var ePathway = document.getElementById('path'+sID);

								// Sort out the new coords
								var arrCoords = sCoords.split(',');
								var iLeft = TrimString(arrCoords[0]);
								var iTop = TrimString(arrCoords[1]);
								var iRadius = TrimString(arrCoords[2]);
								iLeft = Math.floor(iLeft * 1.4);
								iTop = Math.floor(iTop * 1.4);
								iRadius = Math.floor((iRadius * 1.4));
								iOffSet = Math.floor((iRadius / 2));

								// Set them
								TheAreas[i].coords = iLeft + ',' + iTop + ',' + arrCoords[2];
								if (eNumbers != null)
								{
									eNumbers.style.top = iTop - iOffSet;
									eNumbers.style.left = iLeft - iOffSet;
								}
								if (ePathway != null)
								{
									ePathway.style.top = iTop - iOffSet;
									ePathway.style.left = iLeft - iOffSet;
								}
							}
						}
						else if (whichWay == 'out')
						{
							eMovePic.height = height / 1.4;
							eMovePic.width = width / 1.4;
							eNumLayer.height = height / 1.4;
							eNumLayer.width = width / 1.4;

							// Need to do the maths to keep the image at the same center pos
							eMovePic.style.left = (left + ((width / 2) - (eMovePic.width / 2)));
							eMovePic.style.top = (top + ((height / 2) - (eMovePic.height / 2)));
							eNumLayer.style.left = (left + ((width / 2) - (eMovePic.width / 2)));
							eNumLayer.style.top = (top + ((height / 2) - (eMovePic.height / 2)));
                               
							PosYOffset = Math.floor(PosYOffset / 1.4);
							PosXOffset = Math.floor(PosXOffset / 1.4);

							var TheAreas = document.getElementsByClassName('hotspot');
							for(i = 0; i < TheAreas.length; i++)
							{
								// Get the info
								var sID = TheAreas[i].id;
								var sCoords = TheAreas[i].coords;
								var eNumbers = document.getElementById('num'+sID);
								var ePathway = document.getElementById('path'+sID);

								// Sort out the new coords
								var arrCoords = sCoords.split(',');
								var iLeft = TrimString(arrCoords[0]);
								var iTop = TrimString(arrCoords[1]);
								var iRadius = TrimString(arrCoords[2]);
								iLeft = Math.floor(iLeft / 1.4);
								iTop = Math.floor(iTop / 1.4);
								iRadius = Math.floor((iRadius / 1.4));
								iOffSet = Math.floor((iRadius / 2));
			
								// Set them
								TheAreas[i].coords = iLeft + ',' + iTop + ',' + arrCoords[2];
								if (eNumbers != null)
								{
									eNumbers.style.top = iTop - iOffSet;
									eNumbers.style.left = iLeft - iOffSet;
								}
								if (ePathway != null)
								{
									ePathway.style.top = iTop - iOffSet;
									ePathway.style.left = iLeft - iOffSet;
								}
							}
						}
						else if (whichWay == 'reset')
						{
                            $("#extraJobs").dialog("close");

                            eMovePic.height = 959;//1188;
							eMovePic.width = 1080;
							eNumLayer.height = 959;//1188;
							eNumLayer.width = 1080;

							changeMap('',false);

							// Get the original coord values for the circle hot spots
							var sOriginalCoords = document.getElementById('OriginalCoords').value;
							var sCoordInfo = sOriginalCoords.split('&&');
							for(i = 0; i < sCoordInfo.length; i++)
							{
								if (sCoordInfo[i] == '')
									continue;

								// Get the info
								var ElementCoordInfo = sCoordInfo[i].split('=');
								var sID = ElementCoordInfo[0];
								var sCoords = ElementCoordInfo[1];
								var eArea = document.getElementById(sID);
								var eNumbers = document.getElementById('num'+sID);
								var ePathway = document.getElementById('path'+sID);

								// Sort out the new coords
								var arrCoords = sCoords.split(',');
								var iLeft = TrimString(arrCoords[0]);
								var iTop = TrimString(arrCoords[1]);
								var iRadius = TrimString(arrCoords[2]);
								iOffSet = Math.floor((iRadius / 2));
			
								// Set them
								eArea.coords = iLeft + ',' + iTop + ',' + iRadius;
								eNumbers.style.top = iTop - iOffSet;
								eNumbers.style.left = iLeft - iOffSet;
								if (ePathway != null)
								{
									ePathway.style.top = iTop - iOffSet;
									ePathway.style.left = iLeft - iOffSet;
								}
							}

                            if (document.getElementById('MapPageStyle').innerHTML == 'Fullscreen')
							{
                                zoom('out');zoom('out');
								eMovePic.style.left = '18px';
								eMovePic.style.top = '50px';
								eNumLayer.style.left = '18px';
								eNumLayer.style.top	= '50px';
							}
							else
							{
								eMovePic.style.left = '-8px';
								eMovePic.style.top = '50px'; // '-100px';
								eNumLayer.style.left = '-8px';
								eNumLayer.style.top	= '50px';//'-100px';
							}
						}
					}

                    function OutPutPosition() {
                        var eMovePic = document.getElementById('movePic');
                        alert('left:' + eMovePic.style.left + ', top:' + eMovePic.style.top + ', height:' + eMovePic.height + ', width:' + eMovePic.width);
                    }

					function RoundNum(num)
					{
						var str = num+' '; // Turn into string
						if (str.indexOf('.') != -1)
						{
							str = str.substring(0, str.indexOf('.'));
						}
					
						return parseInt(TrimString(str));
					}

					var selObj = null;
					var NumbersLayer = null;

					function moveHandler(e)
					{
						if (e == null) { e = window.event; } 

						if (e.button <= 1 && dragOK)
						{
							selObj.style.left = e.clientX - dragXoffset + 'px';
							selObj.style.top = e.clientY - dragYoffset + 'px';
							NumbersLayer.style.left = e.clientX - dragXoffset + 'px';
							NumbersLayer.style.top = e.clientY - dragYoffset + 'px';
							return false;
						}
					}

					function cleanup(e) 
					{
						document.onmousemove = null;
						document.onmouseup = null;
						selObj.style.cursor = orgCursor;
						dragOK = false;
					}

					function dragHandler(e)
					{
						var htype = '-moz-grabbing';
						
						if (e == null) { e = window.event; htype='move'; }
	 
						var target = e.target != null ? e.target : e.srcElement;
						selObj = target;
						orgCursor = target.style.cursor;

						NumbersLayer = document.getElementById('NumbersLayer');

						if (target.className == 'vidFrame' || target.className == 'moveable') 
						{
							target.style.cursor = htype;
							dragOK = true;
							dragXoffset = e.clientX-parseInt(selObj.style.left);
							dragYoffset = e.clientY-parseInt(selObj.style.top);
							document.onmousemove = moveHandler;
							document.onmouseup = cleanup;
							return false;
						}
					}
					 
					document.onmousedown = dragHandler;

					function MoveMap(sDirection)
					{
						var xPos = parseInt(document.getElementById('movePic').style.left, 10); 
						var yPos = parseInt(document.getElementById('movePic').style.top, 10); 

						if (sDirection == 'Left') {
							xPos = xPos + DirectionAmount;
						}
						if (sDirection == 'Right') {
							xPos = xPos - DirectionAmount;
						}
						if (sDirection == 'Up') {
							yPos = yPos + DirectionAmount;
						}
						if (sDirection == 'Down') {
							yPos = yPos - DirectionAmount;
						}

						document.getElementById('movePic').style.left = xPos + 'px';
						document.getElementById('movePic').style.top = yPos + 'px';
						document.getElementById('NumbersLayer').style.left = xPos + 'px';
						document.getElementById('NumbersLayer').style.top = yPos + 'px';
					}

					function ChangeMapType(sType)
					{
						var sCurrentType = document.getElementById('CurrentMapType').value;

						if (sCurrentType == sType)
							return;

						document.getElementById('CurrentMapType').value = sType;

						// Can't just hide one and show another because of the layer's needed for this.
						var NumbersLayerContent = document.getElementById('NumbersLayer').innerHTML;
						var PathwayLayerContent = document.getElementById('PathwayLayer').innerHTML;

						document.getElementById('PathwayLayer').innerHTML = NumbersLayerContent;
						document.getElementById('NumbersLayer').innerHTML = PathwayLayerContent;

						// buttons
						if (sType == 'Pathways') {
							document.getElementById('PathwayBtn').className = 'MapTypeSelection';
							document.getElementById('VacancyBtn').className = '';
                            document.getElementById('PathwaysHelpText').style.display='';
                            document.getElementById('VacanciesHelpText').style.display='none';
						}
						else {
							document.getElementById('PathwayBtn').className = '';
							document.getElementById('VacancyBtn').className = 'MapTypeSelection';
                            document.getElementById('VacanciesHelpText').style.display='';
                            document.getElementById('PathwaysHelpText').style.display='none';
						}
					}


     

		
                 function CloseAnyDialogs()
                 {
                    $('#extraJobs').dialog('close');
                 }

                 function GetExtraVacancies(pathID)
                 {
                    var res = CareerMapsDisplayControl.GetExtraVacancies(pathID);
                    var parts = res.value.split('|'); 
                    //We should get : part 0true/false for left or right
                    //parts 1 is a colour
                    //part 2 is title
                    //parts 3 is the html for the first panel (About)
                    //parts 4 is the html for the second panel (Vacancies)
                    //parts 5 is the html for the third panel (Employers)
                    //parts 6 is the html for the 4th panel (FAQs)
                    //parts 7 is the html for the 5th panel (Case Studies)
                               
                    $('#Panel1').html(parts[3]);
                    $('#Panel2').html(parts[4]);
                    $('#Panel3').html(parts[5]);
                    $('#Panel4').html(parts[6]);
                    $('#Panel5').html(parts[7]);
                    if (parts[6] == "")
                        $('#Tab4').hide();
                    else
                       $('#Tab4').show();
                   if (parts[7] == "")
                       $('#Tab5').hide();
                   else
                       $('#Tab5').show();
                    
                    
                    return parts[0] + '|' + parts[1] + '|' + parts[2];
                 }