More Fun With JavaScript.... 3

mwolf00 · Nov 4, 2003

OK - So I must be bored...

<title>Javascript Tile Puzzle</title>
<script>
function mixEm(){
document.getElementById("spanPlace&quot

.innerHTML = ""
tempArr = new Array()
for (x=0; x<dLevel*dLevel; x++){
tempArr[x] = x

if (x==0){
newSpans = "<span class=tile id=t0></span>"
}
else{
newSpans += "<span class=tile id=t" + x + " onClick='moveEm(this)'>" + x + "</span>"
}
}
document.getElementById("spanPlace&quot

.innerHTML = newSpans
window.tileArr = new Array()
//now mix them up
numElems = tempArr.length
for (x=0; x<numElems; x++){
ranNum = Math.floor(Math.random() * tempArr.length)
tileArr.push(tempArr[ranNum])
tempArr.splice(ranNum,1)
}
}

function showEm(){
allInputs = document.getElementsByTagName("input&quot

for (x=0; x<allInputs.length; x++){
if (allInputs[x].checked){
window.dLevel = parseInt(allInputs[x].value)
break;
}
}

mixEm()
window.numClicks = 0
curRow = 0
curCol = 0
for (x=0; x<tileArr.length; x++){
if ( x % dLevel == 0 ){
curRow = 1
curCol ++
}
thisTile = document.getElementById("t" + tileArr[x])
thisTile.style.top = curCol * 50
thisTile.style.left = curRow * 50
curRow ++
if (tileArr[x] > 0){
tileArr[x] % 2 == 0 ? color = "yellow" : color = "green"
thisTile.style.backgroundColor = color
}
}
checkEm()
}

function moveEm(inObj){
zeroTile = document.getElementById("t0&quot

zeroXpos = parseInt(zeroTile.style.left)
zeroYpos = parseInt(zeroTile.style.top)
inXpos = parseInt(inObj.style.left)
inYpos = parseInt(inObj.style.top)
if (zeroXpos == inXpos){
if (Math.abs(zeroYpos - inYpos) == 50){
zeroTile.style.top = inYpos
inObj.style.top = zeroYpos
numClicks ++
}
}
else if (zeroYpos == inYpos){
if (Math.abs(zeroXpos - inXpos) == 50){
zeroTile.style.left = inXpos
inObj.style.left = zeroXpos
numClicks ++
}
}
checkEm()
}

function checkEm(){
curRow = 0
curCol = 0
numWrong = 0
for (x=1; x<tileArr.length; x++){
if ((x-1) % dLevel == 0 ){
curRow = 1
curCol ++
}
thisTile = document.getElementById("t" + x)
if (parseInt(thisTile.style.top) == curCol * 50 && parseInt(thisTile.style.left) == curRow * 50){
thisTile.style.color = "black"
}
else{
thisTile.style.color = "red"
numWrong ++
}

curRow ++
}
window.status = numWrong + " wrong -- " + numClicks + " moves."
if (numWrong == 0){
alert("Solved in " + numClicks + " clicks&quot

}
}

</script>
<style>
body {font-family: arial;}
span {text-align:center;}
.tile {font-size: 26pt; border: solid blue 3px; width: 50px; height: 50px; position:absolute; }
</style>

<body onLoad="showEm()" id="bodyNode">
<div id="spanPlace">
<span class=tile id=t0></span>
</div>
<div style="position: absolute; top: 50; left:400;">
<form name="gameForm">
<P><input type=radio name="levelPicker" value=3 onClick="showEm()"> Easy (3x3)</P>
<P><input type=radio name="levelPicker" value=4 onClick="showEm()" Checked> Medium (4x4)</P>
<P><input type=radio name="levelPicker" value=5 onClick="showEm()"> Hard (5x5)</P>
<P><input type=radio name="levelPicker" value=6 onClick="showEm()"> Impossible (6x6)</P>
<input type=button onClick="showEm()" value="Start Over">
</form>
</div>
</body>

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

mwolf00 · Nov 5, 2003

Anyone finish "Impossible"?

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

Veep · Nov 5, 2003

I wish that I could finish "easy" [hammer]

onpnt · Nov 5, 2003

great, now I'm going to be clicking on this damn thing all day [lol]

I'm up to "hard" though

_____________________________________________________________________

[sub]
I have the resolution perfect in my mind, but it never seems to fit on the screen quite the same way[/sub]

mwolf00 · Nov 5, 2003

I gave up on an "impossible" one yesterday after 2500 clicks - I couldn't figure how to flip 2 numbers [3eyes]

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

vbkris · Nov 5, 2003

gr8!!!!!

any cheats???

Known is handfull, Unknown is worldfull

onpnt · Nov 5, 2003

typical programmer. Any cheats???? [rofl2]

_____________________________________________________________________

[sub]
I have the resolution perfect in my mind, but it never seems to fit on the screen quite the same way[/sub]

vbkris · Nov 5, 2003

makes life easy u know...

Known is handfull, Unknown is worldfull

Veep · Nov 5, 2003

2500 clicks? Anyone see that Orbitz commercial? "Digititus" [lol]

Lrnmore · Nov 5, 2003

mwolf,

It's too bad there's not a place for cool stuff like
this. I guess there could be a category in the FAQ's
called "site gismos". I know another thing I'd like to
see in it is clarkin's clock.

That's all some people do at lunch time is
find a site with a game they like.

Would you guys mind if I posted my tic tac toe
program and see if you can help me "polish it"
I am not that great with style yet.

2b||!2b

mwolf00 · Nov 5, 2003

Sounds like a good post - do you pay the computer in tic-tac-toe?

The domain "scriptgames.com" is available.... Anyone interested in building a site to keep ppl from getting work done?

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

nerram · Nov 5, 2003

Is the impossible level really impossible?

mwolf00 · Nov 5, 2003

I don't think so nerram - I've gotten to within 2 tiles of completing it (took me just over 1000 clicks). I am going to try again soon....

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

kaht · Nov 5, 2003

I'm not completely for sure, but I think the radomization of the grid causes unsolvable puzzles. Don't know if any of you are familiar with this, but if you take a corner piece out of a rubik's cube, rotate it 66% and put it back in, the cube is then unsolvable. I'm kinda wondering if this puzzle is the same way. I ran into a 4x4 puzzle that was the same way. I had 2 tiles switched and I spent about 15 mins trying to unswitch them. Back on Final Fantasy I (the original one for nintendo) there was a special code where you could press A+B simultaneously 55 times and you could play the same puzzle (in 4x4 mode) I never ran into a puzzle then that took me more than 15 mins to solve, and I don't remember the 2-tiles-switched case ever coming up either. So.... maybe the random generation is causing unsolvable puzzles, maybe not. Gives ya something to think about though.

-kaht

Mr3Putt · Nov 5, 2003

Impossibility? Seems unlikely... then again...

When I was little (6 or 7, I suppose) I had one of those tile-sliding puzzles with some cartoon characters on it. The characters could, by arranging the tiles, appear in different positions... like: 1,2,3,4,5 or 5,4,2,1,3 or... you get the idea.

A pretty cool little game... the box the game came in had several configurations pictured on the lid, along with relative "difficulty". I finished all the configurations... except for the one rated "impossible".

How could it be impossible?!? On the face of it, the problem just doesn't seem logical. How can certain configurations of semi-free floating elements be more "possible" than others.

I had that game for years, and I never finished that one. Weird. Still bugs me, 30+ years later.

adam0101 · Nov 5, 2003

I believe kaht may be correct in that the game can generate impossible scenarios. The size of the game doesn't seem to matter. Here's what seems an impossible 3x3 game:
[tt]
|1|2|3|
|4|6|5|
|7|8| |[/tt]

Success in switching the 6 and 5 will just result in two other numbers being switched. If any one can solve this pattern, there's no reason you couldn't do the same for a 50x50 game.

Adam
while(ignorance==true){perpetuate(violence,fear,hatred);life--};

mwolf00 · Nov 5, 2003

hmm - I will try 3x3 games and see if I can replicate that scenario - my guess is that you just need to work on more than just the 2 - think outside the box as it were...

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

adam0101 · Nov 5, 2003

Here's another impossible pattern:

[tt]_______
|1|2|3|
|8| |4|
|7|6|5|[/tt]

I'm sure there's some mathematical equation you could use to determine why some games are impossible and some are not, but if I had to guess I'd have to say it's for the same reason you could never solve this game:

[tt]_____
|1|3|
|2| |[/tt]

Adam
while(ignorance==true){perpetuate(violence,fear,hatred);life--};

YodaMan81 · Nov 5, 2003

This is really cool. Thanks mwolf :-D

mwolf00 · Nov 5, 2003

hmm - you might be right - I think that I will have to start with a valid solution and randomly shuffle the tiles x number of times by clicking them with the program - this could be cool...

tomorrow - version 2....

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

More Fun With JavaScript.... 3

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Technical User

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Programmer

Technical User

Programmer

Similar threads

Log in

Part and Inventory Search

Sponsor