// variable declarations
		var images = new Array(1,3,0,5,0,0,6,0,0,0,8,0,97,0,3,44); // just puts some random numbers in the array
		var move = new Array(0,0,0,0); // puts 0's into the move array
		var imageStore = "blank"; // this is a temp variable used to temp store image src when they are being changed.
		var play = false; // control variable to emabled or disable the 'move tile' functions.
		var correctTiles = 0; // counter used to count up the number of tiles that are in their correct positions
		var playCounter = 0; // counts up the number of tiles the user has moved.

		// populates array with image SRC strings
		for(var index=0;index < images.length;index++) {
			// squentially puts the correct daemon images in order in the array for displaying how the image should look.
			images[index] = "../images/puzzle_images/daemon_" + (index+1) + ".jpg";
		}
		// manually inserts the last array element as the blank tile.
		images[images.length-1] = "../images/puzzle_images/blank.jpg";


		// sets all the img src attributes to the contents of the array which causes the image src's to be equal to the array.
		function showPicture() {
			for(var index=0;index < images.length;index++) {
				// gets the right image ID to allow the src to be overwritten
				var pic_obj = document.getElementById("daemon" + (index+1));
					// assigns the value of the array to the new image tag src.
	         		pic_obj.src = images[index];
	         	}

		}

		// randomly moves images around the array and then displays on screen using showPicture function
		function randomise() {
				// for loop that itterates through the array so each src image can be swapped with another.
			for (var index=0;index < 3;index++) {
				for(var index=0;index < images.length;index++) {
					// copies address number1(index position) to temp store
					imageStore = images[index];
					// gets random number and puts in variable
					var randomNo = getRandomInRange(0,15);
					// copies number2 address to place of number1
					images[index] = images[randomNo];
					// copies address of number1 in temp store, to position of address number 2
					images[randomNo] = imageStore;

					play = true; // allows the user to play again if they have randomized the images again.
					playCounter = 0; // resets the counter representing the number of tiles moved
				}
				showPicture(); // uses the showPicture function to show the contents of the array in the table of images.
			}
		}



		function moveTheTile(prmClicked_Image,move_position) {

					// copies address number1(index position) to temp store
				imageStore = images[prmClicked_Image-1];
					// copies position 2 to position 1
				images[prmClicked_Image-1] = images[(move[move_position]-1)];
					// copies number2 address to place of number1
				images[(move[move_position]-1)] = imageStore;
				showPicture(); // shows the new contents of the array in the table of images.
				var p_obj = document.getElementById("tilemove"); // gets the id of the first message to update it as the nodeValue
				p_obj.firstChild.nodeValue = "Tile number " + prmClicked_Image + " has changed position.";
				playCounter++; // increases the play counter because a tile has moved.
				var p_obj = document.getElementById("playcounter"); // gets the id of the text message for the number of tiles moved
				// assigns the new text and playcounter number as the nodeValue for the message.
				p_obj.firstChild.nodeValue = "Number of tiles moved: " + playCounter;

				var thissound = document.getElementById("sound1");
				thissound.Play();

		}


		function canMove(clicked_image) {
			// function that puts the values in the move array, so we can check which possible positions the blank space is in
			makeMoveArray(clicked_image);

			if(images[(move[0]-1)] == "../images/puzzle_images/blank.jpg" && play != false) {
					// calls the moveTheTile function, and passes it the image that was clicked, and the array element number 0 that it needs to check
					moveTheTile(clicked_image,0);

			}
			else if(images[(move[1]-1)] == "../images/puzzle_images/blank.jpg" && play != false) {
					// calls the moveTheTile function, and passes it the image that was clicked, and the array element number 1 that it needs to check
					moveTheTile(clicked_image,1);

			}
			else if(images[(move[2]-1)] == "../images/puzzle_images/blank.jpg" && play != false) {
					// calls the moveTheTile function, and passes it the image that was clicked, and the array element number 2 that it needs to check
					moveTheTile(clicked_image,2);

			}
			else if(images[(move[3]-1)] == "../images/puzzle_images/blank.jpg" && play != false) {
					// calls the moveTheTile function, and passes it the image that was clicked, and the array element number 3 that it needs to check
					moveTheTile(clicked_image,3);

			}
			else if(images[clicked_image-1] == "../images/puzzle_images/blank.jpg" && play != false) {
					var p_obj = document.getElementById("tilemove");
					p_obj.firstChild.nodeValue = "The blank tile cannot be moved.";
			}
			else {
				if(play != false) {
					var p_obj = document.getElementById("tilemove");
					p_obj.firstChild.nodeValue = "Tile number " + clicked_image + " cannot be moved at this time.";
				}
			}

			// checks to see if the blank square is in the bottom-right corner

			if(images[15] == "../images/puzzle_images/blank.jpg" && play != false) {
				// if blank square is in the bottom right hand corner, then proceds to check the rest of the images to see if they are all in the correct
				// position, and counts the number of images using 'correctTiles' to see how many are right.
				correctTiles = 0;
				for(var index=0;index < images.length-1;index++) {
					// compares array elements with what should be in the array element if the puzzle is complete.
					if(images[index] == "../images/puzzle_images/daemon_" + (index+1) + ".jpg") {
						// increments correct tiles counter.
						correctTiles++;
					}
				}
			}
			// checks to see if the user has gotten all the
			if(correctTiles >= 15 && play != false) {
				alert("あなたの勝ち \n おめでとうございます！ゲームの終了です。 \n クリックをするともう一度遊べます。 ");
				// plays a sound when the user completes the game.
				// gets the sound object element by grabbing it's ID.
				var thissound = document.getElementById("sound2");
				// plays the sound.
				thissound.Play();
				// resets variables to allow user to play again.
				correctTiles = 0;
				play = true;
				playCounter = 0;
			}
		}
		function makeMoveArray(move_case) {
			// makeMoveArray function assigns variable values to the array.
			move[2] = 0; // defaults the last two elements to 0 as they may not be used.
			move[3] = 0;
			switch (move_case) {
				case 1:
					move[0] = 2;
					move[1] = 5;
					break;
				case 2:
					move[0] = 1;
					move[1] = 3;
					move[2] = 6;
					break;
				case 3:
					move[0] = 2;
					move[1] = 4;
					move[2] = 7;
					break;
				case 4:
					move[0] = 3;
					move[1] = 8;
					break;
				case 5:
					move[0] = 1;
					move[1] = 6;
					move[2] = 9;
					break;
				case 6:
					move[0] = 2;
					move[1] = 5;
					move[2] = 7;
					move[3] = 10;
					break;
				case 7:
					move[0] = 3;
					move[1] = 6;
					move[2] = 8;
					move[3] = 11;
					break;
				case 8:
					move[0] = 4;
					move[1] = 7;
					move[2] = 12;
					break;
				case 9:
					move[0] = 5;
					move[1] = 10;
					move[2] = 13;
					break;
				case 10:
					move[0] = 6;
					move[1] = 9;
					move[2] = 11;
					move[3] = 14;
					break;
				case 11:
					move[0] = 7;
					move[1] = 10;
					move[2] = 12;
					move[3] = 15;
					break;
				case 12:
					move[0] = 8;
					move[1] = 11;
					move[2] = 16;
					break;
				case 13:
					move[0] = 9;
					move[1] = 14;
					break;
				case 14:
					move[0] = 10;
					move[1] = 13;
					move[2] = 15;
					break;
				case 15:
					move[0] = 11;
					move[1] = 14;
					move[2] = 16;
					break;
				case 16:
					move[0] = 12;
					move[1] = 15;
					break;
			}

		}


		function getRandomInRange(min,max){
			return Math.floor(min + Math.random()*(max-min +1));
		}