Difference between revisions of "Template:Toulouse/javascript"

 
Line 1: Line 1:
 
<html>
 
<html>
 
<script>
 
<script>
 +
jQuery(document).ready(function() {
 +
 +
/* How to Handle Hashtags */
 +
jQuery(window).hashchange(function(){
 +
var hash = location.hash;
 +
jQuery('a[href='+hash+']').trigger('click');
 +
});
 +
jQuery('section.content.hide').hide();
 +
/* Main Navigation Clicks */
 +
jQuery('.main-nav ul li a').click(function() {
 +
var link = jQuery(this).attr('href').substr(1);
 +
 +
if ( !jQuery('section.content.show, section#' + link).is(':animated') ) {
 +
jQuery('.main-nav ul li a').removeClass('active'); //remove active
 +
jQuery('section.content.show').addClass('show').animate({'opacity' : 0}, {queue: false, duration: 1000,
 +
complete: function() {
 +
jQuery('section.content.show').hide();
 +
jQuery('a[href="#'+link+'"]').addClass('active'); // add active
 +
jQuery('section#' + link).show();
 +
jQuery('section#' + link).addClass('show').animate({'opacity' : 1}, {queue: false, duration: 1000});
 +
}
 +
});
 +
}
 +
});
 +
 +
});
 +
/* --------------------------------------------------------------------
 +
MaxImage 2.0 (Fullscreen Slideshow for use with jQuery Cycle Plugin)
 +
--------------------------------------------------------------------
 +
 +
Examples and documentation at: http://www.aaronvanderzwan.com/maximage/2.0/
 +
Copyright (c) 2007-2012 Aaron Vanderzwan
 +
Dual licensed under the MIT and GPL licenses.
 +
 +
NOTES:
 +
This plugin is intended to simplify the creation of fullscreen
 +
background slideshows.  It is intended to be used alongside the
 +
jQuery Cycle plugin:
 +
http://jquery.malsup.com/cycle/
 +
 +
If you simply need a fullscreen background image, please
 +
refer to the following document for ways to do this that
 +
are much more simple:
 +
http://css-tricks.com/perfect-full-page-background-image/
 +
 +
If you have any questions please contact Aaron Vanderzwan
 +
at http://www.aaronvanderzwan.com/blog/
 +
Documentation at:
 +
http://blog.aaronvanderzwan.com/2012/07/maximage-2-0/
 +
 +
HISTORY:
 +
MaxImage 2.0 is a project first built as jQuery MaxImage Plugin
 +
(http://www.aaronvanderzwan.com/maximage/). Once CSS3 came along,
 +
the background-size:cover solved the problem MaxImage
 +
was intended to solve.  However, fully customizable
 +
fullscreen slideshows is still fairly complex and I have not
 +
found any helpers for integrating with the jQuery Cycle Plugin.
 +
MaxCycle is intended to solve this problem.
 +
 +
TABLE OF CONTENTS:
 +
@Modern
 +
@setup
 +
@resize
 +
@preload
 +
@Old
 +
@setup
 +
@preload
 +
@onceloaded
 +
@maximage
 +
@windowresize
 +
@doneresizing
 +
@Cycle
 +
@setup
 +
@Adjust
 +
@center
 +
@fill
 +
@maxcover
 +
@maxcontain
 +
@Utils
 +
@browser_tests
 +
@construct_slide_object
 +
@sizes
 +
@modern_browser
 +
@debug
 +
 +
*/
 +
/*!
 +
* Maximage Version: 2.0.8 (16-Jan-2012) - http://www.aaronvanderzwan.com/maximage/2.0/
 +
*/
 +
 +
 +
 +
(function ($) {
 +
"use strict";
 +
$.fn.maximage = function (settings, helperSettings) {
 +
 +
var config;
 +
 +
if (typeof settings == 'object' || settings === undefined) config = $.extend( $.fn.maximage.defaults, settings || {} );
 +
if (typeof settings == 'string') config = $.fn.maximage.defaults;
 +
 +
/*jslint browser: true*/
 +
$.Body = $('body');
 +
$.Window = $(window);
 +
$.Scroll = $('html, body');
 +
$.Events = {
 +
RESIZE: 'resize'
 +
};
 +
 +
this.each(function() {
 +
var $self = $(this),
 +
preload_count = 0,
 +
imageCache = [];
 +
 +
/* --------------------- */
 +
 +
// @Modern
 +
 +
/*
 +
MODERN BROWSER NOTES:
 +
Modern browsers have CSS3 background-size option so we setup the DOM to be the following structure for cycle plugin:
 +
div = cycle
 +
div = slide with background-size:cover
 +
div = slide with background-size:cover
 +
etc.
 +
*/
 +
 +
var Modern = {
 +
setup: function(){
 +
if($.Slides.length > 0){
 +
var i,
 +
len = $.Slides.length;
 +
 +
// Setup images
 +
for(i=0; i < len; i++) {
 +
// Set our image
 +
var $img = $.Slides[i];
 +
 +
// Create a div with a background image so we can use CSS3's position cover (for modern browsers)
 +
$self.append('<div class="mc-image ' + $img.theclass + '" title="' + $img.alt + '" style="background-image:url(\'' + $img.url + '\');' + $img.style + '" data-href="'+ $img.datahref +'">'+ $img.content +'</div>');
 +
}
 +
 +
// Begin our preload process (increments itself after load)
 +
Modern.preload(0);
 +
 +
// If using Cycle, this resets the height and width of each div to always fill the window; otherwise can be done with CSS
 +
Modern.resize();
 +
}
 +
},
 +
preload: function(n){
 +
// Preload all of the images but never show them, just use their completion so we know that they are done
 +
// and so that the browser can cache them / fade them in smoothly
 +
 +
// Create new image object
 +
var $img = $('<img/>');
 +
$img.load(function() {
 +
// Once the first image has completed loading, start the slideshow, etc.
 +
if(preload_count==0) {
 +
// Only start cycle after first image has loaded
 +
Cycle.setup();
 +
 +
// Run user defined onFirstImageLoaded() function
 +
config.onFirstImageLoaded();
 +
}
 +
 +
// preload_count starts with 0, $.Slides.length starts with 1
 +
if(preload_count==($.Slides.length-1)) {
 +
// If we have just loaded the final image, run the user defined function onImagesLoaded()
 +
config.onImagesLoaded( $self );
 +
}else{
 +
// Increment the counter
 +
preload_count++;
 +
 +
// Load the next image
 +
Modern.preload(preload_count);
 +
}
 +
});
 +
 +
// Set the src... this triggers begin of load
 +
$img[0].src = $.Slides[n].url;
 +
 +
// Push to external array to avoid cleanup by aggressive garbage collectors
 +
imageCache.push($img[0]);
 +
},
 +
resize: function(){
 +
// Cycle sets the height of each slide so when we resize our browser window this becomes a problem.
 +
//  - the cycle option 'slideResize' has to be set to false otherwise it will trump our resize
 +
$.Window
 +
.bind($.Events.RESIZE,
 +
function(){
 +
// Remove scrollbars so we can take propper measurements
 +
$.Scroll.addClass('mc-hide-scrolls');
 +
 +
// Set vars so we don't have to constantly check it
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Set container and slides height and width to match the window size
 +
$self
 +
.height($.Window.data('h')).width($.Window.data('w'))
 +
.children()
 +
.height($.Window.data('h')).width($.Window.data('w'));
 +
 +
// This is special noise for cycle (cycle has separate height and width for each slide)
 +
$self.children().each(function(){
 +
this.cycleH = $.Window.data('h');
 +
this.cycleW = $.Window.data('w');
 +
});
 +
 +
// Put the scrollbars back to how they were
 +
$($.Scroll).removeClass('mc-hide-scrolls');
 +
});
 +
}
 +
}
 +
 +
 +
 +
/* --------------------- */
 +
 +
// @Old
 +
 +
/*
 +
OLD BROWSER NOTES:
 +
We setup the dom to be the following structure for cycle plugin on old browsers:
 +
div = cycle
 +
div = slide
 +
img = full screen size image
 +
div = slide
 +
img = full screen size image
 +
etc.
 +
*/
 +
 +
var Old = {
 +
setup: function(){
 +
var c, t, $div, j, slideLen = $.Slides.length;
 +
 +
// Clear container
 +
if($.BrowserTests.msie && !config.overrideMSIEStop){
 +
// Stop IE from continually trying to preload images that we already removed
 +
document.execCommand("Stop", false);
 +
}
 +
$self.html('');
 +
 +
$.Body.addClass('mc-old-browser');
 +
 +
if($.Slides.length > 0){
 +
// Remove scrollbars so we can take propper measurements
 +
$.Scroll.addClass('mc-hide-scrolls');
 +
 +
// Cache our new dimensions
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Add our loading div to the DOM
 +
$('body').append($("<div></div>").attr("class", "mc-loader").css({'position':'absolute','left':'-9999px'}));
 +
 +
//  Loop through slides
 +
for(j = 0; j < slideLen; j++) {
 +
// Determine content (if container or image)
 +
if($.Slides[j].content.length == 0){
 +
c = '<img src="' + $.Slides[j].url + '" />';
 +
}else{
 +
c = $.Slides[j].content;
 +
}
 +
 +
// Create Div
 +
$div = $("<div>" + c + "</div>").attr("class", "mc-image mc-image-n" + j + " " + $.Slides[j].theclass);
 +
 +
// Add new container div to the DOM
 +
$self.append( $div );
 +
 +
// Account for slides without images
 +
if($('.mc-image-n' + j).children('img').length == 0){
 +
}else{
 +
// Add first image to loader to get that started
 +
$('div.mc-loader').append( $('.mc-image-n' + j).children('img').first().clone().addClass('not-loaded') );
 +
}
 +
}
 +
 +
// Begin preloading
 +
Old.preload();
 +
 +
// Setup the resize function to listen for window changes
 +
Old.windowResize();
 +
}
 +
},
 +
preload: function(){
 +
// Intervals to tell if an images have loaded
 +
var t = setInterval(function() {
 +
$('.mc-loader').children('img').each(function(i){
 +
// Check if image is loaded
 +
var $img = $(this);
 +
 +
// Loop through not-loaded images
 +
if($img.hasClass('not-loaded')){
 +
if( $img.height() > 0 ){
 +
// Remove Dom notice
 +
$(this).removeClass('not-loaded');
 +
 +
// Set the dimensions
 +
var $img1 = $('div.mc-image-n' + i).children('img').first();
 +
 +
$img1
 +
.data('h', $img.height())
 +
.data('w', $img.width())
 +
.data('ar', ($img.width() / $img.height()));
 +
 +
// Go on
 +
Old.onceLoaded(i)
 +
}
 +
}
 +
});
 +
 +
if( $('.not-loaded').length == 0){
 +
// Remove our loader element because all of our images are now loaded
 +
$('.mc-loader').remove();
 +
 +
// Clear interval when all images are loaded
 +
clearInterval(t);
 +
}
 +
}, 1000);
 +
},
 +
onceLoaded: function(m){
 +
// Do maximage magic
 +
Old.maximage(m);
 +
 +
// Once the first image has completed loading, start the slideshow, etc.
 +
if(m == 0) {
 +
// If we changed the visibility before, make sure it is back on
 +
$self.css({'visibility':'visible'});
 +
 +
// Run user defined onFirstImageLoaded() function
 +
config.onFirstImageLoaded();
 +
 +
// After everything is done loading, clean up
 +
}else if(m == $.Slides.length - 1){
 +
// Only start cycle after the first image has loaded
 +
Cycle.setup();
 +
 +
// Put the scrollbars back to how they were
 +
$($.Scroll).removeClass('mc-hide-scrolls');
 +
 +
// If we have just loaded the final image, run the user defined function onImagesLoaded()
 +
config.onImagesLoaded( $self );
 +
 +
if(config.debug) {
 +
debug(' - Final Maximage - ');debug($self);
 +
}
 +
}
 +
},
 +
maximage: function(p){
 +
// Cycle sets the height of each slide so when we resize our browser window this becomes a problem.
 +
//  - the cycle option 'slideResize' has to be set to false otherwise it will trump our resize
 +
$('div.mc-image-n' + p)
 +
.height($.Window.data('h'))
 +
.width($.Window.data('w'))
 +
.children('img')
 +
.first()
 +
.each(function(){
 +
Adjust.maxcover($(this));
 +
});
 +
},
 +
windowResize: function(){
 +
$.Window
 +
.bind($.Events.RESIZE,
 +
function(){
 +
clearTimeout(this.id);
 +
 +
if($('.mc-image').length >= 1){
 +
this.id = setTimeout(Old.doneResizing, 200);
 +
}
 +
});
 +
},
 +
doneResizing: function(){
 +
// The final resize (on finish)
 +
// Remove scrollbars so we can take propper measurements
 +
$($.Scroll).addClass('mc-hide-scrolls');
 +
 +
// Cache our window's new dimensions
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Set the container's height and width
 +
$self.height($.Window.data('h')).width($.Window.data('w'))
 +
 +
// Set slide's height and width to match the window size
 +
$self.find('.mc-image').each(function(n){
 +
Old.maximage(n);
 +
});
 +
 +
// Update cycle's ideas of what our slide's height and width should be
 +
var curr_opts = $self.data('cycle.opts');
 +
if(curr_opts != undefined){
 +
curr_opts.height = $.Window.data('h');
 +
curr_opts.width = $.Window.data('w');
 +
jQuery.each(curr_opts.elements, function(index, item) {
 +
    item.cycleW = $.Window.data('w');
 +
item.cycleH = $.Window.data('h');
 +
});
 +
}
 +
 +
// Put the scrollbars back to how they were
 +
$($.Scroll).removeClass('mc-hide-scrolls');
 +
}
 +
}
 +
 +
 +
/* --------------------- */
 +
 +
// @Cycle
 +
 +
var Cycle = {
 +
setup: function(){
 +
var h,w;
 +
 +
$self.addClass('mc-cycle');
 +
 +
// Container sizes (if not set)
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Prefer CSS Transitions
 +
jQuery.easing.easeForCSSTransition = function(x, t, b, c, d, s) {
 +
return b+c;
 +
};
 +
 +
var cycleOptions = $.extend({
 +
fit:1,
 +
containerResize:0,
 +
height:$.Window.data('h'),
 +
width:$.Window.data('w'),
 +
slideResize: false,
 +
easing: ($.BrowserTests.cssTransitions && config.cssTransitions ? 'easeForCSSTransition' : 'swing')
 +
}, config.cycleOptions);
 +
 +
$self.cycle( cycleOptions );
 +
}
 +
}
 +
 +
 +
 +
/* --------------------- */
 +
 +
// @Adjust = Math to center and fill all elements
 +
 +
var Adjust = {
 +
center: function($item){
 +
// Note: if alignment is 'left' or 'right' it can be controlled with CSS once verticalCenter
 +
// and horizontal center are set to false in the plugin options
 +
if(config.verticalCenter){
 +
$item.css({marginTop:(($item.height() - $.Window.data('h'))/2) * -1})
 +
}
 +
if(config.horizontalCenter){
 +
$item.css({marginLeft:(($item.width() - $.Window.data('w'))/2) * -1});
 +
}
 +
},
 +
fill: function($item){
 +
var $storageEl = $item.is('object') ? $item.parent().first() : $item;
 +
 +
if(typeof config.backgroundSize == 'function'){
 +
// If someone wants to write their own fill() function, they can: example customBackgroundSize.html
 +
config.backgroundSize( $item );
 +
}else if(config.backgroundSize == 'cover'){
 +
if($.Window.data('w') / $.Window.data('h') < $storageEl.data('ar')){
 +
$item
 +
.height($.Window.data('h'))
 +
.width(($.Window.data('h') * $storageEl.data('ar')).toFixed(0));
 +
}else{
 +
$item
 +
.height(($.Window.data('w') / $storageEl.data('ar')).toFixed(0))
 +
.width($.Window.data('w'));
 +
}
 +
}else if(config.backgroundSize == 'contain'){
 +
if($.Window.data('w') / $.Window.data('h') < $storageEl.data('ar')){
 +
$item
 +
.height(($.Window.data('w') / $storageEl.data('ar')).toFixed(0))
 +
.width($.Window.data('w'));
 +
}else{
 +
$item
 +
.height($.Window.data('h'))
 +
.width(($.Window.data('h') * $storageEl.data('ar')).toFixed(0));
 +
}
 +
}else{
 +
debug('The backgroundSize option was not recognized for older browsers.');
 +
}
 +
},
 +
maxcover: function($item){
 +
Adjust.fill($item);
 +
Adjust.center($item);
 +
},
 +
maxcontain: function($item){
 +
Adjust.fill($item);
 +
Adjust.center($item);
 +
}
 +
}
 +
 +
 +
 +
/* --------------------- */
 +
 +
// @Utils = General utilities for the plugin
 +
 +
var Utils = {
 +
browser_tests: function(){
 +
var $div = $('<div />')[0],
 +
vendor = ['Moz', 'Webkit', 'Khtml', 'O', 'ms'],
 +
p = 'transition',
 +
obj = {
 +
cssTransitions: false,
 +
cssBackgroundSize: ( "backgroundSize" in $div.style && config.cssBackgroundSize ), // Can override cssBackgroundSize in options
 +
html5Video: false,
 +
msie: false
 +
};
 +
 +
// Test for CSS Transitions
 +
if(config.cssTransitions){
 +
if(typeof $div.style[p] == 'string') { obj.cssTransitions = true }
 +
 +
// Tests for vendor specific prop
 +
p = p.charAt(0).toUpperCase() + p.substr(1);
 +
for(var i=0; i<vendor.length; i++) {
 +
if(vendor[i] + p in $div.style) { obj.cssTransitions = true; }
 +
}
 +
}
 +
 +
// Check if we can play html5 videos
 +
if( !!document.createElement('video').canPlayType ) {
 +
obj.html5Video = true;
 +
}
 +
 +
// Check for MSIE since we lost $.browser in jQuery
 +
obj.msie = (Utils.msie() !== undefined);
 +
 +
 +
if(config.debug) {
 +
debug(' - Browser Test - ');debug(obj);
 +
}
 +
 +
return obj;
 +
},
 +
construct_slide_object: function(){
 +
var obj = new Object(),
 +
arr = new Array(),
 +
temp = '';
 +
 +
$self.children().each(function(i){
 +
var $img = $(this).is('img') ? $(this).clone() : $(this).find('img').first().clone();
 +
 +
// reset obj
 +
obj = {};
 +
 +
// set attributes to obj
 +
obj.url = $img.attr('src');
 +
obj.title = $img.attr('title') != undefined ? $img.attr('title') : '';
 +
obj.alt = $img.attr('alt') != undefined ? $img.attr('alt') : '';
 +
obj.theclass = $img.attr('class') != undefined ? $img.attr('class') : '';
 +
obj.styles = $img.attr('style') != undefined ? $img.attr('style') : '';
 +
obj.orig = $img.clone();
 +
obj.datahref = $img.attr('data-href') != undefined ? $img.attr('data-href') : '';
 +
obj.content = "";
 +
 +
// Setup content for within container
 +
if($(this).find('img').length > 0){
 +
if($.BrowserTests.cssBackgroundSize){
 +
$(this).find('img').first().remove();
 +
}
 +
obj.content = $(this).html();
 +
}
 +
 +
// Stop loading image so we can load them sequentiallyelse{
 +
$img[0].src = "";
 +
 +
// Remove original object (only on nonIE. IE hangs if you remove an image during load)
 +
if($.BrowserTests.cssBackgroundSize){
 +
$(this).remove();
 +
}
 +
 +
// attach obj to arr
 +
arr.push(obj);
 +
});
 +
 +
 +
if(config.debug) {
 +
debug(' - Slide Object - ');debug(arr);
 +
}
 +
return arr;
 +
},
 +
msie: function(){
 +
    var undef,
 +
        v = 3,
 +
        div = document.createElement('div'),
 +
        all = div.getElementsByTagName('i');
 +
 +
    while (
 +
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
 +
        all[0]
 +
    );
 +
 +
    return v > 4 ? v : undef;
 +
},
 +
sizes: function(){
 +
var sizes = {h:0,w:0};
 +
 +
if(config.fillElement == "window"){
 +
sizes.h = $.Window.height();
 +
sizes.w = $.Window.width();
 +
}else{
 +
var $fillElement = $self.parents(config.fillElement).first();
 +
 +
// Height
 +
if($fillElement.height() == 0 || $fillElement.data('windowHeight') == true){
 +
$fillElement.data('windowHeight',true);
 +
sizes.h = $.Window.height();
 +
}else{
 +
sizes.h = $fillElement.height();
 +
}
 +
 +
// Width
 +
if($fillElement.width() == 0 || $fillElement.data('windowWidth') == true){
 +
$fillElement.data('windowWidth',true);
 +
sizes.w = $.Window.width();
 +
}else{
 +
sizes.w = $fillElement.width();
 +
}
 +
}
 +
 +
return sizes;
 +
}
 +
}
 +
 +
 +
 +
/* --------------------- */
 +
 +
// @Instantiation
 +
 +
// Helper Function
 +
// Run tests to see what our browser can handle
 +
$.BrowserTests = Utils.browser_tests();
 +
 +
if(typeof settings == 'string'){
 +
// TODO: Resize object fallback for old browsers,  If we are trying to size an HTML5 video and our browser doesn't support it
 +
if($.BrowserTests.html5Video || !$self.is('video')) {
 +
var to,
 +
$storageEl = $self.is('object') ? $self.parent().first() : $self; // Can't assign .data() to '<object>'
 +
 +
if( !$.Body.hasClass('mc-old-browser') )
 +
$.Body.addClass('mc-old-browser');
 +
 +
// Cache our window's new dimensions
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Please include height and width attributes on your html elements
 +
$storageEl
 +
.data('h', $self.height())
 +
.data('w', $self.width())
 +
.data('ar', $self.width() / $self.height());
 +
 +
// We want to resize these elements with the window
 +
$.Window
 +
.bind($.Events.RESIZE,
 +
function(){
 +
// Cache our window's new dimensions
 +
$.Window
 +
.data('h', Utils.sizes().h)
 +
.data('w', Utils.sizes().w);
 +
 +
// Limit resize runs
 +
to = $self.data('resizer');
 +
clearTimeout(to);
 +
to = setTimeout( Adjust[settings]($self), 200 );
 +
$self.data('resizer', to);
 +
});
 +
 +
// Initial run
 +
Adjust[settings]($self);
 +
}
 +
}else{
 +
// Construct array of image objects for us to use
 +
$.Slides = Utils.construct_slide_object();
 +
 +
// If we are allowing background-size:cover run Modern
 +
if($.BrowserTests.cssBackgroundSize){
 +
if(config.debug) debug(' - Using Modern - ');
 +
Modern.setup();
 +
}else{
 +
if(config.debug) debug(' - Using Old - ');
 +
Old.setup();
 +
}
 +
}
 +
});
 +
 +
// private function for debugging
 +
function debug($obj) {
 +
if (window.console && window.console.log) {
 +
window.console.log($obj);
 +
}
 +
}
 +
}
 +
 +
// Default options
 +
$.fn.maximage.defaults = {
 +
debug: false,
 +
cssBackgroundSize: true,  // Force run the functionality used for newer browsers
 +
cssTransitions: true,  // Force run the functionality used for old browsers
 +
verticalCenter: true, // Only necessary for old browsers
 +
horizontalCenter: true, // Only necessary for old browsers
 +
scaleInterval: 20, // Only necessary for old browsers
 +
backgroundSize: 'cover', // Only necessary for old browsers (this can be function)
 +
fillElement: 'window', // Either 'window' or a CSS selector for a parent element
 +
overrideMSIEStop: false, // This gives the option to not 'stop' load for MSIE (stops coded background images from loading so we can preload)...
 +
// If setting this option to true, please beware of IE7/8 "Stack Overflow" error but if there are more than 13 slides
 +
// The description of the bug: http://blog.aaronvanderzwan.com/forums/topic/stack-overflow-in-ie-7-8/#post-33038
 +
onFirstImageLoaded: function(){},
 +
onImagesLoaded: function(){}
 +
}
 +
})(jQuery);
 +
 +
/**
 +
* @preserve jquery.fullscreen 1.1.4
 +
* https://github.com/kayahr/jquery-fullscreen-plugin
 +
* Copyright (C) 2012 Klaus Reimer <k@ailis.de>
 +
* Licensed under the MIT license
 +
* (See http://www.opensource.org/licenses/mit-license)
 +
*/
 +
 +
(function() {
 +
 +
/**
 +
* Sets or gets the fullscreen state.
 +
*
 +
* @param {boolean=} state
 +
*            True to enable fullscreen mode, false to disable it. If not
 +
*            specified then the current fullscreen state is returned.
 +
* @return {boolean|Element|jQuery|null}
 +
*            When querying the fullscreen state then the current fullscreen
 +
*            element (or true if browser doesn't support it) is returned
 +
*            when browser is currently in full screen mode. False is returned
 +
*            if browser is not in full screen mode. Null is returned if
 +
*            browser doesn't support fullscreen mode at all. When setting
 +
*            the fullscreen state then the current jQuery selection is
 +
*            returned for chaining.
 +
* @this {jQuery}
 +
*/
 +
function fullScreen(state)
 +
{
 +
    var e, func, doc;
 +
   
 +
    // Do nothing when nothing was selected
 +
    if (!this.length) return this;
 +
   
 +
    // We only use the first selected element because it doesn't make sense
 +
    // to fullscreen multiple elements.
 +
    e = (/** @type {Element} */ this[0]);
 +
   
 +
    // Find the real element and the document (Depends on whether the
 +
    // document itself or a HTML element was selected)
 +
    if (e.ownerDocument)
 +
    {
 +
        doc = e.ownerDocument;
 +
    }
 +
    else
 +
    {
 +
        doc = e;
 +
        e = doc.documentElement;
 +
    }
 +
   
 +
    // When no state was specified then return the current state.
 +
    if (state == null)
 +
    {
 +
        // When fullscreen mode is not supported then return null
 +
        if (!((/** @type {?Function} */ doc["cancelFullScreen"])
 +
            || (/** @type {?Function} */ doc["webkitCancelFullScreen"])
 +
            || (/** @type {?Function} */ doc["mozCancelFullScreen"])))
 +
        {
 +
            return null;
 +
        }
 +
       
 +
        // Check fullscreen state
 +
        state = !!doc["fullScreen"]
 +
            || !!doc["webkitIsFullScreen"]
 +
            || !!doc["mozFullScreen"];
 +
        if (!state) return state;
 +
       
 +
        // Return current fullscreen element or "true" if browser doesn't
 +
        // support this
 +
        return (/** @type {?Element} */ doc["fullScreenElement"])
 +
            || (/** @type {?Element} */ doc["webkitCurrentFullScreenElement"])
 +
            || (/** @type {?Element} */ doc["mozFullScreenElement"])
 +
            || state;
 +
    }
 +
   
 +
    // When state was specified then enter or exit fullscreen mode.
 +
    if (state)
 +
    {
 +
        // Enter fullscreen
 +
        func = (/** @type {?Function} */ e["requestFullScreen"])
 +
            || (/** @type {?Function} */ e["webkitRequestFullScreen"])
 +
            || (/** @type {?Function} */ e["mozRequestFullScreen"]);
 +
        if (func)
 +
        {
 +
            if (Element["ALLOW_KEYBOARD_INPUT"])
 +
                func.call(e, Element["ALLOW_KEYBOARD_INPUT"]);
 +
            else
 +
                func.call(e);
 +
        }
 +
        return this;
 +
    }
 +
    else
 +
    {
 +
        // Exit fullscreen
 +
        func = (/** @type {?Function} */ doc["cancelFullScreen"])
 +
            || (/** @type {?Function} */ doc["webkitCancelFullScreen"])
 +
            || (/** @type {?Function} */ doc["mozCancelFullScreen"]);
 +
        if (func) func.call(doc);
 +
        return this;
 +
    }
 +
}
 +
 +
/**
 +
* Toggles the fullscreen mode.
 +
*
 +
* @return {!jQuery}
 +
*            The jQuery selection for chaining.
 +
* @this {jQuery}
 +
*/
 +
function toggleFullScreen()
 +
{
 +
    return (/** @type {!jQuery} */ fullScreen.call(this,
 +
        !fullScreen.call(this)));
 +
}
 +
 +
/**
 +
* Handles the browser-specific fullscreenchange event and triggers
 +
* a jquery event for it.
 +
*
 +
* @param {?Event} event
 +
*            The fullscreenchange event.
 +
*/
 +
function fullScreenChangeHandler(event)
 +
{
 +
    jQuery(document).trigger(new jQuery.Event("fullscreenchange"));
 +
}
 +
 +
/**
 +
* Handles the browser-specific fullscreenerror event and triggers
 +
* a jquery event for it.
 +
*
 +
* @param {?Event} event
 +
*            The fullscreenerror event.
 +
*/
 +
function fullScreenErrorHandler(event)
 +
{
 +
    jQuery(document).trigger(new jQuery.Event("fullscreenerror"));
 +
}
 +
 +
/**
 +
* Installs the fullscreenchange event handler.
 +
*/
 +
function installFullScreenHandlers()
 +
{
 +
    var e, change, error;
 +
   
 +
    // Determine event name
 +
    e = document;
 +
    if (e["webkitCancelFullScreen"])
 +
    {
 +
        change = "webkitfullscreenchange";
 +
        error = "webkitfullscreenerror";
 +
    }
 +
    else if (e["mozCancelFullScreen"])
 +
    {
 +
        change = "mozfullscreenchange";
 +
        error = "mozfullscreenerror";
 +
    }
 +
    else
 +
    {
 +
        change = "fullscreenchange";
 +
        error = "fullscreenerror";
 +
    }
 +
 +
    // Install the event handlers
 +
    jQuery(document).bind(change, fullScreenChangeHandler);
 +
    jQuery(document).bind(error, fullScreenErrorHandler);
 +
}
 +
 +
jQuery.fn["fullScreen"] = fullScreen;
 +
jQuery.fn["toggleFullScreen"] = toggleFullScreen;
 +
installFullScreenHandlers();
 +
 +
})();
 +
 +
/*
 +
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
 +
*
 +
* Uses the built in easing capabilities added In jQuery 1.1
 +
* to offer multiple easing options
 +
*
 +
* TERMS OF USE - EASING EQUATIONS
 +
*
 +
* Open source under the BSD License.
 +
*
 +
* Copyright © 2001 Robert Penner
 +
* All rights reserved.
 +
*
 +
* TERMS OF USE - jQuery Easing
 +
*
 +
* Open source under the BSD License.
 +
*
 +
* Copyright © 2008 George McGinley Smith
 +
* All rights reserved.
 +
*
 +
* Redistribution and use in source and binary forms, with or without modification,
 +
* are permitted provided that the following conditions are met:
 +
*
 +
* Redistributions of source code must retain the above copyright notice, this list of
 +
* conditions and the following disclaimer.
 +
* Redistributions in binary form must reproduce the above copyright notice, this list
 +
* of conditions and the following disclaimer in the documentation and/or other materials
 +
* provided with the distribution.
 +
*
 +
* Neither the name of the author nor the names of contributors may be used to endorse
 +
* or promote products derived from this software without specific prior written permission.
 +
*
 +
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
 +
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
 +
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
 +
*  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
 +
*  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
 +
*  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
 +
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 +
*  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
 +
* OF THE POSSIBILITY OF SUCH DAMAGE.
 +
*
 +
*/
 +
jQuery.easing.jswing=jQuery.easing.swing;jQuery.extend(jQuery.easing,{def:"easeOutQuad",swing:function(e,f,a,h,g){return jQuery.easing[jQuery.easing.def](e,f,a,h,g)},easeInQuad:function(e,f,a,h,g){return h*(f/=g)*f+a},easeOutQuad:function(e,f,a,h,g){return -h*(f/=g)*(f-2)+a},easeInOutQuad:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f+a}return -h/2*((--f)*(f-2)-1)+a},easeInCubic:function(e,f,a,h,g){return h*(f/=g)*f*f+a},easeOutCubic:function(e,f,a,h,g){return h*((f=f/g-1)*f*f+1)+a},easeInOutCubic:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f+a}return h/2*((f-=2)*f*f+2)+a},easeInQuart:function(e,f,a,h,g){return h*(f/=g)*f*f*f+a},easeOutQuart:function(e,f,a,h,g){return -h*((f=f/g-1)*f*f*f-1)+a},easeInOutQuart:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f+a}return -h/2*((f-=2)*f*f*f-2)+a},easeInQuint:function(e,f,a,h,g){return h*(f/=g)*f*f*f*f+a},easeOutQuint:function(e,f,a,h,g){return h*((f=f/g-1)*f*f*f*f+1)+a},easeInOutQuint:function(e,f,a,h,g){if((f/=g/2)<1){return h/2*f*f*f*f*f+a}return h/2*((f-=2)*f*f*f*f+2)+a},easeInSine:function(e,f,a,h,g){return -h*Math.cos(f/g*(Math.PI/2))+h+a},easeOutSine:function(e,f,a,h,g){return h*Math.sin(f/g*(Math.PI/2))+a},easeInOutSine:function(e,f,a,h,g){return -h/2*(Math.cos(Math.PI*f/g)-1)+a},easeInExpo:function(e,f,a,h,g){return(f==0)?a:h*Math.pow(2,10*(f/g-1))+a},easeOutExpo:function(e,f,a,h,g){return(f==g)?a+h:h*(-Math.pow(2,-10*f/g)+1)+a},easeInOutExpo:function(e,f,a,h,g){if(f==0){return a}if(f==g){return a+h}if((f/=g/2)<1){return h/2*Math.pow(2,10*(f-1))+a}return h/2*(-Math.pow(2,-10*--f)+2)+a},easeInCirc:function(e,f,a,h,g){return -h*(Math.sqrt(1-(f/=g)*f)-1)+a},easeOutCirc:function(e,f,a,h,g){return h*Math.sqrt(1-(f=f/g-1)*f)+a},easeInOutCirc:function(e,f,a,h,g){if((f/=g/2)<1){return -h/2*(Math.sqrt(1-f*f)-1)+a}return h/2*(Math.sqrt(1-(f-=2)*f)+1)+a},easeInElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return -(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e},easeOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k)==1){return e+l}if(!j){j=k*0.3}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}return g*Math.pow(2,-10*h)*Math.sin((h*k-i)*(2*Math.PI)/j)+l+e},easeInOutElastic:function(f,h,e,l,k){var i=1.70158;var j=0;var g=l;if(h==0){return e}if((h/=k/2)==2){return e+l}if(!j){j=k*(0.3*1.5)}if(g<Math.abs(l)){g=l;var i=j/4}else{var i=j/(2*Math.PI)*Math.asin(l/g)}if(h<1){return -0.5*(g*Math.pow(2,10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j))+e}return g*Math.pow(2,-10*(h-=1))*Math.sin((h*k-i)*(2*Math.PI)/j)*0.5+l+e},easeInBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*(f/=h)*f*((g+1)*f-g)+a},easeOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}return i*((f=f/h-1)*f*((g+1)*f+g)+1)+a},easeInOutBack:function(e,f,a,i,h,g){if(g==undefined){g=1.70158}if((f/=h/2)<1){return i/2*(f*f*(((g*=(1.525))+1)*f-g))+a}return i/2*((f-=2)*f*(((g*=(1.525))+1)*f+g)+2)+a},easeInBounce:function(e,f,a,h,g){return h-jQuery.easing.easeOutBounce(e,g-f,0,h,g)+a},easeOutBounce:function(e,f,a,h,g){if((f/=g)<(1/2.75)){return h*(7.5625*f*f)+a}else{if(f<(2/2.75)){return h*(7.5625*(f-=(1.5/2.75))*f+0.75)+a}else{if(f<(2.5/2.75)){return h*(7.5625*(f-=(2.25/2.75))*f+0.9375)+a}else{return h*(7.5625*(f-=(2.625/2.75))*f+0.984375)+a}}}},easeInOutBounce:function(e,f,a,h,g){if(f<g/2){return jQuery.easing.easeInBounce(e,f*2,0,h,g)*0.5+a}return jQuery.easing.easeOutBounce(e,f*2-g,0,h,g)*0.5+h*0.5+a}});
 +
 +
 
/*!
 
/*!
 
  * jQuery Cycle Plugin (with Transition Definitions)
 
  * jQuery Cycle Plugin (with Transition Definitions)

Latest revision as of 09:16, 3 June 2015