Castle Adventure

Original Castle Adventure	J's Castle Adventure

What is Castle Adventure?

• Castle Adventure is an old freeware/shareware DOS game. Built in 1984 by teenaged programmer Kevin Bales, it quickly spread. Today, it still occupies a place of fond nostalgia for many of us who started playing computer games in the DOS era, but has never been replicated fully for the modern internet browser.
• For more information, see The Key to the Castle

Technical Discussion

HTML

The game makes heavy use of the HTML5 Canvas element - drawing on and manipulating it with Javascript functions.

CSS

There is a small amount of CSS that impacts gameplay - notably the blinking cursor by the user input.

JavaScript

I made use of JavaScript ES6 to build out the logic, display, and interaction behind the game.

Notes on Game Structure

The driving forces behind the game are three ES6 classes - User, CanvasState, and Room. CanvasState describes the state of the HTML5 canvas element; User contains the functions for moving, colliding, and switching between rooms; and Room takes both of those classes along with a room name to display the current room with the user's position and inventory on the screen. I think of it as a big funnel: all the pieces are dumped into the Room funnel and align to create what the user sees on the page.

Here's the beginning of Room's constructor function as an example:

class Room {
  constructor(canv, room, player) {
    for (let key in canv) { this[key] = canv[key]; }
    for (let attr in room) { this[attr] = room[attr]; } // looping through object passed
    this.ref = room; // need the room object in rooms.js to be accessible by this class and the User class in order to pick up objects
    this.drawWalls();
    this.player = player;
    /// other parameters & method calls
    }
  //// methods
}

The Making of Castle Adventure

Author

J Silverstein

Castle Adventure created by

Kevin Bales

Credits

Sounds from the VideoGame Music Preservation Foundation and SwitchLeft on YouTube

A Gentle Introduction to Making HTML5 Canvas Interactive by Simon Sarris was very helpful to me when I was trying to figure out how to structure a script that edits the canvas.

Artem Gordinsky's CodePen "Blinking Cursor in CSS3" was very helpful when I went to make the user input field, although I used a different method of implementation.

I was the recipient of some very helpful advice on StackOverflow: see here and here.

Opportunities for Further Growth

While the game as it currently is accomplishes the goals I wished to accomplish, there is, as always, room for growth.

Fixing Known Glitches

• Font of some items is not the original font
• Player marker behavior on using stairs is a little buggy
• Room collision sound is delayed
• Win & lose screens won't display inventory
• Win & lose screens retain player position

Cleaning Up Code

• Use .hasOwnProperty() for item interaction instead of having an excessive number of properties
• Revisit collision logic to see if it can be shortened... mostly it is the same function four different times, which seems like it can be done more efficiently.
• Consolidate some methods so my constructor functions aren't as long

Future Stages of Development

Level 1

• Addition of "room flavor" - i.e. throne, bushes, shelves, etc.
• Addition of maze rooms
• Fairy and Vampire-type monsters

Level 2

• Addition of ogres to fight... ogres will need their own initial-position and speed.
• Fight-based loss scenario
• Easter egg: keycode combo that will make the game imitate the original game's glitchy save patterns as seen here.

Level 3

• Expansion of game - up to 40 rooms
• Scoring system
• Adding a drop command and a max-length for the item inventory

Level 4

• Exact, complete duplicate of original game
• Memory of high score

Level 5 Castle's Sky

• Generative version of the game - rooms are created on the fly without being specifically defined.

Checking Win/Loss State

I spent most of my childhood playing this dang game and losing -- years and years -- so, even though this is a very abbreviated version, I thought I'd add the instructions on how to beat it. :) See annotated map (original from We Love Dos Games ) below - the objects & stairs in each room differ a little bit in my game, but the layout is the same.

Also, you can Look, Rub, Get, Take, Wave, and Wear objects, and check your Inventory.

Checking for a Win

Get the Lamp (in the North Garden)

Get the Necklace (in the Queen's Dressing Room)

Wear the Necklace (this is important!)

Go downstairs (in the corner of the Storage Room)

I don't have a map for downstairs, but there's only one route -- go to the King's Secret Room at the end of the Winding Passage

Head back upstairs to the Courtyard

Wave the scepter!

Checking for a Loss

Get the Lamp

Go downstairs in the Storage Room

You should die halfway through the Winding Passage :)