Solve the Firefox Maze

A couple times per year, we gather together somewhere on planet to talk, plan and support our mission.

It's a long flight to the December 2016 goal of the Big Island of Hawaii. We need a way to pass the time as we travel.

In 2015 on the way to Orlando Florida, K Lars Lohn offered a maze in the shape of the Firefox logo. As an image on a screen, however, there was no easy way to solve it. This year, in cahoots with Les Orchard, it's a Web app.

START NEW GAME RESUME THE GAME

Android & iOS users - start the game with this page scrolled to the top - see known issues below

How to Play

The objective is to move your player from the maze start point through to the end. Once at the end, you've made it to Hawaii.

Breadcrumbs

As you move through the maze, you'll notice numbers appear each time you get to a branch in the path. These are breadcrumbs. Just pass them by. If you get to a dead end, you can jump backwards through the numbers, until you figure out where you went wrong. To see how to jump back, see the method below that corresponds how you are playing the game.

Clues

This maze is huge and could take days to solve, so your cursor can give you clues. Watch its color. When you stray from the correct path, your cursor will slowly turn pink. If it completely turns red, you've been off the path for a long time. Either reverse course until the cursor turns white again, or use the breadcrumbs feature to leap back to a previous decision point.

Zoom

There are two viewing modes: manual and auto zoom. The game starts in manual mode where you control the level of the zoom yourself. See the method outlined below. Auto zoom controls the zoom for you: zoomed in when your cursor is moving; zoomed out when not moving.

On a phone or touch tablet

single finger touch: The game cursor is attracted to location of a single finger touch. You're not dragging the game cursor, but more like coaxing it. The game cursor will try to move toward your finger, but it is constrained by the walls of the maze. You're leading it in the direction that you want it to go. Some people report that using a stylus makes movement easier.
double finger tap: move back through the numbered breadcrumbs. Each tap is one leap.
triple finger tap: toggle between Manual Zoom and Automatic Zoom
pinch to zoom: when in Manual Zoom mode, the standard pinch to zoom method will move your perspective in and out
two finger swipe left: jump back to this screen, where you may resume or start over

With a Game Controller

Game controllers vary in their layout and functionality, you may have to experiment with you're to get to know the mapping of the buttons

arrow buttons: these will move the game cursor in the direction indicated
joy stick: this is another way to move the game cursor
blue button / X button: move back through the numbered breadcrumbs
yellow button / Y button: toggle between Manual Zoom and Automatic Zoom
green button / A button: when in Manual Zoom mode, this button zooms the view closer
red button / B button: when in Manual Zoom mode, this button zoom the view outward
back button: return to this screen, where you may resume or start over

With a Mouse

left button: the game cursor is attracted to the mouse cursor when the left button is clicked. You're not dragging the cursor around, you're coaxing it. The game cursor will try to move toward your mouse cursor, but the game cursor is constrained by the maze pathways. You lead the game cursor with your mouse cursor. The distance between the game cursor and the mouse cursor is directly proportional to the speed that the game cursor moves: closer is slower, farther is faster.
right button: this is the mouse method of moving back through the numbered breadcrumbs. Each click is a jump back.
scroll wheel: when in manual zoom mode, scrolling the mouse wheel zoom in and out.
middle button: pressing the middle mouse button (usually the scroll wheel itself) toggles between the Manual Zoom and Automatic Zoom

With a Keyboard

arrow keys: will move the cursor in the indicated direction. They can be use in combination
WASD: these letter keys in an inverted-T shape work like the arrow keys
backspace: each press of this key will jump you back to latest breadcrumb decision point
=/+: this key (without regard to shift state) will zoom the display in closer
-: this key will zoom outward for a higher level view
Z: this toggles between the Manual Zoom and Auto Zoom modes
P: jump back to this screen, where you may resume or start over

Known Issues

Firefox for Android: poor performance on some devices.
Firefox for Android & iOS: if the game is started when the original page is scrolled, the tab bar may reflexively strobe up and down through game play. Get around this by using a two finger left swipe to pause the game, ensure the page is scrolled to the top, then hit the "Resume" button.
Firefox for Android & iOS: if the game is started with the original page zoomed in, the game play resolution may be very pixelated or reduced to only a part of the screen. There is currently no work-around. Restart the game without zooming in the original page text.

The Code

The code can be found on Github at https://github.com/lmorchard/fx-maze. It's a disorganized hack. Feel free to fork it and contribute.