diff options
| -rw-r--r-- | public/js/rogue.js | 120 |
1 files changed, 101 insertions, 19 deletions
diff --git a/public/js/rogue.js b/public/js/rogue.js index 10f53b8..c89b7df 100644 --- a/public/js/rogue.js +++ b/public/js/rogue.js @@ -95,6 +95,8 @@ var ghost = new Sprite(7, 20, 16, 16); var number = new Sprite(2, 59, 8, 16); var upper = new Sprite(2, 60, 8, 16); var lower = new Sprite(2, 62, 8, 16); +var symbol = new Sprite(2, 64, 8, 16); +var space = new Sprite(1, 59, 8, 16); /** Client Logic **/ @@ -107,21 +109,21 @@ spritemap.src = 'scroll-o-sprites-edited.png'; function drawInitialBoard() { for(var i = 0; i < 32; i++) { for(var j = 0; j < 26; j++) { - drawSprite(nothing, i, j); + drawSprite(nothing, i, j, false); } } for(var i = 5; i < 30; i++) { for(var j = 2; j < 10; j++) { - drawSprite(dirt, i, j); + drawSprite(dirt, i, j, false); } } for(var i = 0; i < 32; i++) { - drawSprite(wall[0], i, 0); - drawSprite(wall[1], i, 25); + drawSprite(wall[0], i, 0, false); + drawSprite(wall[1], i, 25, false); } for(var j = 0; j < 26; j++) { - drawSprite(wall[2], 0, j); - drawSprite(wall[2], 31, j); + drawSprite(wall[2], 0, j, false); + drawSprite(wall[2], 31, j, false); } drawPlayerInfo(); @@ -136,23 +138,39 @@ function drawPlayerInfo() { for(var i = 0; i < boxWidth; i++) { for(var j = 1; j < 25; j++) { - drawSprite(nothing, 31 - i, j); + drawSprite(nothing, 31 - i, j, false); if(i == 0) { - drawSprite(border[5], 31 - boxWidth, j); - drawSprite(border[4], 31, j); + drawSprite(border[5], 31 - boxWidth, j, false); + drawSprite(border[4], 31, j, false); } } - drawSprite(border[6], 31 - i, 0); - drawSprite(border[7], 31 - i, 25); + drawSprite(border[6], 31 - i, 0, false); + drawSprite(border[7], 31 - i, 25, false); } - drawSprite(border[1], 31 - boxWidth, 0); - drawSprite(border[0], 31, 0); - drawSprite(border[3], 31 - boxWidth, 25); - drawSprite(border[2], 31, 25); + drawSprite(border[1], 31 - boxWidth, 0, false); + drawSprite(border[0], 31, 0, false); + drawSprite(border[3], 31 - boxWidth, 25, false); + drawSprite(border[2], 31, 25, false); - drawSprite(heart, 31 - boxWidth + 2, 7); - drawSprite(shield, 31 - boxWidth + 2, 8); + drawSprite(heart, 31 - boxWidth + 2, 7, false); + drawSprite(shield, 31 - boxWidth + 2, 8, false); + + renderText("Player Info", 31 - boxWidth + 2, 1); + renderText("100", 31 - boxWidth + 3, 7); + renderText("15", 31 - boxWidth + 3, 8); +} + +/** + * Creates a temporary sprite based off an initial sprite, indexed to the right + * of the original sprite from the spritemap. + * + * @param sprite The original sprite to start from + * @param diff The number of sprites to the right to go on the spritemap + */ +function indexSprite(sprite, diff) { + var newSprite = new Sprite(sprite.x + diff, sprite.y, sprite.width, sprite.height); + return newSprite; } /** @@ -161,7 +179,71 @@ function drawPlayerInfo() { * @param sprite The {@code Sprite} to draw * @param x The X location to draw to * @param y The Y location to draw to + * @param shift Adds 8 pixels to the final X location (used for the font since is are half as wide) */ -function drawSprite(sprite, x, y) { - context.drawImage(spritemap, sprite.x * 16, sprite.y * 16, sprite.width, sprite.height, x * 16, y * 16, sprite.width, sprite.height); +function drawSprite(sprite, x, y, shift) { + var xlocal = 32 + ((sprite.x - 2) * sprite.width); + if(shift) { + context.drawImage(spritemap, xlocal, sprite.y * 16, sprite.width, sprite.height, x * 16 + 8, y * 16, sprite.width, sprite.height); + } else { + context.drawImage(spritemap, xlocal, sprite.y * 16, sprite.width, sprite.height, x * 16, y * 16, sprite.width, sprite.height); + } +} + +/** + * Prints out a string at a location, using the sprite font + * This will automatically jump to the next line when it hits the edge of the + * canvas. Printing will stop when it hits the bottom of the canvas. Also has + * minimal support for esacpe codes. + * + * @param message A string containing the message to write + * @param x The X location to start at + * @param y The Y location to start at + */ +function renderText(message, x, y) { + var startX = x; + var shift = false; + for(var i = 0; i < message.length; i++) { + var sprite = space; + var character = message.charCodeAt(i); + if(character === 92 && i + 1 < message.length) { + switch(message.charCodeAt(i + 1)) { + case 110: // newline + y++; + shift = false; + continue; + case 116: // tab + x += 4; + shift = false; + continue; + case 92: // \ character + sprite = indexSprite(symbol, 19); + break; + default: + break; + } + } else { + if(character >= 48 && character <= 57) { + sprite = indexSprite(number, character - 48); + } else if(character >= 65 && character <= 90) { + sprite = indexSprite(upper, character - 65); + } else if(character >= 97 && character <= 122) { + sprite = indexSprite(lower, character - 97); + } + // TODO: Add other symbols + } + if(x >= 31) { + y++; + x = startX; + shift = false; + } + if(y >= 24) { + break; + } + drawSprite(sprite, x, y, shift); + if(shift) { + x++; + } + shift = !shift; + } } |