Streamline and syntax questions.

Date: 04/24/05 (Javascript Community) Keywords: no keywords

I'm not very good at this, so bare with me.
I have been trying to figure this meaningless puzzle out and I will not stop until I you figure it out for me! ;)

I am making a puzzle that has 7 pictures, 6 of them are pics when arranged correctly will make the desired picture, the other pic is of a blank. each time you press a picture other than the blank, it will switch positions with the blank. when all are arranged correctly the pictures should revert back to scrambled form.

I have it so it works, but the code is really huge. I need a way to figure out how I can get the image object like here. That way I think I could make a for statement that would make the code much, much smaller. (You'll see!)

Then I need to figure out the proper way to use the if && operand. That is if I can use it for the purpose I intended to use it for, everywhere I looked it was only used twice.

<shtml><title>Puzzling 2</title><head> <script language="javascript"> var file = new Array(7); for(var i = 0; i < 7; i++) { file[i] = new Image(); file[i].src = "puzzle/" + i + ".jpg"; } //function checkSolved() { //if ((document.image0.src == file[0].src;) && //(document.image1.src == file[1].src;) && //(document.image2.src == file[2].src;) && //(document.image3.src == file[3].src;) && //(document.image4.src == file[4].src;) && //(document.image5.src == file[5].src;) && //(document.image6.src == file[6].src;)) //{mix()} //} function mix() { location.reload() } function findimage0() { for (var i = 0; i < 7; i++) { if (document.image0.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image0.src = file[6].src; //checkSolved() } function findimage1() { for (var i = 0; i < 7; i++) { if (document.image1.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image1.src = file[6].src; } function findimage2() { for (var i = 0; i < 7; i++) { if (document.image2.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image2.src = file[6].src; } function findimage3() { for (var i = 0; i < 7; i++) { if (document.image3.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image3.src = file[6].src; } function findimage4() { for (var i = 0; i < 7; i++) { if (document.image4.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image4.src = file[6].src; } function findimage5() { for (var i = 0; i < 7; i++) { if (document.image5.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image5.src = file[6].src; } function findimage6() { for (var i = 0; i < 7; i++) { if (document.image6.src == file[i].src) {img = i;} } if (document.image0.src == file[6].src) {document.image0.src = file[img].src;} else if (document.image1.src == file[6].src) {document.image1.src = file[img].src;} else if (document.image2.src == file[6].src) {document.image2.src = file[img].src;} else if (document.image3.src == file[6].src) {document.image3.src = file[img].src;} else if (document.image4.src == file[6].src) {document.image4.src = file[img].src;} else if (document.image5.src == file[6].src) {document.image5.src = file[img].src;} else if (document.image6.src == file[6].src) {document.image6.src = file[img].src;} document.image6.src = file[6].src; } </script> </head><somebody> <table width=560 height=100 cellpadding=0 cellspacing=0 border=0><tr> <td><a href="#" onClick="findimage0();" return="false"> <img name ="image0" src="puzzle/2.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage1();" return="false"> <img name ="image1" src="puzzle/5.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage2(); " return="false"> <img name ="image2" src="puzzle/1.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage3();" return="false"> <img name ="image3" src="puzzle/3.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage4();" return="false"> <img name ="image4" src="puzzle/0.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage5();" return="false"> <img name ="image5" src="puzzle/4.jpg" width="80" height="100" border="0"> </a></td> <td><a href="#" onClick="findimage6();" return="false"> <img name ="image6" src="puzzle/6.jpg" width="80" height="100" border="0"> </a></td> </tr></table> </somebody></shtml>

Here are the pictures in case you want to see how it works.

If I can figure out how to get the image object I can eliminate 5 of them functions.

I think getElementById(id); might solve the problem as someone suggested before, but I thought it was a function. I'm reading about it now.

Thanks!

Source: http://www.livejournal.com/community/javascript/64178.html

« Unable to...

load time »