* USE FIREFOX *
The pet is still completely functional under Microsoft Internet Explorer, but the pet runs much smoother, and generally looks better in Mozilla Firefox.Table of Contents
HTML Form Functionality: Overview
The basic HTML form aspect functions like a normal virtual pet. The pet will evaluate it's current state every 2 seconds and switch to a new state if appropriate. Sudden state changes can be made at times when certain buttons are invoked. For example, when the pet is lonely and the Yell at the Dog button is pressed, it will instantly change states to scared.
HTML Form Functionality: In-depth
The default state is happy. From this state, the pet will stay happy 80 percent of the time
and go to lonely 20 percent of the time. The Play with the Dog button can be invoked to make the pet excited.
When the pet is excited, it will stay excited 50 percent of the time, and go to happy
50 percent of the time.
When the pet is lonely, two different buttons can be invoked to instantly change it's state. First, the Play with the Dog button will
set the pet's state back to happy. The Yell at the Dog button will change the state to scared. If no button is pressed,
the pet will stay lonely 80 percent of the time and sleep 20 percent of the time.
When the pet is scared, it will either become lonely 50 percent of the time, or angry the other
50 percent of the time.
When the pet is angry, it will stay angry 50 percent of the time, become lonely 25 percent
of the time, and go to sleep the other 25 percent of the time.
When the pet is sleeping, the Yell at the Dog button can be invoked to instantly change the pet's state to scared
Elsewise, the pet will stay in the sleeping state 80 percent of the time, and switch to the hungry state 20 percent of
the time.
When the pet is hungry, the user must click on the Feed the Dog button. A small menu will appear at the bottom of the page. Feeding the pet
Purina ® will only make the pet happy. Feeding the pet Kibbles 'n Bits ® or Purina Chew-rific Snacks Bacon & Cheese Flavor ® will please
your pet much more and instantly make him excited.
HTML Form Functionality: Source Code
Nearly all of the source code for the basic state manager is located in statemain.js. A function or two is used from misc.js, like the precacheImage function.
Game Functionality: Overview
Integrated with the regular state manager, a mini-game was implemented which is called through the Play with the Dog button. Once this button is pressed, the form window will fade away, and a new game window will appear. The controls are as follows:
You control the human character, which just happens to be Link from the Zelda series. The dog will follow your character by default. Think of it as taking your dog for a nice walk. The main point of the game is to play with the dog, not to take it for walks though. To throw the ball, make sure the character is moving in any direction, and press the space bar. Once the ball is thrown, the dog will automatically run after it. Once the dog fetches the ball, it will run back to you to "return" the ball. Please note that you cannot throw the ball again until the dog returns it. You're only required to play one game of catch in order for the "play" action to be invoked. The play action will change the state from happy to excited, or from lonely to happy. While the user is in the game, random states will not be executed, as in the states wont randomly change while you're in the game. Finally, make sure your window is at least resized to ~550 X 550, or the arrow keys will 'scroll' the window and move the character at the same time.
Game Functionality: In-depth
Look at the source code for an in-depth view.
Game Functionality: Source
The bulk of the source code lies in the game functionality. The main file where the global think function is called, and all of the entities are created is in gamemain.js. A 2D Vector math library is stored inside of math.js. Key presses are managed inside of keys.js. The basic entity (the character controlled by the user, the dog, and the ball) source is located in entity.js. Rough collision detection is performed inside of collision.js. Note that I had plans to finish implementing proper collision detection for slopes, but the time constraint of completing the project over the weekend prevented me. Finally, miscellaneous functions such as the methods to fade windows are stored in misc.js.
Known Bug: It's not possible to throw in the lower left direction because of a key detection bug. The problem is inside of Javascript's document.onkeydown/document.onkeyup function. Apparently it has a problem picking up a third keypress when a certain combination of keys are held down (in this case, the down+left arrow, and the space bar). To fix this problem, you can also play with the W-A-S-D keys as if they were arrow keys.
