
//19 Dec 2021
Profession.goBack = null;
Profession.bodyPartArray = [];							//body parts array
Profession.personId = 0;								//girl or boy id
Profession.homeFlag = false;
var openModalFlag = false, pantFlag = false, muteFlag = false, drawFlag = false, clearCanvasFlag = false;
var clickItemDesc = '';
var imgCnt = 0, arrayimgcnt = 0, drawImgX = 15, drawImgY = 40, randomImgArray = [];
var questionId = 0, startTime = 0, scoredMarks = 0, resId = 0, totalMarks = 10;
/* //Function is for loader & Page load
$(document).ready(function () {
	$(".se-pre-con").fadeOut("slow");
	if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i))
		Utils.mobileDeviceFlag = true;
	/* if(Utils.mobileDeviceFlag)
		//Utils.Path=Android.getMediaPath("MakeUpShakeUp");  
	setTimeout(function () {
		$("#coverpage").show();
		$("#personPage,#setButton,#frame,#endpage,#screen3div,#home").hide();
		$("#clearButtonDiv").css("visibility", "hidden");
		Profession.init();
	}, 300);
});

Profession.init = function () {
	Profession.createButtons();
} */

/* Profession.createPersonDivs = function () {								// boy-girl option divs
	var personDiv, personImg;
	for (var i = 0; i < 2; i++) {
		personDiv = document.createElement("div");
		personDiv.setAttribute("id", "personDiv" + i);
		personDiv.setAttribute("class", "noPadding col-lg-3 col-md-3 col-xs-3 col-sm-3 col-sm-offset-2 col-lg-offset-2 col-md-offset-2 col-xs-offset-2");
		personPage.append(personDiv);

		personImg = document.createElement("img");
		personImg.setAttribute("id", "personImg" + i);
		personImg.setAttribute("class", "noPadding img-responsive col-lg-12 col-md-12 col-xs-12 col-sm-12");
		personImg.setAttribute("onclick", "Profession.selectPerson(this)");
		personImg.setAttribute("src", Utils.Path + Profession.personImages.imgname + i + Profession.personImages.imgtype);
		$(personImg).data("ans", i);
		personDiv.appendChild(personImg);
	}
} */

Profession.createButtons = function () {							//create body part buttons
	var buttonDiv;
	for (var i = 0; i < 6; i++) {
		if (i < 3)
			buttonDiv = document.getElementById('buttonDiv1');
		else
			buttonDiv = document.getElementById('buttonDiv2');
		Profession.createDivs(buttonDiv, i, "Profession.openModal(this)", Profession.buttonImages.imgname + i + Profession.buttonImages.imgtype, '');
		$("#buttonimg" + i).data("ans", Profession.Data[Profession.personId].data[i].id);
	}
}
Profession.openModal = function (element) {							//shows modal
	var modalDiv, id; arrayimgcnt = 0, randomImgArray = [];
	$(".modal-css").css("visibility", "hidden");
	id = element.id;
	Profession.clickedButtonData = $("#" + id).data("ans");			//get data of clicked button
	//imgCnt = 0;
	switch(id){
		case 'buttonimg0':
			selectedIcon = 0;
			break;
		case 'buttonimg1':
			selectedIcon = 1;
			break;
		case 'buttonimg2':
			selectedIcon = 2;
			break;
		case 'buttonimg3':
			selectedIcon = 3;
			break;
		case 'buttonimg4':
			selectedIcon = 4;
			break;
		case 'buttonimg5':
			selectedIcon = 5;
			break;
	} 

	while(randomImgArray.length != Profession.Data[Profession.personId].data[selectedIcon].selectedModalImg.length){
		randomimgCnt = Math.floor(Math.random() * Profession.Data[Profession.personId].data[selectedIcon].selectedModalImg.length);
		while(randomImgArray.includes(randomimgCnt)){
			randomimgCnt = Math.floor(Math.random() * Profession.Data[Profession.personId].data[selectedIcon].selectedModalImg.length);
		}
		randomImgArray.push(randomimgCnt);
	}
	arrayimgcnt = randomImgArray[imgCnt];
	$(".modal-css").empty();									//empty elements in the modal
	if ($("#" + id).data("ans") < 3)
		modalDiv = document.getElementById("modalDiv1");
	else
		modalDiv = document.getElementById("modalDiv2");
	
	if(!openModalFlag){
		openModalFlag = true;
		$(modalDiv).css("visibility", "visible");
		//number of rows you want to create
		for (var i = 0; i < Math.ceil(Profession.Data[Profession.personId].data[selectedIcon].imgCnt / 2); i++)
			Profession.createDivs(modalDiv, i, 'Profession.fixImage(this)', '', $("#" + id).data("ans"));
	}
	else{
		imgCnt = 0;
		openModalFlag = false;
		$(modalDiv).css("visibility", "hidden");
	}
}
Profession.createDivs = function (parentDiv, idName, onclickfun, img, No) {   //Divs for modal & body part buttons
	var buttonnewDiv, buttonImg, newDiv, subDiv, subImage;
	if (parentDiv == modalDiv1 || parentDiv == modalDiv2) {
		newDiv = document.createElement("div");
		newDiv.setAttribute("id", "passage" + idName);
		newDiv.setAttribute("class", "marginClass noPadding col-sm-12 col-lg-12 col-md-12 col-xs-12");
		parentDiv.appendChild(newDiv);
		for (var j = 0; j < 2; j++) {
			if (Profession.Data[Profession.personId].data[No].imgCnt > arrayimgcnt) {
				subDiv = document.createElement("div");
				subDiv.setAttribute("id", "subPassage" + idName + j);
				subDiv.setAttribute("class", " leftClass noPadding  col-sm-6 col-lg-6 col-md-6 col-xs-6");
				newDiv.appendChild(subDiv);

				subImage = document.createElement("img");
				subImage.setAttribute("class", "img-responsive col-sm-12 col-lg-12 col-md-12 col-xs-12 noPadding heightClass");
				subImage.setAttribute("onclick", onclickfun);
				subImage.setAttribute("id", "modalimg" + idName + j);
				subImage.setAttribute("src", Utils.Path + Profession.Data[Profession.personId].data[No].imgname + arrayimgcnt + Profession.Data[Profession.personId].data[No].imgtype);
				subDiv.appendChild(subImage);
				$("#modalimg" + idName + j).data("ans", Profession.Data[Profession.personId].data[No].selectedModalImg[arrayimgcnt].id);
				$("#modalimg" + idName + j).data("description", Profession.Data[Profession.personId].data[No].selectedModalImg[arrayimgcnt].name);
				imgCnt++;
				arrayimgcnt = randomImgArray[imgCnt];
			}
		}
	}
	else {
		buttonnewDiv = document.createElement("div");
		buttonnewDiv.setAttribute("id", "button" + idName);
		buttonnewDiv.setAttribute("class", "buttonCss noPadding col-sm-12 col-lg-12 col-md-12 col-xs-12");
		parentDiv.appendChild(buttonnewDiv);

		buttonImg = document.createElement("img");
		buttonImg.setAttribute("class", "img-responsive col-sm-12 col-lg-12 col-md-12 col-xs-12 noPadding ");
		buttonImg.setAttribute("onclick", onclickfun);
		buttonImg.setAttribute("id", "buttonimg" + idName);
		buttonImg.setAttribute("src", Utils.Path + img);
		buttonnewDiv.appendChild(buttonImg);
	}
}
Profession.playGame = function () 								//Function called on button click to show screen-3
{
	Profession.goBack = null;
	if(!Profession.attemptFlag){
		scoredMarks = -1;
		Profession.calculateScore();
	}
	$("#screen1Div").css('display', 'none');
	document.body.style.backgroundImage = Utils.Path + "url('images/skin/BG_Level_3.jpg')";
	if(muteFlag == false){
		document.getElementById("muteImg").src = Utils.Path + "images/skin/sound.png";
		document.getElementById("playSoundInLoop").src = Utils.Path + "sounds/instructions/Modern_Attempt.mp3";
		document.getElementById("playSoundInLoop").loop = true;
		document.getElementById("playSoundInLoop").play()
	}
	document.getElementById("playSound").src = Utils.Path + "sounds/instructions/screen3_complete_Instr.mp3";
    document.getElementById("playSound").play(); 
	//getDuration(Utils.Path + 'sounds/instructions/screen3_makeprofe_instr.mp3');
	
	document.getElementById('set').setAttribute('onclick', "Profession.setPicture()");
	//document.body.style.backgroundImage = "url(" + Utils.Path + "Images/professionMakingImages/background2.png)";
	$("#personPage,#frame,#endpage,#acknowledgementDiv,#nextBtn, #finalPage, #widges").hide();
	$("#screen2Div").css('display', 'none');
	$("#buttonDiv1,#buttonDiv2,#modalDiv1,#screen3div,#modalDiv2").show();
	$("#nextScreenDiv, #clearButtonDiv, #soundBtn, .modal-css").css("visibility", "hidden");
	$("#setButton, #prevScreenDiv, #muteButton").css("visibility", "visible");
	Profession.canvas = document.getElementById("myCanvas");
	Profession.context = Profession.canvas.getContext("2d");
	Profession.selectPerson();
}

Profession.selectPerson = function (element) {											//selects Gender
	//Profession.personId = $(element).data("ans");
	Profession.personId = 0;							//Choose Girl or Boy
	Profession.homeFlag = false;
	document.getElementById('clearButtonDiv').style.visibility = "visible";
	//document.body.style.backgroundImage = "url(" + Utils.Path + "Images/professionMakingImages/background3.png)";
	width = 170;												//width of body image
	height = 350; 												//height of body image
	Profession.context.clearRect(0, 0, 200, 400);
	/* $("#personPage").hide();
	$("#buttonDiv1,#muteButton,#setButton,#buttonDiv2,#modalDiv1,#screen3div,#modalDiv2").show(); */
	Profession.createBody();
}
Profession.createBody = function () {													//show human body
	var mainBody;
	Profession.bodyPartArray = [];
	Profession.goBack = "personMenu";
	mainBody = document.getElementById("mainBody");
	//mainBody.src = Utils.Path + "images/facemakingimages/body_0.png";
	mainBody.src = Utils.Path + Profession.bodyImages.imgname + Profession.personId + Profession.bodyImages.imgtype;
	mainBody.onload = function () { Profession.context.drawImage(mainBody, drawImgX, drawImgY, width, height); };
}
Profession.fixImage = function (element) {									//push selected body part items into Array
	var x, y, width, height;
	drawFlag = true;
	Profession.homeFlag = true;
	document.getElementById("playSound").src = Utils.Path + "sounds/instructions/propDrag.mp3";
	document.getElementById("playSound").play();
	x = Profession.Data[Profession.personId].data[Profession.clickedButtonData].selectedModalImg[$("#" + element.id).data("ans")].x;
	y = Profession.Data[Profession.personId].data[Profession.clickedButtonData].selectedModalImg[$("#" + element.id).data("ans")].y;
	width = Profession.Data[Profession.personId].data[Profession.clickedButtonData].selectedModalImg[$("#" + element.id).data("ans")].width;
	height = Profession.Data[Profession.personId].data[Profession.clickedButtonData].selectedModalImg[$("#" + element.id).data("ans")].height;
	
	switch (Profession.clickedButtonData) {
		case 0: Profession.tempVar0 = element;		//HAIR
			if(clickItemDesc != "astraounut_helmet")		//For astronut helmet
				Profession.bodyPartArray[3] = "Profession.context.drawImage(Profession.tempVar0," + x + "," + y + "," + width + "," + height + ")";
			break;

		case 1: Profession.tempVar4 = element;		//SHIRT & DRESSESS
			clickItemDesc = $(element).data("description");
			Profession.bodyPartArray[2] = "Profession.context.drawImage(Profession.tempVar4," + x + "," + y + "," + width + "," + height + ")";
			break;

		case 2: Profession.tempVar5 = element;		//PANT
			if(clickItemDesc != "one_piece_shirt" || clickItemDesc != "frok_shirt"){		//For Anganwadi worker Sari
				Profession.bodyPartArray[1] = "Profession.context.drawImage(Profession.tempVar5," + x + "," + y + "," + width + "," + height + ")";
			}
			if(clickItemDesc != "anganwadi_worker_sari"){		//For Anganwadi worker Sari = should not select astronut pant
				pantFlag = true;
				Profession.bodyPartArray[1] = "Profession.context.drawImage(Profession.tempVar5," + x + "," + y + "," + width + "," + height + ")";
			}
			if(pantFlag)
				clickItemDesc = $(element).data("description");
			break;

		case 3:	Profession.tempVar1 = element;		//CAP	
			clickItemDesc = $(element).data("description");
			Profession.bodyPartArray[4] = "Profession.context.drawImage(Profession.tempVar1," + x + "," + y + "," + width + "," + height + ")";
			break; 
			
		case 4:	Profession.tempVar2 = element;		//TOOL
			if(clickItemDesc != "astraounut_helmet")		//For astronut helmet
				Profession.bodyPartArray[5] = "Profession.context.drawImage(Profession.tempVar2," + x + "," + y + "," + width + "," + height + ")";
			break; 

		case 5: Profession.tempVar6 = element;		//SHOES
			if(clickItemDesc != "astraounut_pant")
				Profession.bodyPartArray[0] = "Profession.context.drawImage(Profession.tempVar6," + x + "," + y + "," + width + "," + height + ")";
			break;
	}
	Profession.drawOnCanvas();
}
Profession.drawOnCanvas = function () {									//redraw body with selected items
	var mainBody = document.getElementById("mainBody");
	Profession.context.clearRect(0, 0, 200, 400);
	Profession.context.drawImage(mainBody, drawImgX, drawImgY, width, height);
	pantFlag = false;
	if(clickItemDesc == "astraounut_pant")			//For astraonut pant = no shoes should be selected
		Profession.bodyPartArray[0] = "";
	if(clickItemDesc == "astraounut_helmet")		//For astraonut helmet = no hair style should be selected
		Profession.bodyPartArray[3] = "";
	if(clickItemDesc == "astraounut_helmet")		//For astraonut helmet = no tools(Ear rings, goggles) should be selected
		Profession.bodyPartArray[5] = "";
	if(clickItemDesc == "anganwadi_worker_sari" || clickItemDesc == "one_piece_shirt" || clickItemDesc == "frok_shirt")		//For Anganwadi Worker Sari
		Profession.bodyPartArray[1] = "";
	for (var i = 0; i < Profession.bodyPartArray.length; i++){	
		eval(Profession.bodyPartArray[i]);											//draw selected item on canvas
	}
}
Profession.clearCanvasFun = function () {										//clears canvas
	drawFlag = false;
	clearCanvasFlag = true;
	clickItemDesc = '';		//For astraonut helmet		//For Anganwadi Worker Sari
	$(".modal-css").css("visibility", "hidden");
	Profession.context.clearRect(0, 0, 200, 400);
	Profession.createBody();
}
Profession.setPicture = function () {											//creates copy of  human body
	$("#frame").show();
	$("#endpage,#screen3div").hide();
	$("#prevScreenDiv, #nextScreenDiv, #muteButton, #clearButtonDiv").css("visibility", "hidden");
	cloneCanvas(Profession.canvas);
}
function cloneCanvas(oldCanvas) {									//creates clone for human body
	var newCanvas, newContext, newDiv;
	//document.body.style.backgroundImage = "url(" + Utils.Path + "images/professionMakingImages/background4.png)";
	document.getElementById("photographDiv").innerHTML = "";
	newCanvas = document.createElement('canvas');		  //create a new canvas
	newContext = newCanvas.getContext('2d');
	newCanvas.setAttribute("class", "col-lg-12 col-md-12 col-xs-12 col-sm-12 noPadding");
	//newCanvas.width = oldCanvas.width;					//set dimensions	
	newCanvas.height = oldCanvas.height;
	newContext.drawImage(oldCanvas, 0, 0);				//apply the old canvas to the new one
	photographDiv.append(newCanvas);
	Profession.photoFrame();
}

Profession.photoFrame = function () {	
	Profession.homeFlag = false;
	document.getElementById("playSound").src = Utils.Path + "sounds/instructions/screen3_Photo_instr.mp3";
	document.getElementById("playSound").play();
	document.getElementById("message").innerHTML = Profession.Message[0].message;
	$("#frame").addClass("pictureClass animated zoomIn");
	document.getElementById('set').setAttribute('onclick', "Profession.gameOver()");

	if(drawFlag)								//last page photo frame
		scoredMarks = 10;
	else if(clearCanvasFlag)
		scoredMarks = -1;
	else
		scoredMarks = -1;
	drawFlag = false;
	clearCanvasFlag = false;
	Profession.calculateScore();
}

/* Profession.callHome = function () {								//home click function
	document.getElementById("playSound").pause();
	if (Profession.goBack == "personMenu")
		Profession.playGame();
	else {
		Profession.homeFlag = false;
		location.reload(true);
	}
	if (Profession.homeFlag == true) {
		scoredMarks = 0;
		Profession.calculateScore();
	}
} */

Profession.muteBgSound = function()
{
    var displayScreen3 = document.getElementById("screen3Div").style.display;

	if(!muteFlag){
		muteFlag = true;
		$('#muteImg').prop("src",Utils.Path+"images/skin/sound_off.png");		//Screen-3
		$('#muteBtnImg').prop("src",Utils.Path+"images/skin/sound_off.png");	//Screen-1 & Screen-2
		document.getElementById('playSoundInLoop').pause();
	}
	else{
		muteFlag = false;
		$('#muteImg').prop("src",Utils.Path+"images/skin/sound.png");		//Screen-3
		$('#muteBtnImg').prop("src",Utils.Path+"images/skin/sound.png");	//Screen-1 & Screen-2
		if(displayScreen3 == 'block'){				//Screen-3
			document.getElementById('playSoundInLoop').src = Utils.Path + "sounds/instructions/Modern_Attempt.mp3";
			document.getElementById('playSoundInLoop').loop = true;
			document.getElementById('playSoundInLoop').play();
		}
		else{										//Screen-1 & Screen-2
			document.getElementById('playSoundInLoop').src = Utils.Path + "sounds/instructions/Classical_Carnivale.mp3";
			document.getElementById('playSoundInLoop').loop = true;
			document.getElementById('playSoundInLoop').play();
		}
	}
}

Profession.calculateScore = function () {										//calculates score
	console.log(resId, questionId, scoredMarks, totalMarks, 1, startTime, label);
	if (Utils.mobileDeviceFlag)
		Android.addScore(resId, questionId, scoredMarks, totalMarks, 1, startTime, label);
}