This is a single-page application featuring a map of Northumberland county in the UK. Map markers identify castles and there is an autocomplete search function for easy lookup of the castles. Third-party APIs provide additional information (Wikipedia) and images (Flickr) about each of these locations. (Where available.)
Hovering over a marker will identify the castle and provide a summary from Wikipedia along with a link to the full article. Clicking on a marker or selecting the castle from the search box will centre the map on the selected castle, change the icon colour from black to red and display up to six Flickr images of the castle and surrounding areas above the map. If there are no images then just the Castle name will appear in the heading.
Knockout.js has been utilised to bind values to the DOM.
Open /dist/index.html
to view the map.
http://jsfiddle.net/stesta/p3ZT4/
http://codepen.io/anon/pen/EVwRpP
http://kylerush.net/blog/tutorial-flickr-api-javascript-jquery-ajax-json-build-detailed-photo-wall/
http://cameron-verhelst.be/blog/2014/04/20/knockoutjs-autocomplete/