//puzzExt.js
puzzLeft = puzzTop = null;
puzzWidth = puzzHeight = null;
bordWidth = 3;
puzzAcross = puzzDown = 5;
isPuzzDraggable = true;
isGrid = false;
isNewPuzz = null;
isCreated = null;
piecesCreated = 0
pieceCount = 1;
topCount = 0;
isBroken = false;
solvedCount = 1;
pieceToSolve = null;
flashTotal = 5;
flashCount = 0;
loadTotal = 3;
loadCount = 0;
tempEl = null;
sp = " ";
function whenLoaded() {
loadCount++;
if (loadCount < loadTotal) { return };
if (isPuzzDraggable) {
elPuzzle.draggable = true;
elPuzzle.style.cursor = "move";
}
else {
elPuzzle.draggable = false;
dragBut.value = "Drag OFF";
}
elPuzzle.clipLeft = elPuzzle.clipTop = 0;
initPuzz();
}
function initPuzz() {
if (isBroken) {allDone(false)};
puzzWidth = document.images["imOrig"].width;
puzzHeight = document.images["imOrig"].height;
elPuzzle.style.width = elControls.style.width = puzzWidth;
elPuzzle.style.visibility = "visible";
isNewPuzz = true;
isCreated = false;
pieceToSolve = 1;
}
function createPieces(){
puzzPieces = puzzAcross * puzzDown;
if (puzzPieces > piecesCreated) {
makeStart = piecesCreated+1;
for(i=makeStart; i<=puzzPieces; i++) {
window.status = "Creating puzzle piece... " + i;
divStr = "<DIV ID=PIECE" + i + " CLASS=clPuzzPiece>"
+ "<IMG NAME=imPiece" + i + " ></DIV>";
document.body.insertAdjacentHTML("BeforeEnd",divStr);
tempEl = eval("PIECE" + i);
tempEl.draggable = true;
}
piecesCreated = puzzPieces;
}
activeEl = eval("PIECE" + puzzPieces);
}
function createPuzzle() {
if (!isCreated) { createPieces() };
pieceWidth = puzzWidth/puzzAcross;
pieceHeight = puzzHeight/puzzDown;
while (pieceCount<=puzzPieces) {
pixT = topCount * pieceHeight;
pixB = (topCount + 1) * pieceHeight;
for (i=1; i<=puzzAcross; i++) {
window.status="Clipping image for piece... " + pieceCount;
tempEl = eval("PIECE" + pieceCount);
document.images["imPiece" + pieceCount].src = document.images["imOrig"].src;
tempEl.style.pixelLeft = puzzLeft;
tempEl.style.pixelTop = puzzTop;
pixR = pieceWidth * i;
pixL = pieceWidth * (i-1);
tempEl.style.clip = "rect(" + pixT + sp + pixR + sp + pixB + sp + pixL + ")";
tempEl.clipLeft = pixL;
tempEl.clipTop = pixT;
pieceCount++
}
topCount++
}
if (isGrid) {setGrid()};
isNewPuzz = false;
isCreated = true;
pieceCount=1;
topCount=0;
window.status = "";
}
function breakUp() {
puzzLeft = elPuzzle.style.pixelLeft + bordWidth;
puzzTop = elPuzzle.style.pixelTop + bordWidth;
pieceToSolve = 1;
if (isNewPuzz && isBroken) { allDone(false) };
if (isNewPuzz) { createPuzzle() };
if (isPuzzDraggable) {
elPuzzle.draggable = false;
elPuzzle.style.cursor = "default";
}
elImOrig.style.visibility = "hidden";
startL = document.body.scrollLeft;
startT = document.body.scrollTop;
endL = (startL + document.body.offsetWidth) - puzzWidth;
endT = (startT + document.body.offsetHeight) - puzzHeight;
for (i=1; i<=puzzPieces; i++) {
putL = getRandNums(startL,endL);
putT = getRandNums(startT,endT);
tempEl = eval("PIECE" + i);
tempEl.draggable = true;
tempEl.style.pixelLeft = putL;
tempEl.style.pixelTop = putT;
tempEl.style.cursor = "move";
tempEl.style.visibility = "visible";
}
if (isGrid) {elGrid.style.visibility = "visible"};
isBroken = true;
solvedCount=1;
}
function getRandNums(from,to){
temp = parseInt((Math.random() * (to-from)) + (from));
while (isNaN(temp)) {
temp = parseInt((Math.random() * (to - from)) + (from))
}
return temp
}
function setGrid() {
elImGrid.style.width = (9/puzzAcross) * puzzWidth;
elImGrid.style.height = (9/puzzDown) * puzzHeight;
elGrid.style.clip = "rect(0 " + puzzWidth + " " + puzzHeight + " 0)";
gridBut.value = "Grid ON";
if (isBroken) {elGrid.style.visibility = "visible"}
}
function visToggle(isFullSolve){
if (flashCount!=flashTotal) {
tempEl.style.visibility = (tempEl.style.visibility=='visible') ? 'hidden' : 'visible';
flashCount++;
}
else {
clearInterval(flashTimer);
flashCount=0;
tempEl.style.visibility = "visible";
if (tempEl != elImOrig) {origPos(tempEl)};
if (isFullSolve) {pieceToSolve++; solve(true) }
}
}
function solve(isFullSolve) {
if (!isBroken) { return };
if (pieceToSolve > puzzPieces) { pieceToSolve=1; return }
tempEl = eval("PIECE" + pieceToSolve);
if (tempEl.draggable){
if (tempEl != activeEl ) {
tempEl.style.zIndex = activeEl.style.zIndex + 1;
activeEl = tempEl;
}
flashTimer = setInterval("visToggle(" + isFullSolve + ")",100);
}
else { pieceToSolve++; solve(isFullSolve) };
}
function origPos(tempEl) {
tempEl.style.pixelLeft = puzzLeft;
tempEl.style.pixelTop = puzzTop;
tempEl.draggable=false;
tempEl.style.cursor = 'default';
solvedCount++;
if (solvedCount > puzzPieces) {
allDone(true);
}
}
function allDone(solved){
for (i=1; i<=puzzPieces; i++) {
tempEl = eval("PIECE" + i);
tempEl.style.visibility = "hidden";
}
elImOrig.style.visibility = "visible";
if (isGrid) { elGrid.style.visibility = "hidden" };
if (isPuzzDraggable) {
elPuzzle.draggable = true;
elPuzzle.style.cursor = "move";
}
solvedCount = 1;
if (solved) {
isBroken = false;
tempEl = elImOrig;
flashTimer = setInterval("visToggle(false)",100);
}
}
function giveHint() {
if (isBroken) { solve(false) };
}
function gridToggle(){
if (isGrid) {
elGrid.style.visibility = "hidden";
elImGrid.style.width=1;
elImGrid.style.height=1;
gridBut.value = "Grid OFF";
}
else { setGrid() };
isGrid = !isGrid;
}
function dragToggle(){
isPuzzDraggable = !isPuzzDraggable;
if (!isBroken) { elPuzzle.draggable = !elPuzzle.draggable };
if (isPuzzDraggable) {
elPuzzle.style.cursor = "move";
dragBut.value = "Drag ON";
}
else {
elPuzzle.style.cursor = "default";
dragBut.value = "Drag OFF";
}
}