/* --------------------------------------------------
Author: Anastasios Pallas / tcpallas@gmail.com
Version 1.0
Last Update: 2024-07-08
-------------------------------------------------- */


// Update stage will render next frame
createjs.Ticker.framerate = 15;
createjs.Ticker.addEventListener("tick", tickHandler);

var anim_timer = 0;

function tickHandler(e) {
	stage.update();

	if (anim_step == 1) {
		// fill beaker A
		if (beaker_nail[0].visible) {
			beaker_cu[0].x = config.center_x + 90;
			beaker_cu[0].y = config.center_y + 70;
			beaker_cu[3].x = beaker_cu[0].x;
			beaker_cu[3].y = beaker_cu[0].y;
			beaker_cu[0].visible = false;
			beaker_cu[3].visible = true;
		}

		// rotate beaker
		if (beaker_nail[0].visible && beaker_cu[3].rotation < 60) {
			beaker_cu[3].rotation += 5;
		}

		// fill the other beaker
		if (beaker_cu[3].rotation == 60) {
			beaker_nail[0].visible = false;
			beaker_nail[1].visible = true;
			beaker_area1.visible = false;
			beaker_area2.visible = true;
		}

		// rotate beaker back
		if (beaker_nail[1].visible && beaker_cu[3].rotation > 0) {
			beaker_cu[3].rotation -= 5;
		}

		if (beaker_nail[1].visible && beaker_cu[3].rotation == 0) {
			beaker_cu[1].x = beaker_cu[3].x;
			beaker_cu[1].y = beaker_cu[3].y;
			beaker_cu[3].visible = false;
			beaker_cu[1].visible = true;
		}
		
	}

	if (anim_step == 2) {
		// fill beaker B
		beaker_cu[1].x = config.center_x + 210;
		beaker_cu[1].y = config.center_y + 70;
		beaker_cu[3].x = beaker_cu[1].x;
		beaker_cu[3].y = beaker_cu[1].y;
		beaker_cu[1].visible = false;
		beaker_cu[3].visible = true;

		// rotate beaker
		if (beaker_wire[0].visible && beaker_cu[3].rotation < 60) {
			beaker_cu[3].rotation += 5;
		}

		// fill the other beaker
		if (beaker_cu[3].rotation == 60) {
			beaker_wire[0].visible = false;
			beaker_wire[1].visible = true;
			beaker_area1.visible = true;
			beaker_area2.visible = false;
		}

		// rotate beaker back
		if (beaker_wire[1].visible && beaker_cu[3].rotation > 0) {
			beaker_cu[3].rotation -= 5;
		}

		if (beaker_wire[1].visible && beaker_cu[3].rotation == 0) {
			// beaker_cu[2].x = beaker_cu[3].x;
			// beaker_cu[2].y = beaker_cu[3].y;
			beaker_cu[3].visible = false;
			beaker_cu[2].visible = true;
		}

		// put beaker CuSO4 back
		if (beaker_cu[2].visible) {
			if (beaker_cu[2].x < config.center_x - 230) {
				beaker_cu[2].x += 10;
			}
			if (beaker_cu[2].x > config.center_x - 230)  {
				beaker_cu[2].x -= 10;
			}
			if (beaker_cu[2].y < config.center_y + 142) {
				beaker_cu[2].y += 10;
			}
			if (beaker_cu[2].y > config.center_y + 142) {
				beaker_cu[2].y -= 10;
			}
		}

		config.current_step = 2;
		$("#help_step1").hide();
		$("#help_step2").show();

	}

	if (anim_step == 3) {

		nail[0].x = config.center_x + 120;
		nail[0].y = config.center_y + 80;

		// rotate nail
		if (nail[0].rotation < 75) {
			nail[0].rotation += 5;
		}
		
		// put nail to beaker A
		if (nail[0].rotation == 75) {
			nail[0].visible = false;
			beaker_nail[1].visible = false;
			beaker_nail[2].visible = true;
			beaker_area1.visible = false;
			beaker_area2.visible = true;
		}
	}

	if (anim_step == 4) {

		// put wire to beaker B
		wire[0].x = config.center_x + 240;
		// wire[0].y = config.center_y + 70;

		if (wire[0].y != config.center_y + 110) {
			wire[0].y++;
		}

		if (wire[0].y == config.center_y + 110) {
			wire[0].visible = false;
			beaker_wire[1].visible = false;
			beaker_wire[2].visible = true;
			beaker_area1.visible = false;
			beaker_area2.visible = false;
		}

		if (beaker_nail[2].visible && beaker_wire[2].visible) {

			anim_timer++;

			config.current_step = 3;
			$("#help_step1").hide();
			$("#help_step2").hide();
			$("#help_step3").show();

			if (anim_timer > 60) {
				beaker_nail[2].visible = false;
				beaker_nail[3].visible = true;
				beaker_wire[2].visible = false;
				beaker_wire[3].visible = true;
			}
		}

		if (beaker_nail[3].visible && beaker_wire[3].visible) {

			anim_timer++;

			if (anim_timer > 90) {
				beaker_nail[3].visible = false;
				beaker_nail[4].visible = true;
				beaker_wire[3].visible = false;
				beaker_wire[4].visible = true;
			}			

		}

		if (beaker_nail[4].visible && beaker_wire[4].visible) {
			anim_timer = 0;
			config.current_step = 4;
			$("#help_step1").hide();
			$("#help_step2").hide();
			$("#help_step3").hide();
			$("#help_step4").show();
			anim_step = 5;
		}	

	}


	if (anim_step == 5) {

		// take out nail from beaker A
		beaker_nail[4].visible = false;
		beaker_nail[5].visible = true;		
		nail[2].visible = true;

		if (nail[2].rotation != 0) {
			nail[2].rotation -= 5;
		}

		// return nail to table
		if (nail[2].rotation == 0) {
			if (nail[2].x < config.center_x - 80) {
				nail[2].x += 5;
			}
			if (nail[2].x > config.center_x - 80)  {
				nail[2].x -= 5;
			}
			if (nail[2].y < config.center_y + 170) {
				nail[2].y += 5;
			}
			if (nail[2].y > config.center_y + 170) {
				nail[2].y -= 5;
			}
		}

		// take out wire from beaker B
		beaker_wire[4].visible = false;
		beaker_wire[5].visible = true;
		wire[2].visible = true;

		// return wire to table
		if (wire[2].x < config.center_x - 0) {
			wire[2].x += 5;
		}
		if (wire[2].x > config.center_x - 0)  {
			wire[2].x -= 5;
		}
		if (wire[2].y < config.center_y + 150) {
			wire[2].y += 5;
		}
		if (wire[2].y > config.center_y + 150) {
			wire[2].y -= 5;
		}

		// experiment is completed
		// if (nail[2].x == config.center_x - 130 && wire[2].x == config.center_x - 0) {
			config.current_step = 5;
			$("#help_step1").hide();
			$("#help_step2").hide();
			$("#help_step3").hide();
			$("#help_step4").hide();
			$("#help_step5").show();
		// }
		
	}

}
