/*----------------------------------------------------------------------
[Global JavaScript ] 
Desc: slideshow

Copyright:		Great Fridays 2010
Client:			Emma Watson
Project:		Emma Watson official
Created by:		Adam Foster
Last Updated:	25 - 02 - 10			
-----------------------------------------------------------------------*/

/* Dependencies - jquery tools (circular scroller), hover intent ------*/

/* Slideshow ----------------------------------------------------------*/

slideShow = function() { var config = { current: 0, playing: true, overViewing: true, loading: true, goingRight: true, scrollWidth: 0, disabled: false, thumbsApi: null, move: 1, scrollerSize: 9 }; var shelf = {}; function init(c) { config = $j.extend({}, config, c); shelf.wrapper = $j('#pageContent'); shelf.img = $j('#slideshowImg', shelf.wrapper); shelf.imgScroller = $j('#imgScroller', shelf.img); shelf.imgOverCont = $j('#slideShowOverlayCont', shelf.wrapper).css({ 'opacity': 0, 'display': 'block' }); shelf.nav = $j('#slideshowNavigation', shelf.wrapper); shelf.overview = $j('#slideShowOverlay', shelf.img); shelf.overviewTrigger = $j('.overviewTrigger', shelf.nav); shelf.overview.children('.overlayContent').stop().delay(3000).animate({ bottom: -156 }, 300, function() { config.overViewing = false; shelf.overview.hide(); shelf.overviewTrigger.removeClass('selected'); refreshCufon() }); shelf.loader = $j('#slideshowLoader', shelf.img).css({ 'opacity': 0, 'display': 'block' }); shelf.thmbsScroller = $j('#thumbsMask', shelf.wrapper); shelf.thumbs = $j('ul li', shelf.thmbsScroller); shelf.data = []; shelf.total = shelf.thumbs.length; shelf.currentImg = $j('.current', shelf.nav); $j('.total', shelf.nav).text(shelf.total); if (shelf.total >= 9) { shelf.thmbsScroller.css('width', 9 * 73) } else { shelf.thmbsScroller.css('width', shelf.total * 73); config.scrollerSize = shelf.total }; showLoader(); loadSlideshowData(); if (browser == "isWebKit") $j(window).resize(function() { webkitVideoHeight() }).trigger('resize'); if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || navigator.userAgent.match(/iPad/i)) { shelf.overviewTrigger.css('display', 'none'); shelf.overview.children('.overlayContent').css('display', 'none'); config.overViewing = false } }; function webkitVideoHeight() { shelf.img.children('#imgMask').css('height', 'auto'); shelf.img.children('#imgMask').css('height', shelf.img.height()) }; function loadSlideshowData() { $j.getJSON(config.JSONPath, function(data) { shelf.data = data.slideshow; hideLoader(); populateThumbs(); setUpSlideShow(); bindEvents() }) }; function populateThumbs() { $j.each(shelf.data, function(item, val) { shelf.thmbsScroller.find("a[rel=" + (item + 1) + "]").html("<img height='38' width='74' src=" + val.thumbUrl + " />").css('display', 'block') }) }; function setUpSlideShow() { config.thumbsApi = shelf.thmbsScroller.scrollable({ clickable: false, items: shelf.thumbs, keyboard: false, loop: false, speed: 600, size: config.scrollerSize, onSeek: function() { config.disabled = false } }).circular({ api: true }); shelf.thmbsScroller.find("a[rel='1']").parent().addClass('selected'); if (flashembed.getVersion() == '0,0' && shelf.data[0].htmlVideoURL != null) { config.mediaType = "html" } else if (shelf.data[0].youtubeCode != null) { config.mediaType = "youtube" }; switch (config.mediaType) { case "youtube": var strg = shelf.data[0].youtubeCode; strg = strg.replace("<object", "<object wmode='opaque'"); strg = strg.replace("<embed", "<embed wmode='opaque'"); shelf.imgScroller.prepend(strg); var t = shelf.imgScroller.children(':first-child'); var th = Math.round(t.attr('height') / 2); var tw = Math.round(t.attr('width') / 2); t.css({ 'display': 'block', 'position': 'absolute', 'top': '50%', 'left': '50%', 'marginTop': -th, 'marginLeft': -tw }); break; case "html": var video = '<video controls="true" height="100%" width="100%" preload="none" autoplay="true" loop="true">'; video += '<source type="video/mp4" src="' + shelf.data[0].htmlVideoURL + '"></source>'; video += '</video>'; shelf.imgScroller.prepend(video); break; default: config.videoApi = flashembed("imgScroller", { src: "/_Client/Flash/EmmaWatsonVideoPlayer.swf", wmode: 'transparent', width: '100%', height: '100%', 'z-index': '1' }, { imagePath: shelf.data[0].videoImgURL, filePath: shelf.data[0].mediaURL }); config.flashPlaying = true }; if (browser != "isIE") { if ($j.address) { $j.address.externalChange(function(event) { addressChanged(event.value) }) }; if (window.location.hash != "" && $j.address.value() != ("/" + shelf.data[0].mediaAddress)) { addressChanged($j.address.value()) } } }; function showNext() { if (config.disabled == false) { hideOverview(); config.current++; config.move = 1; config.goingRight = true; if (config.current >= shelf.total) { config.current = 0 }; loadImage(config.current); shelf.thmbsScroller.find(".selected").removeClass("selected").next().addClass('selected') } }; function showPrev() { if (config.disabled == false) { hideOverview(); config.current--; config.move = -1; config.goingRight = false; if (config.current < 0) { config.current = shelf.total - 1 }; loadImage(config.current); shelf.thmbsScroller.find(".selected").removeClass("selected").prev().addClass('selected') } }; function showId(id) { if (config.disabled == false) { hideOverview(); config.move = id - config.current; if (config.move < -Math.floor(config.scrollerSize / 2)) { config.move = shelf.total - config.current + id; config.goingRight = true } else if (config.move > Math.floor(config.scrollerSize / 2)) { config.move = (shelf.total - id + config.current) * -1; config.goingRight = false } else { if (id < config.current) { config.goingRight = false } else if (id > config.current) { config.goingRight = true } }; shelf.thmbsScroller.find(".selected").removeClass("selected").end().find("a[rel=" + (id + 1) + "]").parent().addClass("selected"); config.current = id; loadImage(config.current) } }; function updateAddress() { if (browser != "isIE") $j.address.value(shelf.data[config.current].mediaAddress) }; function addressChanged(evtVal) { if (evtVal == "/") { config.id = 0 } else { $j.each(shelf.data, function(item, val) { if ("/" + val["mediaAddress"] == evtVal) { config.id = item } }); showId(config.id) } }; function loadImage(img) { config.disabled = true; populateOverview(); if (config.goingRight == true) { animateNext() } else { animatePrev() }; shelf.currentImg.text(img + 1); if (flashembed.getVersion() == '0,0' && shelf.data[img].htmlVideoURL != null) { config.mediaType = "html" } else if (shelf.data[img].youtubeCode != null) { config.mediaType = "youtube" } else { config.mediaType = "flash" }; switch (config.mediaType) { case "youtube": shelf.imgScroller.empty(); var strg = shelf.data[img].youtubeCode; strg = strg.replace("<object", "<object wmode='opaque'"); strg = strg.replace("<embed", "<embed wmode='opaque'"); shelf.imgScroller.prepend(shelf.data[img].youtubeCode); var t = shelf.imgScroller.children(':first-child'); var th = Math.round(t.attr('height') / 2); var tw = Math.round(t.attr('width') / 2); t.css({ 'display': 'block', 'position': 'absolute', 'top': '50%', 'left': '50%', 'marginTop': -th, 'marginLeft': -tw }); config.flashPlaying = false; break; case "html": var video = '<video controls="true" height="100%" width="100%" preload="none" autoplay="true" loop="true">'; video += '<source type="video/mp4" src="' + shelf.data[img].htmlVideoURL + '"></source>'; video += '</video>'; shelf.imgScroller.empty().prepend(video); config.flashPlaying = false; break; default: if (config.flashPlaying == true) { var api = config.videoApi.getApi(); if (api.initVideo != undefined) { api.initVideo(shelf.data[img].mediaURL, shelf.data[img].videoImgURL) } else { (function x() { if (api.initVideo != undefined) { api.initVideo && api.initVideo(shelf.data[img].mediaURL, shelf.data[img].videoImgURL) } else { setTimeout(x, 10) } })() } } else { shelf.imgScroller.empty(); config.videoApi = flashembed("imgScroller", { src: "/_Client/Flash/EmmaWatsonVideoPlayer.swf", wmode: 'transparent', width: '100%', height: '100%', 'z-index': '1' }, { imagePath: shelf.data[img].videoImgURL, filePath: shelf.data[img].mediaURL }); config.flashPlaying = true } } }; function animateNext() { config.thumbsApi.move(config.move); updateAddress() }; function animatePrev() { config.thumbsApi.move(config.move); updateAddress() }; function showLoader() { config.loading = true; shelf.loader.css('display', 'block').stop().animate({ opacity: 1 }, 100) }; function hideLoader() { shelf.loader.stop().animate({ opacity: 0 }, 100, function() { shelf.loader.css('display', 'none'); config.loading = false }) }; function showOverlayControls() { if (config.loading == false) { if (config.overViewing == false) { shelf.imgOverCont.stop().animate({ opacity: 1 }, 200) } } }; function hideOverviewControls() { shelf.imgOverCont.stop().animate({ opacity: 0 }, 200) }; function toggleOverview() { if (config.loading == false) { if (config.overViewing == true) { hideOverview() } else { shelf.overview.show().children('.overlayContent').stop().animate({ bottom: 0 }, 300, function() { config.overViewing = true; shelf.overviewTrigger.addClass('selected'); refreshCufon() }) } } }; function hideOverview() { if (config.overViewing == true) { shelf.overview.children('.overlayContent').stop().animate({ bottom: -156 }, 300, function() { config.overViewing = false; shelf.overview.hide(); shelf.overviewTrigger.removeClass('selected'); refreshCufon() }) } }; function populateOverview() { var r = shelf.data[config.current]; var right = shelf.overview.find('.right'), creds = shelf.overview.find('.credits'); right.empty().append("<h2>" + shelf.data[config.current].title + "</h2>"); if (shelf.data[config.current].desc) right.append("<p>" + shelf.data[config.current].desc + "</p>"); creds.empty().append(r.creditCopyright == null ? null : '<span>Copyright: ' + r.creditCopyright + '</span>').append(r.creditText == null ? null : '<span>' + r.creditText + '</span>'); if (shelf.data[config.current].creditLinkURL && shelf.data[config.current].creditLinkText) creds.append(" <span><a href='" + shelf.data[config.current].creditLinkURL + "' target='_blank'>" + shelf.data[config.current].creditLinkText) + "</a></span>"; refreshCufon() }; function bindEvents() { shelf.overviewTrigger.click(function(e) { e.preventDefault(); toggleOverview() }); if (shelf.total > 1) { shelf.img.hoverIntent(showOverlayControls, hideOverviewControls); shelf.nav.find('.imgInfoRight').click(function(e) { showNext() }); shelf.nav.find('.imgInfoLeft').click(function(e) { showPrev() }); shelf.imgOverCont.find('.imgRight').click(function(e) { showNext() }); shelf.imgOverCont.find('.imgLeft').click(function(e) { showPrev() }); $j(document).keydown(function(event) { switch (event.keyCode) { case 37: showPrev(); break; case 38: toggleOverview(); break; case 39: showNext(); break; case 40: hideOverview(); break } }) } else { shelf.nav.find('.imgInfoRight').addClass('disabled'); shelf.nav.find('.imgInfoLeft').addClass('disabled') }; $j('#thumbsMask ul li').each(function() { $j(this).click(function(e) { e.preventDefault(); showId($j(this).children('a').attr('rel') - 1) }) }) }; function refreshCufon() { Cufon.refresh() }; return { config: config, init: init} } ();
/**
* hoverIntent r5 // 2007.03.27 // jQuery 1.1.2+
* <http://cherne.net/brian/resources/jquery.hoverIntent.html>
* 
* @param  f  onMouseOver function || An object with configuration options
* @param  g  onMouseOut function  || Nothing (use configuration options object)
* @author    Brian Cherne <brian@cherne.net>
*/
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:3,interval:100,timeout:700};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};})(jQuery);