Motivation: Thanks for checking out my Hoenn Tour page! I made this as a tribute to the Hoenn region, the setting of my first and one of my favorite video games of all time, Pokemon Ruby. In my opinion, the best part of Pokemon is the simple, relaxing scenes and nostalgic audio, so that's what I added!
Map Image: The map image was taken from the page of DeviantArt user cow41087. You can find the image here.
TODO: Ideally, I would like to extend this to include all routes, and maybe even the other points of interest. The only issue with this is that each POI requires me to upload a GIF and MP3 file, and this can take up a lot of space if I start adding a lot.
Technical Details
Gifs/Audio: For the gifs, I started by emulating Pokemon Emerald on an emulator (OpenEmu). I went to each town and screencaptured a position I liked, then converted it into a gif. The audio was just ripped from YouTube videos.
Getting position on the map: This was really the only tricky part of this. To get the location of each POI on the map, I hard-coded in the ratio of the left and right edges of a POI (over the total pixel width of the image) and the ratio of the top and bottom edges of a POI (over the total pixel height of the image), and checked if the x and y ratios of a click was within any of those bounds. If it was, I updated the gif, name, and audio, otherwise the click was ignored.
