
var hspImgArr = []; 

var hspOgImgArr = [];

var hspScaleArr = [];

var hspPosArr = [];

$( document ).ready(function() {
	
	$(".hsp_img img").each(function(index) {
		hspOgImgArr[index] = Number($(this).attr("width"));
	});
	
	
	$(".image_hsp_holder").each(function(index) {
		
		var temp1Arr = []
		
		$(this).find(".image_hsp").each(function(i, elm) {

			var temp2Arr = []
			var mL = $(this).css("margin-left").split("p")[0];
			var mT = $(this).css("margin-top").split("p")[0];
			
			temp2Arr.push(mL);
			temp2Arr.push(mT);
			
			temp1Arr[i] =  temp2Arr;

		});
		hspPosArr[index] = temp1Arr;
			
	});
	

	$(window).resize(function() {		
		
		rePosHotSpots();
		
	});
	
	$('.image_hsp').click(function(e){
		/* lock image hsp in order 100224 */
		if (!$(this).hasClass('image_hsp_locked')) {
		
			$('.image_hotspot_reveal').hide();
			$('.image_hsp').css('cursor','pointer');

			var imgID = $(this).attr('id').split('hsp_')[1];		
			var hsSec = imgID.split('_')[0];
			var hsItem = imgID.split('_')[1];
		
			var img_sec = '#sec_' + hsSec;
			var totalIcons = $('#sec_' + hsSec + ' .image_hsp').length;
			//$("#image_leadin_"+hsSec).css("display","none")
			//$("#image_ind_"+hsSec).css("display","block")

			/* lock image hsp in order 100224 */
			var nextHsItem = Number(hsItem) + 1;		
			$('#image_hsp_'+hsSec+'_'+nextHsItem).removeClass("image_hsp_locked");		
			
			$('#image_hsp_reveal_'+hsSec+'_'+hsItem).fadeIn(500, function(){
				if(isWeb){
					/* 20240130 accessibility 2024 */
					$(this).find('.image_hotspot_start').focus();
				}
			});
			
					
			if(Number($(this).attr('data-image-hs')) == 0){
				$(this).attr('data-image-hs',1);
			}
			
			
			
			isImgHsDone(img_sec);		
			
			$(this).addClass("image_hsp_visited")
		
			return false;		
		}
		/* lock image hsp in order 100224 */
		else {
			return false;
		}
	});	
	
	/* added keyboard accessibility */
	$('.image_hsp').keypress(function (e) {
		if (e.keyCode == 13 || e.keyCode == 32) {
			
			$(this).trigger('click');
		}		
	});	

	/* 20240130 accessibility 2024 */
	$('.image_hotspot_next_btn').click(function(e){
		var popID = Number($(this).parent().attr("id").split("_")[4]) + 1;
		var secID = $(this).parent().attr("id").split("_")[3];
		$("#image_hsp_"+secID+"_"+popID).focus();
	});
	
	/* 20240130 accessibility 2024 */
	$('.image_hotspot_next_btn').keypress(function (e) {
		if (e.keyCode == 13 || e.keyCode == 32) {
			$(this).trigger('click');
		}
	});
	
	/* 20240130 accessibility 2024 */
	$('.image_hotspot_this_btn').click(function(e){
		var popID = $(this).parent().attr("id").split("_")[4];
		var secID = $(this).parent().attr("id").split("_")[3];
		$("#image_hsp_"+secID+"_"+popID).focus();
	});
	
	/* 20240130 accessibility 2024 */
	$('.image_hotspot_this_btn').keypress(function (e) {
		if (e.keyCode == 13 || e.keyCode == 32) {
			$(this).trigger('click');
		}
	});

});


function rePosHotSpots(){
	
	//$('.image_hotspot_reveal').hide();
		
		
	$(".hsp_img").each(function(index) {

		hspImgArr[index] = Number($(this).width());

		hspScaleArr[index] = Number(Number(hspImgArr[index]) / Number(hspOgImgArr[index]));
	});	

	$(".image_hsp_holder").each(function(index) {

		/* lock image hsp in order 100224 */
		var imageHspSec = Number($(this).attr('id').split('_')[3]) - 1;
		var hideHspLocked = false;
		if ((document.trackingArr[imageHspSec] == 1) || (document.lockedArr[imageHspSec] == 0))
		{
			hideHspLocked = true;
		}			
		
		$(this).find(".image_hsp").each(function(i, elm) {

			/* lock image hsp in order 100224 */
			if (hideHspLocked)
			{
				$(this).removeClass("image_hsp_locked")
			}
			
			var mL = hspPosArr[index][i][0];
			var mT = hspPosArr[index][i][1]

			//console.log("mL = " + mL + "   mT = " + mT)

			var scale = Number(hspScaleArr[index]).toFixed(2)

			mL = Math.round(mL * scale);
			mT = Math.round(mT * scale);

			if(document.textDirection == "rtl"){
				$(this).css("margin-right", mL+"px");
			}else{
				$(this).css("margin-left", mL+"px");
			}
			$(this).css("margin-top", mT+"px");

		});

	});
	
}


/* 
	isImgHsDone function 
	
	mark each hotspot as viewed when clicked
	called when hotspot clicked
*/

function isImgHsDone(img_sec){
	secNum = img_sec.split('_')[1]
	var hotspotDone = 0;
	var clicked = 0;
	$(img_sec).find('.image_hsp').each(function(index, element) {
				
		var data = Number($(this).attr('data-image-hs'));
		if(data === Number(1)){
			hotspotDone++;
			clicked = Number($('#sec_'+secNum).attr('data-clicked'));
			clicked +=1;
			$('#sec_'+secNum).attr('data-clicked',clicked);
			$(this).attr('data-image-hs','2');
		}
    });
					
	var totalClicked = Number($('#sec_'+secNum).attr('data-clicked'))
	var totalClicks = Number(document.clickArr[Number(secNum) - 1])
	if(totalClicked == totalClicks){	
		if(isAndroidTablet || isAndroidPhone || isMacChrome){
			document.intComplete = true;
			clearInterval(document.lockinterval)
			document.lockinterval = setInterval(function(){
				che = img_sec
				secNum = img_sec.split('_')[1]
				document.getnear(che);
				isPageComplete(secNum);
				if(($('#sec_'+(parseInt(secNum)+1)).is(':visible') || !$('#right_nav').hasClass('locked')) && document.courseLockedDown == true){
					clearInterval(document.lockinterval)
				} 
			},250)
		}else{
			document.intComplete = true;
			isPageComplete(secNum);
		}
		
		document.intComplete = true;
	
		isPageComplete(secNum);
		isHotSpotScreen = false;
	}
	
}


$('.image_hsp').attr('data-image-hs',0);