As our final project for the Lighthouse Labs web development bootcamp, we chose to recreate the classic Carmen Sandiego games - where they came with a desk encyclopedia or almanac, however, we've decided to make use of a slightly more modern source.
Direct your browser to where-on-wikipedia.herokuapp.com.
See? Easy.
- Install MongoDB. I won't even try to offer instructions on how to do that.
- Clone this repository
- Using
.env.example
as a guide, create a.env
file in the project's root directory. Change appropriate variables to match npm install
npm run seed
to create the database and example game.npm start
- Direct your browser to http://localhost:3000, replacing the port (3000 here) with whatever you have the server running on.
- Node.js
- Express
- MongoDB
Where on Wikipedia was developed by Adam Lovatt and Bryan Kenny.
We had to leave out some planned features due to time constraints:
- A mobile-friendly design. This probably wouldn't be too hard, as the right half of the current layout looks and plays alright on a mobile device. The IFrame would have to be hidden, destination links would need to use `target="_new", and the viewport sized accordingly.
- A wider variety of clues, both in terms of the messages given and the type of article information clues are generated from.
- Difficulty scaling, whether by the number of steps in a game or somehow assessing how hard a given set of clues/destinations might be.
- Tracking the games a player has started, won, and lost. The server and database have a decent amount of code in place for this already.
- Truly random suspects, as opposed to the current hard-coded list. We ran into a bit of a roadblock figuring out how to have players give us the suspect - typing it manually would require checking for spelling, etc.
- Provide a unique game ID so players can share a particular mystery with friends. The app already uses these IDs internally, so we're really just missing a nice way to convey it to the player.
- Integrate the app with the embedded Wikipedia page. The Wiki Game does this by rewriting the Wikipedia HTML so that all clicked links go through their app.
- Better styling for the game screen; what we have now is serviceable, but certainly not attractive. More pictures/icons probably wouldn't be a bad idea.
- Implement tests for the server routes and database functions.
Contributions are more than welcome. :)
- The glass overlay effect was adapted from an article on dev.opera.com.
- The brushed metal and glowing button effects were adapted from this Codepen.
- The background texture was found on Stack Overflow.