diff options
Diffstat (limited to 'media/js/slideshow.js')
| -rw-r--r-- | media/js/slideshow.js | 189 |
1 files changed, 189 insertions, 0 deletions
diff --git a/media/js/slideshow.js b/media/js/slideshow.js new file mode 100644 index 0000000..7ada1c5 --- /dev/null +++ b/media/js/slideshow.js @@ -0,0 +1,189 @@ +//Utility functions for map info window +function mapit(latlontitle) { + var map; + lat = parseFloat(latlontitle.split(',')[0]); + lon = parseFloat(latlontitle.split(',')[1]); + title= latlontitle.split(',')[2]; + var mapitinit; + if (mapitinit == true) { + panto(); + } else { + mapInit(); + } + + function mapInit() { + var centerCoord = new google.maps.LatLng(lat, lon); + var mapOptions = { + zoom: 6, + center: centerCoord, + mapTypeId: google.maps.MapTypeId.TERRAIN + }; + map = new google.maps.Map(document.getElementById("map-wrapper"), mapOptions); + var marker = new google.maps.Marker({ + position: centerCoord, + map: map, + title: title + }); + mapitinit = true; + } + function panto(){ + var marker = new google.maps.Marker({ + position: centerCoord, + map: map, + title: title + }); + map.panTo(centerCoord); + } +} + +// utility functions to create/remove map container +function create_map(obj) { + //create container divs + $(obj).parent().parent().parent().append('<div id="map-container">'); + $('#map-container').append('<div id="map-wrapper">'); + //deal with the variable height of div.legend + $('#map-container').css({ + bottom: function(index, value) { + return parseFloat($(obj).parent().parent().css("height"))-2; + } + }); + + mapit(obj.title); +} +function remove_map() { + $('#map-container').remove(); +} +// utility functions to create/remove camera info container +function get_exif(obj,id) { + $(obj).parents().eq(2).append('<div id="exif-container">'); + $(obj).parents().eq(2).children('.meta').clone().appendTo('#exif-container').css('display', 'block'); + //deal with the variable height of div.legend + $('#exif-container').css({ + bottom: function(index, value) { + return parseFloat($(obj).parent().parent().css("height"))-14; + } + }); +} +function remove_exif() { + $("#exif-container").remove(); +} + + +// +$(document).ready(function(){ + //set up click events for map button + $('.map-link').click( function() { + if ($("#exif-container").is(":visible")){ + remove_exif(); + } + if ($('#map-container').is(":visible")) { + remove_map(); + } else { + create_map(this); + } + return false; + + }); + + //set up click events camera info button + $('.exif-link').click( function() { + if ($('#map-container').is(":visible")){ + remove_map(); + } + if ($('#exif-container').is(":visible")) { + remove_exif(); + } else { + get_exif(this); + } + return false; + }); + + + // create and hide nav buttons (needed for keyboard shortcuts + $('#slides').append('<div class="slidenav"><a id="prev">< Prev </a><a id="next"> Next ></a></div>'); + $('.slidenav').css("display","none"); + + + // initialize the cycle slideshow + $('#slides .bigimg').wrapAll('<div class="bigimgs">').parents('#slides').append('<ul class="menu" id="feature_gallery_pager">').cycle({ + fx: 'fade', + pause: 1, + prev: '#prev', + next: '#next', + before: onBefore, + after: onAfter, + slideExpr: '.bigimg', + pager: '#feature_gallery_pager', + pagerAnchorBuilder: function(idx, slide) { + return '<li><a href="#"><img src="'+slide.id+'" class="thumb"><span></span></a></li>'; + } + + }); + + //callback to delete map and camera info windows if they exist + function onBefore() { + $('#map-container').remove(); + $('#exif-container').remove(); + } + + //callback to change url for permalinks and scroll jcarousel + function onAfter(curr,next,opts) { + window.location.hash = 'image'+(opts.currSlide + 1); + if (opts.currSlide % 10 == 0) { + if (opts.currSlide != 0) { + $('#slides').trigger('image-loaded',[opts.currSlide+1]); + } else { + $('#slides').trigger('image-loaded',[1]); + } + } + } + + //callback for jcarousel + function initCallbackFunction(carousel) { + // bind "image-loaded" event to the #slides container (trigger in onAfter function) + $('#slides').bind('image-loaded', function(event, num) { + // scroll carousel + carousel.scroll(num); + return false; + }); + }; + + //initialize the jcarousel plugin + $(function() { + $('#feature_gallery_pager').jcarousel({ + scroll:10, + initCallback: initCallbackFunction + }); + }); + + /* hover buttons, currently not used + $("#slideshow").hover(function() { + $("ul#nav").fadeIn(); + }, + function() { + $("ul#nav").fadeOut(); + }); + */ + + //enable keyboard shortcuts: + $(document.documentElement).keyup(function(event) { + var direction = null; + if (event.keyCode == 37) { + direction = 'prev'; + } else if (event.keyCode == 39) { + direction = 'next'; + } + if (direction != null) { + $('#slides').each(function(index) { + $('#prev,#next', this)[direction]().click(); + }); + } + }); + + //enable slideshow instructions + $('#instructions').css("visibility","visible") + + + +}); + |