Fox And Hen

← Previous     ↑Up to portfolio     Next →

Here’s a fun little drawing program based on the idea of a fox and a hen. By holding down a mouse button and dragging, you control the hen (the white circle), as you’re being chased by the fox (the brown circle). The fox always chases after the hen, running fast when the hen is far away but moving more slowly as it gets closer. To show the fox’s speed, the fox’s circle gets larger as the fox moves faster.

To control this program, first click your mouse on the picture and then use the following keys:

  • s   slow down the fox
  • S   speed up the fox
  • c   toggle clearing the background
  • f   toggle drawing the fox
  • h   toggle drawing the hen
  • r   toggle scaling the fox’s size with its speed
  • y   move circle center upwards with respect to the mouse
  • Y   move circle center downwards with respect to the mouse

Note that due to the variety of browsers, the center of the hen might not be centered on your mouse. If that bugs you, use the y and Y keys to adjust the center up or down in small steps. Remember that the speed and smoothness of the animation is dependent on your computer and what else it’s doing at the moment!

Download the source code here.