Inventory of JavaScript Libraries
- Backbone — framework for page modeling and “routing." Requires:
- jQuery — animation, event handling
- Underscore — programming helpers
- Bootstrap — interface elements, behaviors
- FlowType — responsive typography
- Image Map Resizer — resizes image maps to fit containers
- imagesLoaded — detects when images are loaded
- Raphaël — vector graphics (used for arrows on map)
- Simple Player — audio player (used for narration mp3s)
- data.js — contains arrays of:
- essay and photo titles
- photo dates
- essay order (different from slide order)
- chapter titles and essay contents
- links from each photo image to image layers with tints, landmarks, trail names, narrations MP3s, and narration texts
- footnotes (called sidenotes)
- HTML with JavaScript functions for each photo, used for the image map of landmarks
- HTML with JavaScript functions for each photo, used for the image map of trail names
- items to pre-load (e.g., the base map and small versions of photos, photos with tints, station point icons and their hover states, and multiple images for the Bravo Window if the essay mentioned several slides
- singularity.js — contains functions for:
- page and page element loading
- settings for the table of contents
- initial state-setting for the map and its layers
- canvas sizing (for the map)
- page and element sizing
- behaviors for Alpha, Bravo, Charlie, and Delta windows (called nodes) — for instance, what happens when the map is clicked (Charlie window shrinks, and map is shown in Alpha window)
- previous/next arrows for Bravo and Delta windows
- navigation behaviors, including highlighting current chapter and slide
- map behaviors for the Alpha Window, including zoom, reset, layer behaviors, animated arrows, composite viewshed (also called the heat map)
- photo behaviors for the Alpha Window, including layer behaviors,