// MichaelMcElroy.NET // Copyright 2007, Michael McElroy. // All rights are reserved. // Entity function Entity () {} this . prototype = Entity . prototype; this . prototype . superclass = null; // Methods this . prototype . initialize = function () { return; }; this . prototype . finalize = function () { return; }; this . prototype . graft = function (that) { var property; // Copy each property from 'this' to 'that'. for (property in this) { if (typeof (that [property]) == "undefined") { that [property] = this [property]; } } // Assign a superclass to each function in 'that'. for (property in that) { if (typeof (that [property]) == "function") { that [property] . superclass = this; } } return; }; // Delegate function Delegate () {} this . prototype = Delegate . prototype; this . prototype . superclass = Entity . prototype; // Members this . prototype . proxy = null; this . prototype . entity = null; this . prototype . method = null; // Methods this . prototype . initialize = function () { arguments . callee . superclass . initialize . apply (this); return; }; this . prototype . act = function () { return (this . proxy . apply (this, arguments)); }; this . prototype . getProxy = function () { return (this . proxy); }; this . prototype . setEntity = function (entity) { this . entity = entity; this . updateProxy (); return; }; this . prototype . setMethod = function (method) { this . method = method; this . updateProxy (); return; }; this . prototype . updateProxy = function () { var entity; var method; entity = this . entity; method = this . method; if ((entity != null) && (method != null)) { this . proxy = function () {return (method . apply (entity, arguments));}; } else { this . proxy = function () {return;}; } return; }; this . prototype . register = function (entity, event) { entity . addEventListener (event, this . getProxy (), false); return; }; this . prototype . unregister = function (entity, event) { entity . removeEventListener (event, this . getProxy (), false); return; }; this . prototype . superclass . graft (this . prototype); // Tiles function Tiles () {} this . prototype = Tiles . prototype; this . prototype . superclass = Entity . prototype; // Members this . prototype . picturesAddress = "resources"; this . prototype . overlayPictureName = "overlay.png"; this . prototype . pictureNames = null; this . prototype . makaylaPictureName = "picture.makayla.png"; this . prototype . aAlternatePictureName = "picture" + "." + "a" + "." + "png"; this . prototype . mAlternatePictureName = "picture" + "." + "m" + "." + "png"; this . prototype . lAlternatePictureName = "picture" + "." + "l" + "." + "png"; this . prototype . sAlternatePictureName = "picture" + "." + "s" + "." + "png"; this . prototype . wAlternatePictureName = "picture" + "." + "w" + "." + "png"; this . prototype . bAlternatePictureName = "picture" + "." + "b" + "." + "png"; this . prototype . leftButtonPictureName = "button.left.png"; this . prototype . rightButtonPictureName = "button.right.png"; this . prototype . address = null; this . prototype . engine = null; this . prototype . pixelRatio = null; this . prototype . borderThickness = null; this . prototype . rowDimension = null; this . prototype . columnDimension = null; this . prototype . boardRowDimension = null; this . prototype . boardColumnDimension = null; this . prototype . arenaRowDimension = null; this . prototype . arenaColumnDimension = null; this . prototype . tileRowDimension = null; this . prototype . tileColumnDimension = null; this . prototype . renderStaticGraphics = null; this . prototype . pictureQuantity = null; this . prototype . pictureIndex = null; this . prototype . selectedRowIndex = null; this . prototype . selectedColumnIndex = null; this . prototype . renderTimeoutID = null; this . prototype . allowAlternatePictures = null; this . prototype . thumbnailVisible = null; this . prototype . graphics = null; this . prototype . tilesGraphics = null; this . prototype . pictureGraphics = null; this . prototype . boardGraphics = null; this . prototype . arenaGraphics = null; this . prototype . buttonsGraphics = null; this . prototype . leftButtonGraphics = null; this . prototype . rightButtonGraphics = null; this . prototype . thumbnailButtonGraphics = null; this . prototype . thumbnailGraphics = null; this . prototype . thumbnailPicture = null; this . prototype . delegates = { start: null, scramble: null, selectTile: null, moveTile: null, deselectTile: null, applyKeyDownEvent: null, applyKeyUpEvent: null, importPreviousPicture: null, importNextPicture: null, showThumbnail: null, hideThumbnail: null, render: null }; // Methods this . prototype . initialize = function (address) { arguments . callee . superclass . initialize . apply (this); this . setAddress (address); this . initializeEngine (); this . initializeValues (); this . initializeGraphics (); this . initializeDelegates (); this . reset (); this . renderTimeoutID = window . setInterval (this . delegates . render . getProxy (), 1000 / 30); return; }; this . prototype . initializeEngine = function () { this . engine = new Engine (); this . engine . initialize (5, 5); return; }; this . prototype . initializeValues = function () { this . pixelRatio = 100; // 1 unit = [pixelRatio] pixels. this . borderThickness = 0.00; //0.32; this . rowDimension = this . engine . getRowDimension () + this . borderThickness + this . borderThickness; this . columnDimension = this . engine . getColumnDimension () + this . borderThickness + this . borderThickness; this . boardRowDimension = this . rowDimension - this . borderThickness - this . borderThickness; this . boardColumnDimension = this . columnDimension - this . borderThickness - this . borderThickness; this . arenaRowDimension = this . rowDimension - this . borderThickness - this . borderThickness; this . arenaColumnDimension = this . columnDimension - this . borderThickness - this . borderThickness; this . glassRowDimension = this . arenaRowDimension; this . glassColumnDimension = this . arenaColumnDimension; this . tileRowDimension = 1; this . tileColumnDimension = 1; this . renderStaticGraphics = true; this . pictureNames = new Array ("picture.0.png", "picture.1.png", "picture.2.png"); this . pictureQuantity = this . pictureNames . length; this . pictureIndex = 0; this . scrambleQuantity = 100; this . selectedRowCoordinate = null; this . selectedColumnCoordinate = null; this . renderTimeoutID = null; this . allowAlternatePictures = false; this . thumbnailVisible = false; return; }; this . prototype . initializeGraphics = function () { this . cachePictures (); this . graphics = document . createElement ("div"); this . graphics . style . zIndex = "0"; this . graphics . style . position = "relative"; this . boardGraphics = document . createElement ("div"); this . boardGraphics . style . zIndex = "1"; this . boardGraphics . style . position = "absolute"; // this . boardGraphics . style . backgroundColor = "#ffffff"; //"#ecece2"; this . boardGraphics . style . overflow = "hidden"; this . boardGraphics . style . marginLeft = "50%"; this . arenaGraphics = document . createElement ("div"); this . arenaGraphics . style . zIndex = "2"; this . arenaGraphics . style . position = "absolute"; this . arenaGraphics . style . backgroundColor = "#ffffff"; this . arenaGraphics . style . overflow = "hidden"; this . arenaGraphics . style . marginLeft = "50%"; this . glassGraphics = document . createElement ("div"); this . glassGraphics . style . zIndex = "3"; this . glassGraphics . style . position = "absolute"; this . glassGraphics . style . overflow = "hidden"; this . glassGraphics . style . cursor = "pointer"; this . glassGraphics . style . marginLeft = "50%"; this . buttonsGraphics = document . createElement ("div"); this . buttonsGraphics . style . zIndex = "4"; this . buttonsGraphics . style . position = "absolute"; this . leftButtonGraphics = document . createElement ("div"); this . leftButtonGraphics . style . zIndex = "0"; this . leftButtonGraphics . style . position = "absolute"; this . leftButtonGraphics . style . cursor = "pointer"; this . leftButtonGraphics . style . backgroundImage = "url('" + this . address + "/" + this . picturesAddress + "/" + this . leftButtonPictureName + "')"; this . rightButtonGraphics = document . createElement ("div"); this . rightButtonGraphics . style . zIndex = "0"; this . rightButtonGraphics . style . position = "absolute"; this . rightButtonGraphics . style . cursor = "pointer"; this . rightButtonGraphics . style . backgroundImage = "url('" + this . address + "/" + this . picturesAddress + "/" + this . rightButtonPictureName + "')"; this . thumbnailButtonGraphics = document . createElement ("div"); this . thumbnailButtonGraphics . style . zIndex = "0"; this . thumbnailButtonGraphics . style . position = "absolute"; this . thumbnailButtonGraphics . style . cursor = "pointer"; this . thumbnailGraphics = document . createElement ("div"); this . thumbnailGraphics . style . zIndex = "0"; this . thumbnailGraphics . style . position = "absolute"; this . thumbnailGraphics . style . cursor = "pointer"; this . thumbnailPicture = document . createElement ("img"); this . thumbnailPicture . src = this . address + "/" + this . picturesAddress + "/" + this . pictureNames [this . pictureIndex]; this . tilesGraphics = new Array (); for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { this . tilesGraphics [rowIndex] = new Array (); for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { var overlay; var picture; overlay = document . createElement ("img"); overlay . style . zIndex = "1"; overlay . style . position = "absolute"; overlay . style . top = "0px"; overlay . style . left = "0px"; overlay . src = this . address + "/" + this . picturesAddress + "/" + this . overlayPictureName; overlay . alt = ""; picture = document . createElement ("img"); picture . style . zIndex = "0"; picture . style . position = "absolute"; picture . src = this . address + "/" + this . picturesAddress + "/" + this . pictureNames [this . pictureIndex]; picture . alt = ""; this . tilesGraphics [rowIndex] [columnIndex] = document . createElement ("div"); this . tilesGraphics [rowIndex] [columnIndex] . style . zIndex = "0"; this . tilesGraphics [rowIndex] [columnIndex] . style . position = "absolute"; this . tilesGraphics [rowIndex] [columnIndex] . style . overflow = "hidden"; this . tilesGraphics [rowIndex] [columnIndex] . overlay = overlay; this . tilesGraphics [rowIndex] [columnIndex] . picture = picture; this . tilesGraphics [rowIndex] [columnIndex] . appendChild (overlay); this . tilesGraphics [rowIndex] [columnIndex] . appendChild (picture); } } this . assembleGraphics (); return; }; this . prototype . initializeDelegates = function () { this . delegates . start = new Delegate (); this . delegates . start . initialize (); this . delegates . start . setEntity (this); this . delegates . start . setMethod (this . start); this . delegates . scramble = new Delegate (); this . delegates . scramble . initialize (); this . delegates . scramble . setEntity (this); this . delegates . scramble . setMethod (this . scramble); this . delegates . selectTile = new Delegate (); this . delegates . selectTile . initialize (); this . delegates . selectTile . setEntity (this); this . delegates . selectTile . setMethod (this . selectTile); this . delegates . moveTile = new Delegate (); this . delegates . moveTile . initialize (); this . delegates . moveTile . setEntity (this); this . delegates . moveTile . setMethod (this . moveTile); this . delegates . deselectTile = new Delegate (); this . delegates . deselectTile . initialize (); this . delegates . deselectTile . setEntity (this); this . delegates . deselectTile . setMethod (this . deselectTile); this . delegates . applyKeyDownEvent = new Delegate (); this . delegates . applyKeyDownEvent . initialize (); this . delegates . applyKeyDownEvent . setEntity (this); this . delegates . applyKeyDownEvent . setMethod (this . applyKeyDownEvent); this . delegates . applyKeyUpEvent = new Delegate (); this . delegates . applyKeyUpEvent . initialize (); this . delegates . applyKeyUpEvent . setEntity (this); this . delegates . applyKeyUpEvent . setMethod (this . applyKeyUpEvent); this . delegates . importPreviousPicture = new Delegate (); this . delegates . importPreviousPicture . initialize (); this . delegates . importPreviousPicture . setEntity (this); this . delegates . importPreviousPicture . setMethod (this . importPreviousPicture); this . delegates . importNextPicture = new Delegate (); this . delegates . importNextPicture . initialize (); this . delegates . importNextPicture . setEntity (this); this . delegates . importNextPicture . setMethod (this . importNextPicture); this . delegates . showThumbnail = new Delegate (); this . delegates . showThumbnail . initialize (); this . delegates . showThumbnail . setEntity (this); this . delegates . showThumbnail . setMethod (this . showThumbnail); this . delegates . hideThumbnail = new Delegate (); this . delegates . hideThumbnail . initialize (); this . delegates . hideThumbnail . setEntity (this); this . delegates . hideThumbnail . setMethod (this . hideThumbnail); this . delegates . render = new Delegate (); this . delegates . render . initialize (); this . delegates . render . setEntity (this); this . delegates . render . setMethod (this . render); return; }; this . prototype . cachePictures = function () { this . cache = function () {}; this . cache . leftButtonImage = new Image (); this . cache . leftButtonImage . src = this . address + "/" + this . picturesAddress + "/" + this . leftButtonPictureName; this . cache . rightButtonImage = new Image (); this . cache . rightButtonImage . src = this . address + "/" + this . picturesAddress + "/" + this . rightButtonPictureName; this . cache . images = new Array (); for (var index = 0; index < this . pictureNames . length; index = index + 1) { this . cache . images [index] = new Image (); this . cache . images [index] . src = this . address + "/" + this . picturesAddress + "/" + this . pictureNames [index]; } return; }; this . prototype . assembleGraphics = function () { this . graphics . appendChild (this . boardGraphics); this . graphics . appendChild (this . arenaGraphics); this . graphics . appendChild (this . glassGraphics); this . graphics . appendChild (this . buttonsGraphics); this . buttonsGraphics . appendChild (this . leftButtonGraphics); this . buttonsGraphics . appendChild (this . rightButtonGraphics); // this . buttonsGraphics . appendChild (this . thumbnailButtonGraphics); for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { this . arenaGraphics . appendChild (this . tilesGraphics [rowIndex] [columnIndex]); } } return; }; this . prototype . reset = function (event) { this . delegates . applyKeyDownEvent . register (document, "keydown"); this . delegates . applyKeyUpEvent . register (document, "keyup"); this . delegates . importPreviousPicture . register (this . leftButtonGraphics, "mousedown"); this . delegates . importNextPicture . register (this . rightButtonGraphics, "mousedown"); this . delegates . showThumbnail . register (this . thumbnailButtonGraphics, "mousedown"); this . delegates . hideThumbnail . register (this . thumbnailButtonGraphics, "mouseout"); this . delegates . start . register (this . glassGraphics, "mousedown"); this . delegates . selectTile . unregister (this . glassGraphics, "mousedown"); this . delegates . moveTile . unregister (this . glassGraphics, "mousemove"); this . delegates . deselectTile . unregister (this . glassGraphics, "mouseup"); this . engine . reset (); if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . setAddress = function (address) { this . address = (address != null) ? address : ""; return; }; this . prototype . showThumbnail = function (event) { this . thumbnailVisible = true; if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . hideThumbnail = function (event) { this . thumbnailVisible = false; if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . importPicture = function (pictureIndex) { if (pictureIndex == null) { pictureIndex = 0; } if (pictureIndex < 0) { pictureIndex = this . pictureQuantity - 1; } pictureIndex = pictureIndex % this . pictureQuantity; this . pictureIndex = pictureIndex; for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { this . tilesGraphics [rowIndex] [columnIndex] . picture . src = this . address + "/" + this . picturesAddress + "/" + this . pictureNames [this . pictureIndex]; } } this . reset (); return; }; this . prototype . importNextPicture = function (event) { this . importPicture (this . pictureIndex + 1); if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . importPreviousPicture = function (event) { this . importPicture (this . pictureIndex - 1); if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . importAlternatePicture = function (pictureName) { for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { this . tilesGraphics [rowIndex] [columnIndex] . picture . src = this . address + "/" + this . picturesAddress + "/" + pictureName; } } this . reset (); return; }; this . prototype . applyKeyDownEvent = function (event) { if (event . altKey) { this . allowAlternatePictures = true; } if ((event . keyCode == 48) || (event . keyCode == 96)) // 0 (number row), 0 (number pad) { this . importAlternatePicture (this . makaylaPictureName); } if (this . allowAlternatePictures) { if (event . keyCode == 65) // a { this . importAlternatePicture (this . aAlternatePictureName); } if (event . keyCode == 77) // m { this . importAlternatePicture (this . mAlternatePictureName); } if (event . keyCode == 76) // l { this . importAlternatePicture (this . lAlternatePictureName); } if (event . keyCode == 83) // s { this . importAlternatePicture (this . sAlternatePictureName); } if (event . keyCode == 87) // w { this . importAlternatePicture (this . wAlternatePictureName); } if (event . keyCode == 66) // b { this . importAlternatePicture (this . bAlternatePictureName); } } if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . applyKeyUpEvent = function (event) { if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; }; this . prototype . start = function (event) { var rowIndex; var columnIndex; this . delegates . start . unregister (this . glassGraphics, "mousedown"); this . scrambleRowIndex = Math . floor (Math . random () * this . engine . getRowDimension ()); this . scrambleColumnIndex = Math . floor (Math . random () * this . engine . getColumnDimension ()); this . engine . selectStart (this . scrambleRowIndex, this . scrambleColumnIndex); this . scrambleCount = 0; window . setTimeout (this . delegates . scramble . getProxy (), 10); if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return; } this . prototype . scramble = function (event) { if (Math . floor (Math . random () * 2) == 0) { this . scrambleRowIndex = (this . scrambleRowIndex + Math . floor (Math . random () * this . engine . getRowDimension ())) % this . engine . getRowDimension (); } else { this . scrambleColumnIndex = (this . scrambleColumnIndex + Math . floor (Math . random () * this . engine . getColumnDimension ())) % this . engine . getColumnDimension (); } this . engine . moveTile (this . scrambleRowIndex, this . scrambleColumnIndex); this . scrambleCount = this . scrambleCount + 1; if (this . scrambleCount < this . scrambleQuantity) { window . setTimeout (this . delegates . scramble . getProxy (), 10); } else { this . delegates . selectTile . register (this . glassGraphics, "mousedown"); this . delegates . moveTile . register (this . glassGraphics, "mousemove"); this . delegates . deselectTile . register (this . glassGraphics, "mouseup"); } return; }; this . prototype . selectTile = function (event) { this . selectedRowCoordinate = this . getRowCoordinate (event); this . selectedColumnCoordinate = this . getColumnCoordinate (event); this . selectedRowOffset = 0; this . selectedColumnOffset = 0; if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return (false); }; this . prototype . moveTile = function (event) { this . selectedRowOffset = this . getRowCoordinate (event) - this . selectedRowCoordinate; this . selectedColumnOffset = this . getColumnCoordinate (event) - this . selectedColumnCoordinate; this . selectedRowOffset = (this . selectedRowOffset > this . getPixels (1.0)) ? this . getPixels (1.0) : this . selectedRowOffset; this . selectedColumnOffset = (this . selectedColumnOffset > this . getPixels (1.0)) ? this . getPixels (1.0) : this . selectedColumnOffset; this . selectedRowOffset = (this . selectedRowOffset < - this . getPixels (1.0)) ? - this . getPixels (1.0) : this . selectedRowOffset; this . selectedColumnOffset = (this . selectedColumnOffset < - this . getPixels (1.0)) ? - this . getPixels (1.0) : this . selectedColumnOffset; if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return (false); }; this . prototype . deselectTile = function (event) { var rowIndex; var columnIndex; var tolerance; var threshold; tollerance = 1; threshold = Math . floor (this . pixelRatio / 3); if ((this . selectedRowCoordinate != null) && (this . selectedColumnCoordinate != null)) { if (((Math . abs (this . selectedRowOffset) < tolerance) && (Math . abs (this . selectedColumnOffset) < tolerance)) || (Math . abs (this . selectedRowOffset) > threshold) || (Math . abs (this . selectedColumnOffset) > threshold)) { rowIndex = this . getRowIndex (this . selectedRowCoordinate); columnIndex = this . getColumnIndex (this . selectedColumnCoordinate); this . engine . moveTile (rowIndex, columnIndex); if (this . engine . getSolved ()) { this . reset (); } } else if ((this . selectedRowOffset == 0) && (this . selectedColumnOffset == 0)) { rowIndex = this . getRowIndex (this . selectedRowCoordinate); columnIndex = this . getColumnIndex (this . selectedColumnCoordinate); this . engine . moveTile (rowIndex, columnIndex); if (this . engine . getSolved ()) { this . reset (); } } this . selectedRowCoordinate = null; this . selectedColumnCoordinate = null; } if ((typeof (event) != "undefined") && (event != null)) { event . stopPropagation (); event . preventDefault (); event . cancelBubble = true; } return (false); }; this . prototype . getRowIndex = function (coordinate) { var index; index = null; if ((typeof (coordinate) != "undefined") && (coordinate != null)) { index = Math . floor (coordinate / (Math . floor (this . glassRowDimension * this . pixelRatio) / this . engine . getRowDimension ())); } return (index); }; this . prototype . getColumnIndex = function (coordinate) { var index; index = null; if ((typeof (coordinate) != "undefined") && (coordinate != null)) { index = Math . floor (coordinate / (Math . floor (this . glassColumnDimension * this . pixelRatio) / this . engine . getColumnDimension ())); } return (index); }; this . prototype . getRowCoordinate = function (event) { var rowCoordinate; rowCoordinate = null; if ((typeof (event) != "undefined") && (event != null)) { if (typeof (event . offsetY) != "undefined") { rowCoordinate = event . offsetY; } if (typeof (event . layerY) != "undefined") { rowCoordinate = event . layerY; } } return (rowCoordinate); }; this . prototype . getColumnCoordinate = function (event) { var columnCoordinate; columnCoordinate = null; if ((typeof (event) != "undefined") && (event != null)) { if (typeof (event . offsetX) != "undefined") { columnCoordinate = event . offsetX; } if (typeof (event . layerX) != "undefined") { columnCoordinate = event . layerX; } } return (columnCoordinate); }; this . prototype . getQueries = function () { var queries; var queryText; var queryPairs; queries = new Object (); queryText = window . location . search . substring (1); queryPairs = queryText . split ("&"); for (var pairIndex = 0; pairIndex < queryPairs . length; pairIndex = pairIndex + 1) { var name; var value; name = queryPairs [pairIndex] . split ("=") [0]; value = queryPairs [pairIndex] . split ("=") [1]; queries [name] = value; } return (queries); }; this . prototype . getGraphics = function () { return (this . graphics); }; this . prototype . getPixels = function (units) { var pixels; var ratio; pixels = 0; ratio = this . pixelRatio; if ((typeof (units) != "undefined") && (units != null) && (typeof (ratio) != "undefined") && (ratio != null)) { pixels = units * ratio; } pixels = Math . round (pixels); return (pixels); }; this . prototype . render = function (event) { if (this . graphics != null) { // Static if (this . renderStaticGraphics) { this . renderStaticGraphics = 0; this . graphics . style . top = "0px"; this . graphics . style . left = "0px"; this . graphics . style . height = + this . getPixels (this . rowDimension) + "px"; this . graphics . style . width = + this . getPixels (this . columnDimension) + "px"; this . boardGraphics . style . top = + this . getPixels (0) + "px"; this . boardGraphics . style . left = - this . getPixels (this . columnDimension / 2) + "px"; this . boardGraphics . style . height = + this . getPixels (this . boardRowDimension) + "px"; this . boardGraphics . style . width = + this . getPixels (this . boardColumnDimension) + "px"; this . arenaGraphics . style . top = + this . getPixels (this . borderThickness) + "px"; this . arenaGraphics . style . left = - this . getPixels (this . columnDimension / 2 - this . borderThickness) + "px"; this . arenaGraphics . style . height = + this . getPixels (this . arenaRowDimension) + "px"; this . arenaGraphics . style . width = + this . getPixels (this . arenaColumnDimension) + "px"; this . glassGraphics . style . top = + this . getPixels (this . borderThickness) + "px"; this . glassGraphics . style . left = - this . getPixels (this . columnDimension / 2 - this . borderThickness) + "px"; this . glassGraphics . style . height = + this . getPixels (this . glassRowDimension) + "px"; this . glassGraphics . style . width = + this . getPixels (this . glassColumnDimension) + "px"; this . buttonsGraphics . style . top = this . getPixels (this . rowDimension - 0.20 / 2 - this . borderThickness / 2 - 0.01) + "px"; this . buttonsGraphics . style . left = this . getPixels (this . columnDimension / 2 - 0.20 * 2 / 2) + "px"; this . buttonsGraphics . style . height = this . getPixels (0.20) + "px"; this . buttonsGraphics . style . width = this . getPixels (0.20 * 2) + "px"; this . leftButtonGraphics . style . top = this . getPixels (0.20) + "px"; this . leftButtonGraphics . style . left = this . getPixels (0.20 * 0) + "px"; this . leftButtonGraphics . style . height = this . getPixels (0.20) + "px"; this . leftButtonGraphics . style . width = this . getPixels (0.20) + "px"; this . thumbnailButtonGraphics . style . top = this . getPixels (0.20) + "px"; this . thumbnailButtonGraphics . style . left = this . getPixels (0.20 * 1) + "px"; this . thumbnailButtonGraphics . style . height = this . getPixels (0.20) + "px"; this . thumbnailButtonGraphics . style . width = this . getPixels (0.20) + "px"; this . rightButtonGraphics . style . top = this . getPixels (0.20) + "px"; this . rightButtonGraphics . style . left = this . getPixels (0.20 * 1) + "px"; this . rightButtonGraphics . style . height = this . getPixels (0.20) + "px"; this . rightButtonGraphics . style . width = this . getPixels (0.20) + "px"; for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { this . tilesGraphics [rowIndex] [columnIndex] . style . height = this . getPixels (this . tileRowDimension) + "px"; this . tilesGraphics [rowIndex] [columnIndex] . style . width = this . getPixels (this . tileColumnDimension) + "px"; } } } // Dynamic var solved; solved = this . engine . getSolved (); for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { if (solved) { this . tilesGraphics [rowIndex] [columnIndex] . style . display = "block"; this . tilesGraphics [rowIndex] [columnIndex] . overlay . style . display = "none"; } else { this . tilesGraphics [rowIndex] [columnIndex] . overlay . style . display = "block"; if (this . engine . getTileCode (rowIndex, columnIndex) == null) { this . tilesGraphics [rowIndex] [columnIndex] . style . display = "none"; } else { this . tilesGraphics [rowIndex] [columnIndex] . style . display = "block"; } } var tileRowIndex; var tileRowColumn; if (this . engine . getTileCode (rowIndex, columnIndex) != null) { tileRowIndex = this . engine . getTileCode (rowIndex, columnIndex) . split (", ") [0]; tileColumnIndex = this . engine . getTileCode (rowIndex, columnIndex) . split (", ") [1]; } else { tileRowIndex = rowIndex; tileColumnIndex = columnIndex; } this . tilesGraphics [rowIndex] [columnIndex] . style . top = this . getPixels (rowIndex) + "px"; this . tilesGraphics [rowIndex] [columnIndex] . style . left = this . getPixels (columnIndex) + "px"; this . tilesGraphics [rowIndex] [columnIndex] . picture . style . top = - this . getPixels (tileRowIndex) + "px"; this . tilesGraphics [rowIndex] [columnIndex] . picture . style . left = - this . getPixels (tileColumnIndex) + "px"; if ((this . selectedRowCoordinate != null) && (this . selectedColumnCoordinate != null)) { var selectedRowIndex; var selectedColumnIndex; var temporaryRowIndex; var temporaryColumnIndex; selectedRowIndex = this . getRowIndex (this . selectedRowCoordinate); selectedColumnIndex = this . getColumnIndex (this . selectedColumnCoordinate); if ((this . selectedRowOffset < 0) && (this . getSpaceRowIndex () < selectedRowIndex) && (this . getSpaceColumnIndex () == selectedColumnIndex)) { temporaryColumnIndex = selectedColumnIndex; for (temporaryRowIndex = selectedRowIndex; temporaryRowIndex >= this . getSpaceRowIndex (); temporaryRowIndex = temporaryRowIndex - 1) { this . tilesGraphics [temporaryRowIndex] [temporaryColumnIndex] . style . top = (this . getPixels (temporaryRowIndex) + this . selectedRowOffset) + "px"; } } if ((this . selectedRowOffset > 0) && (this . getSpaceRowIndex () > selectedRowIndex) && (this . getSpaceColumnIndex () == selectedColumnIndex)) { temporaryColumnIndex = selectedColumnIndex; for (temporaryRowIndex = selectedRowIndex; temporaryRowIndex <= this . getSpaceRowIndex (); temporaryRowIndex = temporaryRowIndex + 1) { this . tilesGraphics [temporaryRowIndex] [temporaryColumnIndex] . style . top = (this . getPixels (temporaryRowIndex) + this . selectedRowOffset) + "px"; } } if ((this . selectedColumnOffset < 0) && (this . getSpaceRowIndex () == selectedRowIndex) && (this . getSpaceColumnIndex () < selectedColumnIndex)) { temporaryRowIndex = selectedRowIndex; for (temporaryColumnIndex = selectedColumnIndex; temporaryColumnIndex >= this . getSpaceColumnIndex (); temporaryColumnIndex = temporaryColumnIndex - 1) { this . tilesGraphics [temporaryRowIndex] [temporaryColumnIndex] . style . left = (this . getPixels (temporaryColumnIndex) + this . selectedColumnOffset) + "px"; } } if ((this . selectedColumnOffset > 0) && (this . getSpaceRowIndex () == selectedRowIndex) && (this . getSpaceColumnIndex () > selectedColumnIndex)) { temporaryRowIndex = selectedRowIndex; for (temporaryColumnIndex = selectedColumnIndex; temporaryColumnIndex <= this . getSpaceColumnIndex (); temporaryColumnIndex = temporaryColumnIndex + 1) { this . tilesGraphics [temporaryRowIndex] [temporaryColumnIndex] . style . left = (this . getPixels (temporaryColumnIndex) + this . selectedColumnOffset) + "px"; } } } } } } return; }; this . prototype . getSpaceRowIndex = function () { var spaceRowIndex; for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { if (this . engine . getTileCode (rowIndex, columnIndex) == null) { spaceRowIndex = rowIndex; } } } return (spaceRowIndex); }; this . prototype . getSpaceColumnIndex = function () { var spaceColumnIndex; for (var rowIndex = 0; rowIndex < this . engine . getRowDimension (); rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . engine . getColumnDimension (); columnIndex = columnIndex + 1) { if (this . engine . getTileCode (rowIndex, columnIndex) == null) { spaceColumnIndex = columnIndex; } } } return (spaceColumnIndex); }; this . prototype . superclass . graft (this . prototype); // Engine function Engine () {} this . prototype = Engine . prototype; this . prototype . superclass = Entity . prototype; // Members this . prototype . rowDimension = null; this . prototype . columnDimension = null; this . prototype . matrix = null; // Methods this . prototype . initialize = function (rowDimension, columnDimension) { arguments . callee . superclass . initialize . apply (this); this . rowDimension = rowDimension; this . columnDimension = columnDimension; this . initializeMatrix (); return; }; this . prototype . initializeMatrix = function () { this . matrix = null; this . matrix = new Array (); for (var rowIndex = 0; rowIndex < this . rowDimension; rowIndex = rowIndex + 1) { this . matrix [rowIndex] = new Array (); for (var columnIndex = 0; columnIndex < this . columnDimension; columnIndex = columnIndex + 1) { this . matrix [rowIndex] [columnIndex] = rowIndex + ", " + columnIndex; } } return; }; this . prototype . reset = function () { this . initializeMatrix (); return; }; this . prototype . selectStart = function (rowIndex, columnIndex) { this . matrix [rowIndex] [columnIndex] = null; return; }; this . prototype . getRowDimension = function () { return (this . rowDimension); }; this . prototype . getColumnDimension = function () { return (this . columnDimension); }; this . prototype . getTileCode = function (rowIndex, columnIndex) { var tileCode; tileCode = null; if ((this . matrix != null) && this . getInBounds (rowIndex, columnIndex)) { tileCode = this . matrix [rowIndex] [columnIndex]; } return (tileCode); }; this . prototype . moveTile = function (selectedRowIndex, selectedColumnIndex) { var spaceRowIndex; var spaceColumnIndex; if ((this . matrix != null) && this . getInBounds (selectedRowIndex, selectedColumnIndex)) { spaceRowIndex = null; spaceColumnIndex = null; // Find the space. for (var rowIndex = 0; rowIndex < this . rowDimension; rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . columnDimension; columnIndex = columnIndex + 1) { if (this . matrix [rowIndex] [columnIndex] == null) { spaceRowIndex = rowIndex; spaceColumnIndex = columnIndex; } } } // If the selected tile is moveable. if (((spaceRowIndex == selectedRowIndex) && (spaceColumnIndex != selectedColumnIndex)) || ((spaceRowIndex != selectedRowIndex) && (spaceColumnIndex == selectedColumnIndex))) { // Keep moving the space until the selected square has the space. while ((spaceRowIndex != selectedRowIndex) || (spaceColumnIndex != selectedColumnIndex)) { var rowIndex; var columnIndex; rowIndex = spaceRowIndex + ((selectedRowIndex == spaceRowIndex) ? 0 : ((selectedRowIndex < spaceRowIndex) ? - 1 : + 1)); columnIndex = spaceColumnIndex + ((selectedColumnIndex == spaceColumnIndex) ? 0 : ((selectedColumnIndex < spaceColumnIndex) ? - 1 : + 1)); this . matrix [spaceRowIndex] [spaceColumnIndex] = this . matrix [rowIndex] [columnIndex]; spaceRowIndex = rowIndex; spaceColumnIndex = columnIndex; this . matrix [spaceRowIndex] [spaceColumnIndex] = null; } } } return; }; this . prototype . getSolved = function () { var solved; solved = true; // Assumption for (var rowIndex = 0; rowIndex < this . rowDimension; rowIndex = rowIndex + 1) { for (var columnIndex = 0; columnIndex < this . columnDimension; columnIndex = columnIndex + 1) { if (((this . matrix [rowIndex] [columnIndex]) != null) && ((this . matrix [rowIndex] [columnIndex]) != (rowIndex + ", " + columnIndex))) { solved = false; } } } return (solved); }; this . prototype . getInBounds = function (rowIndex, columnIndex) { var inBounds; var minimumRowIndex; var maximumRowIndex; var minimumColumnIndex; var maximumColumnIndex; inBounds = false; // Assumption minimumRowIndex = 0; maximumRowIndex = this . rowDimension; minimumColumnIndex = 0; maximumColumnIndex = this . columnDimension; if ((rowIndex != null) && (columnIndex != null) && (rowIndex >= minimumRowIndex) && (rowIndex < maximumRowIndex) && (columnIndex >= minimumColumnIndex) && (columnIndex < maximumColumnIndex)) { inBounds = true; // Assertion } return (inBounds); }; this . prototype . superclass . graft (this . prototype);