img scramble puzzle help

This is hw and I do not want the answer. The problem is I have code to randomely scramble the images inside a table 9x9. And when I scramble them one of my images is replaced by a blank img. After it is scramble when i click an image to the left,right,bottom,top of the image it swaps the blank image with it. But the problem is it only does it once, then nothing happens. Just looking for suggestions

Thanks

function scramble(){

A=[1,2,3,4,5,6,7,8,9]
for (i=0;i<9;i++){
r=Math.floor(Math.random()* A.length)
document.images[i].src="tree0_0"+A[r]+".jpg"
A.splice(r,1)

}
r=Math.floor(Math.random()*9)
document.images[r].src="blank.jpg"

blank=r
}

function slide(n){


if (blank-1==n){
alert("left of blank")
temp=document.images[n].src
document.images[n].src=document.images[blank].src
document.images[blank].src=temp
}
if (blank+1==n){
alert("right of blank")
temp=document.images[n].src
document.images[n].src=document.images[blank].src
document.images[blank].src=temp
}
if (blank+3==n){
alert("below blank")
temp=document.images[n].src
document.images[n].src=document.images[blank].src
document.images[blank].src=temp
}
if (blank-3==n){
alert("above blank")
temp=document.images[n].src
document.images[n].src=document.images[blank].src
document.images[blank].src=temp
}

}
</script>

problem (though not obvious), a random scrambling leads to a set-up, that can only be resolved in 50% of the cases. check http://www.cut-the-knot.org/pythagoras/history15.shtml for more information.

next one, where do you define the events?



and if you’re too desperate: an Image Slider (http://bytes.kulturbeutel-leipzig.net/Puzzle/ImageSlider.xhtml) I once made.

You forgot to change the value of the variable blank after swapping it with tile n in your slide(n) function.

The very last step in slide(n) should be blank = n;

Why do you duplicate the code 4 times in doing the swap with blank?

dormilich im not to desperate, i know they cant always be solved.

Old pedant thank you I actually realized that right after i posted it... I have for if statements for above the blank image and below and to the right and the left

WHY?

Why not simply do this:

function slide(n)
{
if (blank-1 = =n)
{
alert("left of blank")
} else if ( blank+1 == n ) {
alert("right of blank")
} else if ( blank+3 == n ) {
alert("below blank")
} else if ( blank-3 == n ) {
alert("above blank")
} else {
alert("invalid click");
return;
}
temp = document.images[n].src;
document.images[n].src = document.images[blank].src;
document.images[blank].src = temp;
blank = n;
}

Or, if you are ready to get rid of the alerts:

function slide(n)
{
if ( n == blank-1 || n == blank+1 || n == blank+3 || n == blank-3 )
{
temp = document.images[n].src;
document.images[n].src = document.images[blank].src;
document.images[blank].src = temp;
blank = n;
}
}

Or, a bit more elegant (but probably your class hasn't covered switch yet):

function slide(n)
{
switch ( n )
{
case blank-1:
case blank+1:
case blank+3:
case blank-3:
temp = document.images[n].src;
document.images[n].src = document.images[blank].src;
document.images[blank].src = temp;
blank = n;
}
}

old pedant... yes you are right, your way is way more efficiant with less code. Wasnt thinking I suppose. And I have learned switch cases in c++ but not javascript. Same principles i suppose?

The switch in JavaScript is much more flexible than the one in Java.

In Java, all the case values must be constants.

In JavaScript, the case values can be expressions, as I show there.

So it's actually even handier than the Java version, isn't it?

Oh...and you can use strings, too.


switch ( name.toLowerCase() )
{
case "john":
xxxxx
break;
case "ma" + "ry":
xxxxx
break;
default:
xxxxxx
}

So really flexible!