/** * jQuery lightBox plugin * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/) * and adapted to me for use like a plugin from jQuery. * @name jquery-lightbox-0.4.js * @author Leandro Vieira Pinho - http://leandrovieira.com * @version 0.4 * @date November 17, 2007 * @category jQuery plugin * @copyright (c) 2007 Leandro Vieira Pinho (leandrovieira.com) * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin */ // Offering a Custom Alias suport - More info: http://docs.jquery.com/Plugins/Authoring#Custom_Alias (function($) { /** * $ is an alias to jQuery object * */ $.fn.lightBox = function(settings) { // Settings to configure the jQuery lightBox plugin how you like settings = jQuery.extend({ // Configuration related to overlay overlayBgColor: '#000', // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color. overlayOpacity: 0.8, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9 // Configuration related to images imageLoading: '/images/lightbox/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon imageBtnPrev: '/images/lightbox/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image imageBtnNext: '/images/lightbox/lightbox-btn-next.gif', // (string) Path and the name of the next button image imageBtnClose: '/images/lightbox/lightbox-btn-close.gif', // (string) Path and the name of the close btn imageBlank: '/images/lightbox/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel) // Configuration related to container image box containerBorderSize: 10, // (integer) If you adjust the padding in the CSS for the container, #lightbox-container-image-box, you will need to update this value containerResizeSpeed: 400, // (integer) Specify the resize duration of container image. These number are miliseconds. 400 is default. // Configuration related to texts in caption. For example: Image 2 of 8. You can alter either "Image" and "of" texts. txtImage: 'Bild', // (string) Specify text "Image" txtOf: '/', // (string) Specify text "of" // Configuration related to keyboard navigation keyToClose: 'c', // (string) (c = close) Letter to close the jQuery lightBox interface. Beyond this letter, the letter X and the SCAPE key is used to. keyToPrev: 'p', // (string) (p = previous) Letter to show the previous image keyToNext: 'n', // (string) (n = next) Letter to show the next image. // Don�t alter these variables in any way imageArray: [], activeImage: 0 },settings); // Caching the jQuery object with all elements matched var jQueryMatchedObj = this; // This, in this context, refer to jQuery object /** * Initializing the plugin calling the start function * * @return boolean false */ function _initialize() { _start(this,jQueryMatchedObj); // This, in this context, refer to object (link) which the user have clicked return false; // Avoid the browser following the link } /** * Start the jQuery lightBox plugin * * @param object objClicked The object (link) whick the user have clicked * @param object jQueryMatchedObj The jQuery object with all elements matched */ function _start(objClicked,jQueryMatchedObj) { // Hime some elements to avoid conflict with overlay in IE. These elements appear above the overlay. $('embed, object, select').css({ 'visibility' : 'hidden' }); // Call the function to create the markup structure; style some elements; assign events in some elements. _set_interface(); // Unset total images in imageArray settings.imageArray.length = 0; // Unset image active information settings.activeImage = 0; // We have an image set? Or just an image? Let�s see it. if ( jQueryMatchedObj.length == 1 ) { settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title'))); } else { // Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references for ( var i = 0; i < jQueryMatchedObj.length; i++ ) { settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title'))); } } while ( settings.imageArray[settings.activeImage][0] != objClicked.getAttribute('href') ) { settings.activeImage++; } // Call the function that prepares image exibition _set_image_to_view(); } /** * Create the jQuery lightBox plugin interface * * The HTML markup will be like that:
* */ function _set_interface() { // Apply the HTML markup into body tag $('body').append('
'); // Get page sizes var arrPageSizes = ___getPageSize(); // Style overlay and show it $('#jquery-overlay').css({ backgroundColor: settings.overlayBgColor, opacity: settings.overlayOpacity, width: arrPageSizes[0], height: arrPageSizes[1] }).fadeIn(); // Get page scroll var arrPageScroll = ___getPageScroll(); // Calculate top and left offset for the jquery-lightbox div object and show it $('#jquery-lightbox').css({ top: arrPageScroll[1] + (arrPageSizes[3] / 10), left: arrPageScroll[0] }).show(); // Assigning click events in elements to close overlay $('#jquery-overlay,#jquery-lightbox').click(function() { _finish(); }); // Assign the _finish function to lightbox-loading-link and lightbox-secNav-btnClose objects $('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() { _finish(); return false; }); // If window was resized, calculate the new overlay dimensions $(window).resize(function() { // Get page sizes var arrPageSizes = ___getPageSize(); // Style overlay and show it $('#jquery-overlay').css({ width: arrPageSizes[0], height: arrPageSizes[1] }); // Get page scroll var arrPageScroll = ___getPageScroll(); // Calculate top and left offset for the jquery-lightbox div object and show it $('#jquery-lightbox').css({ top: arrPageScroll[1] + (arrPageSizes[3] / 10), left: arrPageScroll[0] }); }); } /** * Prepares image exibition; doing a image�s preloader to calculate it�s size * */ function _set_image_to_view() { // show the loading // Show the loading $('#lightbox-loading').show(); // Hide some elements $('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide(); // Image preload process var objImagePreloader = new Image(); objImagePreloader.onload = function() { $('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]); // Perfomance an effect in the image container resizing it _resize_container_image_box(objImagePreloader.width,objImagePreloader.height); // clear onLoad, IE behaves irratically with animated gifs otherwise objImagePreloader.onload=function(){}; } objImagePreloader.src = settings.imageArray[settings.activeImage][0]; }; /** * Perfomance an effect in the image container resizing it * * @param integer intImageWidth The image�s width that will be showed * @param integer intImageHeight The image�s height that will be showed */ function _resize_container_image_box(intImageWidth,intImageHeight) { // Get current width and height var intCurrentWidth = $('#lightbox-container-image-box').width(); var intCurrentHeight = $('#lightbox-container-image-box').height(); // Get the width and height of the selected image plus the padding var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image�s width and the left and right padding value var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image�s height and the left and right padding value // Diferences var intDiffW = intCurrentWidth - intWidth; var intDiffH = intCurrentHeight - intHeight; // Perfomance the effect $('#lightbox-container-image-box').animate({ width: intWidth, height: intHeight },settings.containerResizeSpeed,function() { _show_image(); }); if ( ( intDiffW == 0 ) && ( intDiffH == 0 ) ) { if ( $.browser.msie ) { ___pause(250); } else { ___pause(100); } } $('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) }); $('#lightbox-container-image-data-box').css({ width: intImageWidth }); }; /** * Show the prepared image * */ function _show_image() { $('#lightbox-loading').hide(); $('#lightbox-image').fadeIn(function() { _show_image_data(); _set_navigation(); }); _preload_neighbor_images(); }; /** * Show the image information * */ function _show_image_data() { $('#lightbox-container-image-data-box').slideDown('fast'); $('#lightbox-image-details-caption').hide(); if ( settings.imageArray[settings.activeImage][1] ) { $('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show(); } // If we have a image set, display 'Image X of X' if ( settings.imageArray.length > 1 ) { $('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show(); } } /** * Display the button navigations * */ function _set_navigation() { $('#lightbox-nav').show(); // Instead to define this configuration in CSS file, we define here. And it�s need to IE. Just. $('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' }); // Show the prev button, if not the first image in set if ( settings.activeImage != 0 ) { // Show the images button for Next buttons $('#lightbox-nav-btnPrev').unbind().hover(function() { $(this).css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' }); },function() { $(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' }); }).show().bind('click',function() { settings.activeImage = settings.activeImage - 1; _set_image_to_view(); return false; }); } // Show the next button, if not the last image in set if ( settings.activeImage != ( settings.imageArray.length -1 ) ) { // Show the images button for Next buttons $('#lightbox-nav-btnNext').unbind().hover(function() { $(this).css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' }); },function() { $(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' }); }).show().bind('click',function() { settings.activeImage = settings.activeImage + 1; _set_image_to_view(); return false; }); } // Enable keyboard navigation _enable_keyboard_navigation(); } /** * Enable a support to keyboard navigation * */ function _enable_keyboard_navigation() { $(document).keydown(function(objEvent) { _keyboard_action(objEvent); }); } /** * Disable the support to keyboard navigation * */ function _disable_keyboard_navigation() { $(document).unbind(); } /** * Perform the keyboard actions * */ function _keyboard_action(objEvent) { // To ie if ( objEvent == null ) { keycode = event.keyCode; escapeKey = 27; // To Mozilla } else { keycode = objEvent.keyCode; escapeKey = objEvent.DOM_VK_ESCAPE; } // Get the key in lower case form key = String.fromCharCode(keycode).toLowerCase(); // Verify the keys to close the ligthBox if ( ( key == settings.keyToClose ) || ( key == 'x' ) || ( keycode == escapeKey ) ) { _finish(); } // Verify the key to show the previous image if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) { // If we�re not showing the first image, call the previous if ( settings.activeImage != 0 ) { settings.activeImage = settings.activeImage - 1; _set_image_to_view(); _disable_keyboard_navigation(); } } // Verify the key to show the next image if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) { // If we�re not showing the last image, call the next if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) { settings.activeImage = settings.activeImage + 1; _set_image_to_view(); _disable_keyboard_navigation(); } } } /** * Preload prev and next images being showed * */ function _preload_neighbor_images() { if ( (settings.imageArray.length -1) > settings.activeImage ) { objNext = new Image(); objNext.src = settings.imageArray[settings.activeImage + 1][0]; } if ( settings.activeImage > 0 ) { objPrev = new Image(); objPrev.src = settings.imageArray[settings.activeImage -1][0]; } } /** * Remove jQuery lightBox plugin HTML markup * */ function _finish() { $('#jquery-lightbox').remove(); $('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); }); // Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay. $('embed, object, select').css({ 'visibility' : 'visible' }); } /** / THIRD FUNCTION * getPageSize() by quirksmode.com * * @return Array Return an array with page width, height and window width, height */ function ___getPageSize() { var xScroll, yScroll; if (window.innerHeight && window.scrollMaxY) { xScroll = window.innerWidth + window.scrollMaxX; yScroll = window.innerHeight + window.scrollMaxY; } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac xScroll = document.body.scrollWidth; yScroll = document.body.scrollHeight; } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari xScroll = document.body.offsetWidth; yScroll = document.body.offsetHeight; } var windowWidth, windowHeight; if (self.innerHeight) { // all except Explorer if(document.documentElement.clientWidth){ windowWidth = document.documentElement.clientWidth; } else { windowWidth = self.innerWidth; } windowHeight = self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode windowWidth = document.documentElement.clientWidth; windowHeight = document.documentElement.clientHeight; } else if (document.body) { // other Explorers windowWidth = document.body.clientWidth; windowHeight = document.body.clientHeight; } // for small pages with total height less then height of the viewport if(yScroll < windowHeight){ pageHeight = windowHeight; } else { pageHeight = yScroll; } // for small pages with total width less then width of the viewport if(xScroll < windowWidth){ pageWidth = xScroll; } else { pageWidth = windowWidth; } arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) return arrayPageSize; }; /** / THIRD FUNCTION * getPageScroll() by quirksmode.com * * @return Array Return an array with x,y page scroll values. */ function ___getPageScroll() { var xScroll, yScroll; if (self.pageYOffset) { yScroll = self.pageYOffset; xScroll = self.pageXOffset; } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict yScroll = document.documentElement.scrollTop; xScroll = document.documentElement.scrollLeft; } else if (document.body) {// all other Explorers yScroll = document.body.scrollTop; xScroll = document.body.scrollLeft; } arrayPageScroll = new Array(xScroll,yScroll) return arrayPageScroll; }; /** * Stop the code execution from a escified time in milisecond * */ function ___pause(ms) { var date = new Date(); curDate = null; do { var curDate = new Date(); } while ( curDate - date < ms); }; // Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once return this.unbind('click').click(_initialize); }; })(jQuery); // Call and execute the function immediately passing the jQuery object /* * jQuery Tooltip plugin 1.2 * * http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/ * http://docs.jquery.com/Plugins/Tooltip * * Copyright (c) 2006 - 2008 Jörn Zaefferer * * $Id: jquery.tooltip.js 4569 2008-01-31 19:36:35Z joern.zaefferer $ * * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html */ ;(function($) { // the tooltip element var helper = {}, // the current tooltipped element current, // the title of the current element, used for restoring title, // timeout id for delayed tooltips tID, // IE 5.5 or 6 IE = $.browser.msie && /MSIE\s(5\.5|6\.)/.test(navigator.userAgent), // flag for mouse tracking track = false; $.tooltip = { blocked: false, defaults: { delay: 200, showURL: true, extraClass: "", top: 15, left: 15, id: "tooltip" }, block: function() { $.tooltip.blocked = !$.tooltip.blocked; } }; $.fn.extend({ tooltip: function(settings) { settings = $.extend({}, $.tooltip.defaults, settings); createHelper(settings); return this.each(function() { $.data(this, "tooltip-settings", settings); // copy tooltip into its own expando and remove the title this.tooltipText = this.title; $(this).removeAttr("title"); // also remove alt attribute to prevent default tooltip in IE this.alt = ""; }) .hover(save, hide) .click(hide); }, fixPNG: IE ? function() { return this.each(function () { var image = $(this).css('backgroundImage'); if (image.match(/^url\(["']?(.*\.png)["']?\)$/i)) { image = RegExp.$1; $(this).css({ 'backgroundImage': 'none', 'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='" + image + "')" }).each(function () { var position = $(this).css('position'); if (position != 'absolute' && position != 'relative') $(this).css('position', 'relative'); }); } }); } : function() { return this; }, unfixPNG: IE ? function() { return this.each(function () { $(this).css({'filter': '', backgroundImage: ''}); }); } : function() { return this; }, hideWhenEmpty: function() { return this.each(function() { $(this)[ $(this).html() ? "show" : "hide" ](); }); }, url: function() { return this.attr('href') || this.attr('src'); } }); function createHelper(settings) { // there can be only one tooltip helper if( helper.parent ) return; // create the helper, h3 for title, div for url helper.parent = $('

') // add to document .appendTo(document.body) // hide it at first .hide(); // apply bgiframe if available if ( $.fn.bgiframe ) helper.parent.bgiframe(); // save references to title and url elements helper.title = $('h3', helper.parent); helper.body = $('div.body', helper.parent); helper.url = $('div.url', helper.parent); } function settings(element) { return $.data(element, "tooltip-settings"); } // main event handler to start showing tooltips function handle(event) { // show helper, either with timeout or on instant if( settings(this).delay ) tID = setTimeout(show, settings(this).delay); else show(); // if selected, update the helper position when the mouse moves track = !!settings(this).track; $(document.body).bind('mousemove', update); // update at least once update(event); } // save elements title before the tooltip is displayed function save() { // if this is the current source, or it has no title (occurs with click event), stop if ( $.tooltip.blocked || this == current || (!this.tooltipText && !settings(this).bodyHandler) ) return; // save current current = this; title = this.tooltipText; if ( settings(this).bodyHandler ) { helper.title.hide(); var bodyContent = settings(this).bodyHandler.call(this); if (bodyContent.nodeType || bodyContent.jquery) { helper.body.empty().append(bodyContent) } else { helper.body.html( bodyContent ); } helper.body.show(); } else if ( settings(this).showBody ) { var parts = title.split(settings(this).showBody); helper.title.html(parts.shift()).show(); helper.body.empty(); for(var i = 0, part; part = parts[i]; i++) { if(i > 0) helper.body.append("
"); helper.body.append(part); } helper.body.hideWhenEmpty(); } else { helper.title.html(title).show(); helper.body.hide(); } // if element has href or src, add and show it, otherwise hide it if( settings(this).showURL && $(this).url() ) helper.url.html( $(this).url().replace('http://', '') ).show(); else helper.url.hide(); // add an optional class for this tip helper.parent.addClass(settings(this).extraClass); // fix PNG background for IE if (settings(this).fixPNG ) helper.parent.fixPNG(); handle.apply(this, arguments); } // delete timeout and show helper function show() { tID = null; helper.parent.show(); update(); } /** * callback for mousemove * updates the helper position * removes itself when no current element */ function update(event) { if($.tooltip.blocked) return; // stop updating when tracking is disabled and the tooltip is visible if ( !track && helper.parent.is(":visible")) { $(document.body).unbind('mousemove', update) } // if no current element is available, remove this listener if( current == null ) { $(document.body).unbind('mousemove', update); return; } // remove position helper classes helper.parent.removeClass("viewport-right").removeClass("viewport-bottom"); var left = helper.parent[0].offsetLeft; var top = helper.parent[0].offsetTop; if(event) { // position the helper 15 pixel to bottom right, starting from mouse position left = event.pageX + settings(current).left; top = event.pageY + settings(current).top; helper.parent.css({ left: left + 'px', top: top + 'px' }); } var v = viewport(), h = helper.parent[0]; // check horizontal position if(v.x + v.cx < h.offsetLeft + h.offsetWidth) { left -= h.offsetWidth + 20 + settings(current).left; helper.parent.css({left: left + 'px'}).addClass("viewport-right"); } // check vertical position if(v.y + v.cy < h.offsetTop + h.offsetHeight) { top -= h.offsetHeight + 20 + settings(current).top; helper.parent.css({top: top + 'px'}).addClass("viewport-bottom"); } } function viewport() { return { x: $(window).scrollLeft(), y: $(window).scrollTop(), cx: $(window).width(), cy: $(window).height() }; } // hide helper and restore added classes and the title function hide(event) { if($.tooltip.blocked) return; // clear timeout if possible if(tID) clearTimeout(tID); // no more current element current = null; helper.parent.hide().removeClass( settings(this).extraClass ); if( settings(this).fixPNG ) helper.parent.unfixPNG(); } $.fn.Tooltip = $.fn.tooltip; })(jQuery); /* Copyright (c) 2007 Paul Bakaus (paul.bakaus@googlemail.com) and Brandon Aaron (brandon.aaron@gmail.com || http://brandonaaron.net) * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses. * * $LastChangedDate: 2007-06-22 04:38:37 +0200 (Fr, 22 Jun 2007) $ * $Rev: 2141 $ * * Version: 1.0b2 */ (function($){ // store a copy of the core height and width methods var height = $.fn.height, width = $.fn.width; $.fn.extend({ /** * If used on document, returns the document's height (innerHeight) * If used on window, returns the viewport's (window) height * See core docs on height() to see what happens when used on an element. * * @example $("#testdiv").height() * @result 200 * * @example $(document).height() * @result 800 * * @example $(window).height() * @result 400 * * @name height * @type Object * @cat Plugins/Dimensions */ height: function() { if ( this[0] == window ) return self.innerHeight || $.boxModel && document.documentElement.clientHeight || document.body.clientHeight; if ( this[0] == document ) return Math.max( document.body.scrollHeight, document.body.offsetHeight ); return height.apply(this, arguments); }, /** * If used on document, returns the document's width (innerWidth) * If used on window, returns the viewport's (window) width * See core docs on height() to see what happens when used on an element. * * @example $("#testdiv").width() * @result 200 * * @example $(document).width() * @result 800 * * @example $(window).width() * @result 400 * * @name width * @type Object * @cat Plugins/Dimensions */ width: function() { if ( this[0] == window ) return self.innerWidth || $.boxModel && document.documentElement.clientWidth || document.body.clientWidth; if ( this[0] == document ) return Math.max( document.body.scrollWidth, document.body.offsetWidth ); return width.apply(this, arguments); }, /** * Returns the inner height value (without border) for the first matched element. * If used on document, returns the document's height (innerHeight) * If used on window, returns the viewport's (window) height * * @example $("#testdiv").innerHeight() * @result 800 * * @name innerHeight * @type Number * @cat Plugins/Dimensions */ innerHeight: function() { return this[0] == window || this[0] == document ? this.height() : this.is(':visible') ? this[0].offsetHeight - num(this, 'borderTopWidth') - num(this, 'borderBottomWidth') : this.height() + num(this, 'paddingTop') + num(this, 'paddingBottom'); }, /** * Returns the inner width value (without border) for the first matched element. * If used on document, returns the document's Width (innerWidth) * If used on window, returns the viewport's (window) width * * @example $("#testdiv").innerWidth() * @result 1000 * * @name innerWidth * @type Number * @cat Plugins/Dimensions */ innerWidth: function() { return this[0] == window || this[0] == document ? this.width() : this.is(':visible') ? this[0].offsetWidth - num(this, 'borderLeftWidth') - num(this, 'borderRightWidth') : this.width() + num(this, 'paddingLeft') + num(this, 'paddingRight'); }, /** * Returns the outer height value (including border) for the first matched element. * Cannot be used on document or window. * * @example $("#testdiv").outerHeight() * @result 1000 * * @name outerHeight * @type Number * @cat Plugins/Dimensions */ outerHeight: function() { return this[0] == window || this[0] == document ? this.height() : this.is(':visible') ? this[0].offsetHeight : this.height() + num(this,'borderTopWidth') + num(this, 'borderBottomWidth') + num(this, 'paddingTop') + num(this, 'paddingBottom'); }, /** * Returns the outer width value (including border) for the first matched element. * Cannot be used on document or window. * * @example $("#testdiv").outerHeight() * @result 1000 * * @name outerHeight * @type Number * @cat Plugins/Dimensions */ outerWidth: function() { return this[0] == window || this[0] == document ? this.width() : this.is(':visible') ? this[0].offsetWidth : this.width() + num(this, 'borderLeftWidth') + num(this, 'borderRightWidth') + num(this, 'paddingLeft') + num(this, 'paddingRight'); }, /** * Returns how many pixels the user has scrolled to the right (scrollLeft). * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollLeft() * @result 100 * * @name scrollLeft * @type Number * @cat Plugins/Dimensions */ /** * Sets the scrollLeft property and continues the chain. * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollLeft(10).scrollLeft() * @result 10 * * @name scrollLeft * @param Number value A positive number representing the desired scrollLeft. * @type jQuery * @cat Plugins/Dimensions */ scrollLeft: function(val) { if ( val != undefined ) // set the scroll left return this.each(function() { if (this == window || this == document) window.scrollTo( val, $(window).scrollTop() ); else this.scrollLeft = val; }); // return the scroll left offest in pixels if ( this[0] == window || this[0] == document ) return self.pageXOffset || $.boxModel && document.documentElement.scrollLeft || document.body.scrollLeft; return this[0].scrollLeft; }, /** * Returns how many pixels the user has scrolled to the bottom (scrollTop). * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollTop() * @result 100 * * @name scrollTop * @type Number * @cat Plugins/Dimensions */ /** * Sets the scrollTop property and continues the chain. * Works on containers with overflow: auto and window/document. * * @example $("#testdiv").scrollTop(10).scrollTop() * @result 10 * * @name scrollTop * @param Number value A positive number representing the desired scrollTop. * @type jQuery * @cat Plugins/Dimensions */ scrollTop: function(val) { if ( val != undefined ) // set the scroll top return this.each(function() { if (this == window || this == document) window.scrollTo( $(window).scrollLeft(), val ); else this.scrollTop = val; }); // return the scroll top offset in pixels if ( this[0] == window || this[0] == document ) return self.pageYOffset || $.boxModel && document.documentElement.scrollTop || document.body.scrollTop; return this[0].scrollTop; }, /** * Returns the top and left positioned offset in pixels. * The positioned offset is the offset between a positioned * parent and the element itself. * * @example $("#testdiv").position() * @result { top: 100, left: 100 } * * @name position * @param Map options Optional settings to configure the way the offset is calculated. * @option Boolean margin Should the margin of the element be included in the calculations? False by default. * @option Boolean border Should the border of the element be included in the calculations? False by default. * @option Boolean padding Should the padding of the element be included in the calculations? False by default. * @param Object returnObject An object to store the return value in, so as not to break the chain. If passed in the * chain will not be broken and the result will be assigned to this object. * @type Object * @cat Plugins/Dimensions */ position: function(options, returnObject) { var elem = this[0], parent = elem.parentNode, op = elem.offsetParent, options = $.extend({ margin: false, border: false, padding: false, scroll: false }, options || {}), x = elem.offsetLeft, y = elem.offsetTop, sl = elem.scrollLeft, st = elem.scrollTop; // Mozilla and IE do not add the border if ($.browser.mozilla || $.browser.msie) { // add borders to offset x += num(elem, 'borderLeftWidth'); y += num(elem, 'borderTopWidth'); } if ($.browser.mozilla) { do { // Mozilla does not add the border for a parent that has overflow set to anything but visible if ($.browser.mozilla && parent != elem && $.css(parent, 'overflow') != 'visible') { x += num(parent, 'borderLeftWidth'); y += num(parent, 'borderTopWidth'); } if (parent == op) break; // break if we are already at the offestParent } while ((parent = parent.parentNode) && (parent.tagName.toLowerCase() != 'body' || parent.tagName.toLowerCase() != 'html')); } var returnValue = handleOffsetReturn(elem, options, x, y, sl, st); if (returnObject) { $.extend(returnObject, returnValue); return this; } else { return returnValue; } }, /** * Returns the location of the element in pixels from the top left corner of the viewport. * * For accurate readings make sure to use pixel values for margins, borders and padding. * * Known issues: * - Issue: A div positioned relative or static without any content before it and its parent will report an offsetTop of 0 in Safari * Workaround: Place content before the relative div ... and set height and width to 0 and overflow to hidden * * @example $("#testdiv").offset() * @result { top: 100, left: 100, scrollTop: 10, scrollLeft: 10 } * * @example $("#testdiv").offset({ scroll: false }) * @result { top: 90, left: 90 } * * @example var offset = {} * $("#testdiv").offset({ scroll: false }, offset) * @result offset = { top: 90, left: 90 } * * @name offset * @param Map options Optional settings to configure the way the offset is calculated. * @option Boolean margin Should the margin of the element be included in the calculations? True by default. * @option Boolean border Should the border of the element be included in the calculations? False by default. * @option Boolean padding Should the padding of the element be included in the calculations? False by default. * @option Boolean scroll Should the scroll offsets of the parent elements be included in the calculations? True by default. * When true it adds the totla scroll offets of all parents to the total offset and also adds two properties * to the returned object, scrollTop and scrollLeft. * @options Boolean lite Will use offsetLite instead of offset when set to true. False by default. * @param Object returnObject An object to store the return value in, so as not to break the chain. If passed in the * chain will not be broken and the result will be assigned to this object. * @type Object * @cat Plugins/Dimensions */ offset: function(options, returnObject) { var x = 0, y = 0, sl = 0, st = 0, elem = this[0], parent = this[0], op, parPos, elemPos = $.css(elem, 'position'), mo = $.browser.mozilla, ie = $.browser.msie, sf = $.browser.safari, oa = $.browser.opera, absparent = false, relparent = false, options = $.extend({ margin: true, border: false, padding: false, scroll: true, lite: false }, options || {}); // Use offsetLite if lite option is true if (options.lite) return this.offsetLite(options, returnObject); if (elem.tagName.toLowerCase() == 'body') { // Safari is the only one to get offsetLeft and offsetTop properties of the body "correct" // Except they all mess up when the body is positioned absolute or relative x = elem.offsetLeft; y = elem.offsetTop; // Mozilla ignores margin and subtracts border from body element if (mo) { x += num(elem, 'marginLeft') + (num(elem, 'borderLeftWidth')*2); y += num(elem, 'marginTop') + (num(elem, 'borderTopWidth') *2); } else // Opera ignores margin if (oa) { x += num(elem, 'marginLeft'); y += num(elem, 'marginTop'); } else // IE does not add the border in Standards Mode if (ie && jQuery.boxModel) { x += num(elem, 'borderLeftWidth'); y += num(elem, 'borderTopWidth'); } } else { do { parPos = $.css(parent, 'position'); x += parent.offsetLeft; y += parent.offsetTop; // Mozilla and IE do not add the border if (mo || ie) { // add borders to offset x += num(parent, 'borderLeftWidth'); y += num(parent, 'borderTopWidth'); // Mozilla does not include the border on body if an element isn't positioned absolute and is without an absolute parent if (mo && parPos == 'absolute') absparent = true; // IE does not include the border on the body if an element is position static and without an absolute or relative parent if (ie && parPos == 'relative') relparent = true; } op = parent.offsetParent; if (options.scroll || mo) { do { if (options.scroll) { // get scroll offsets sl += parent.scrollLeft; st += parent.scrollTop; } // Mozilla does not add the border for a parent that has overflow set to anything but visible if (mo && parent != elem && $.css(parent, 'overflow') != 'visible') { x += num(parent, 'borderLeftWidth'); y += num(parent, 'borderTopWidth'); } parent = parent.parentNode; } while (parent != op); } parent = op; if (parent.tagName.toLowerCase() == 'body' || parent.tagName.toLowerCase() == 'html') { // Safari and IE Standards Mode doesn't add the body margin for elments positioned with static or relative if ((sf || (ie && $.boxModel)) && elemPos != 'absolute' && elemPos != 'fixed') { x += num(parent, 'marginLeft'); y += num(parent, 'marginTop'); } // Mozilla does not include the border on body if an element isn't positioned absolute and is without an absolute parent // IE does not include the border on the body if an element is positioned static and without an absolute or relative parent if ( (mo && !absparent && elemPos != 'fixed') || (ie && elemPos == 'static' && !relparent) ) { x += num(parent, 'borderLeftWidth'); y += num(parent, 'borderTopWidth'); } break; // Exit the loop } } while (parent); } var returnValue = handleOffsetReturn(elem, options, x, y, sl, st); if (returnObject) { $.extend(returnObject, returnValue); return this; } else { return returnValue; } }, /** * Returns the location of the element in pixels from the top left corner of the viewport. * This method is much faster than offset but not as accurate. This method can be invoked * by setting the lite option to true in the offset method. * * @name offsetLite * @param Map options Optional settings to configure the way the offset is calculated. * @option Boolean margin Should the margin of the element be included in the calculations? True by default. * @option Boolean border Should the border of the element be included in the calculations? False by default. * @option Boolean padding Should the padding of the element be included in the calculations? False by default. * @option Boolean scroll Should the scroll offsets of the parent elements be included in the calculations? True by default. * When true it adds the totla scroll offets of all parents to the total offset and also adds two properties * to the returned object, scrollTop and scrollLeft. * @param Object returnObject An object to store the return value in, so as not to break the chain. If passed in the * chain will not be broken and the result will be assigned to this object. * @type Object * @cat Plugins/Dimensions */ offsetLite: function(options, returnObject) { var x = 0, y = 0, sl = 0, st = 0, parent = this[0], op, options = $.extend({ margin: true, border: false, padding: false, scroll: true }, options || {}); do { x += parent.offsetLeft; y += parent.offsetTop; op = parent.offsetParent; if (options.scroll) { // get scroll offsets do { sl += parent.scrollLeft; st += parent.scrollTop; parent = parent.parentNode; } while(parent != op); } parent = op; } while (parent && parent.tagName.toLowerCase() != 'body' && parent.tagName.toLowerCase() != 'html'); var returnValue = handleOffsetReturn(this[0], options, x, y, sl, st); if (returnObject) { $.extend(returnObject, returnValue); return this; } else { return returnValue; } } }); /** * Handles converting a CSS Style into an Integer. * @private */ var num = function(el, prop) { return parseInt($.css(el.jquery?el[0]:el,prop))||0; }; /** * Handles the return value of the offset and offsetLite methods. * @private */ var handleOffsetReturn = function(elem, options, x, y, sl, st) { if ( !options.margin ) { x -= num(elem, 'marginLeft'); y -= num(elem, 'marginTop'); } // Safari and Opera do not add the border for the element if ( options.border && ($.browser.safari || $.browser.opera) ) { x += num(elem, 'borderLeftWidth'); y += num(elem, 'borderTopWidth'); } else if ( !options.border && !($.browser.safari || $.browser.opera) ) { x -= num(elem, 'borderLeftWidth'); y -= num(elem, 'borderTopWidth'); } if ( options.padding ) { x += num(elem, 'paddingLeft'); y += num(elem, 'paddingTop'); } // do not include scroll offset on the element if ( options.scroll ) { sl -= elem.scrollLeft; st -= elem.scrollTop; } return options.scroll ? { top: y - st, left: x - sl, scrollTop: st, scrollLeft: sl } : { top: y, left: x }; }; })(jQuery); /** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html * */ /** * Create a cookie with the given name and value and other optional parameters. * * @example $.cookie('the_cookie', 'the_value'); * @desc Set the value of a cookie. * @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true }); * @desc Create a cookie with all available options. * @example $.cookie('the_cookie', 'the_value'); * @desc Create a session cookie. * @example $.cookie('the_cookie', null); * @desc Delete a cookie by passing null as value. Keep in mind that you have to use the same path and domain * used when the cookie was set. * * @param String name The name of the cookie. * @param String value The value of the cookie. * @param Object options An object literal containing key/value pairs to provide optional cookie attributes. * @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object. * If a negative value is specified (e.g. a date in the past), the cookie will be deleted. * If set to null or omitted, the cookie will be a session cookie and will not be retained * when the the browser exits. * @option String path The value of the path atribute of the cookie (default: path of page that created the cookie). * @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie). * @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will * require a secure protocol (like HTTPS). * @type undefined * * @name $.cookie * @cat Plugins/Cookie * @author Klaus Hartl/klaus.hartl@stilbuero.de */ /** * Get the value of a cookie with the given name. * * @example $.cookie('the_cookie'); * @desc Get the value of a cookie. * * @param String name The name of the cookie. * @return The value of the cookie. * @type String * * @name $.cookie * @cat Plugins/Cookie * @author Klaus Hartl/klaus.hartl@stilbuero.de */ jQuery.cookie = function(name, value, options) { if (typeof value != 'undefined') { // name and value given, set cookie options = options || {}; if (value === null) { value = ''; options.expires = -1; } var expires = ''; if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) { var date; if (typeof options.expires == 'number') { date = new Date(); date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000)); } else { date = options.expires; } expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE } // CAUTION: Needed to parenthesize options.path and options.domain // in the following expressions, otherwise they evaluate to undefined // in the packed version for some reason... var path = options.path ? '; path=' + (options.path) : ''; var domain = options.domain ? '; domain=' + (options.domain) : ''; var secure = options.secure ? '; secure' : ''; document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); } else { // only name given, get cookie var cookieValue = null; if (document.cookie && document.cookie != '') { var cookies = document.cookie.split(';'); for (var i = 0; i < cookies.length; i++) { var cookie = jQuery.trim(cookies[i]); // Does this cookie string begin with the name we want? if (cookie.substring(0, name.length + 1) == (name + '=')) { cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); break; } } } return cookieValue; } }; /* * nyroModal - jQuery Plugin * http://nyromodal.nyrodev.com * * Copyright (c) 2008 Cedric Nirousset (nyrodev.com) * Licensed under the MIT license * * $Date: 2008-06-24 (Tue, 24 Jun 2008) $ * $version: 1.2.8 */ jQuery(function($) { // ------------------------------------------------------- // Private Variables // ------------------------------------------------------- var isIE6 = ($.browser.msie && parseInt($.browser.version.substr(0,1)) < 7); var body = $('body'); var currentSettings; // To know if the fix for the Issue 10 should be applied (or has been applied) var fixFF = false; // Used for retrieve the content from an hidden div var contentElt; var contentEltLast; // Contains info about nyroModal state and all div references var modal = { ready: false, dataReady: false, anim: false, loadingShown: false, transition: false, error: false, full: null, bg: null, loading: null, tmp: null, content: null, wrapper: null, contentWrapper: null, scripts: new Array() }; // Indicate of the height or the width was resized, to reinit the currentsettings related to null var resized = { width: false, height: false }; // ------------------------------------------------------- // Public function // ------------------------------------------------------- // jQuery extension function. A paramater object could be used to overwrite the default settings $.fn.nyroModal = function(settings) { if (!this) return false; return this.each(function(){ if (this.nodeName.toLowerCase() == 'form') { $(this).submit(function(e) { if (this.enctype == 'multipart/form-data') { processModal($.extend(settings, { from: this })); return true; } e.preventDefault(); processModal($.extend(settings, { from: this })); return false; }); } else { $(this).click(function(e) { e.preventDefault(); processModal($.extend(settings, { from: this })); return false; }); } }); }; // jQuery extension function to call manually the modal. A paramater object could be used to overwrite the default settings $.fn.nyroModalManual = function(settings) { if (!this.length) processModal(settings); return this.each(function(){ processModal($.extend(settings, { from: this })); }); }; $.nyroModalManual = function(settings) { processModal(settings); }; // Update the current settings // object settings // string deep1 first key where overwrite the settings // string deep2 second key where overwrite the settings $.nyroModalSettings = function(settings, deep1, deep2) { setCurrentSettings(settings, deep1, deep2); if (!deep1 && modal.ready) { if (settings.bgColor) currentSettings.updateBgColor(modal, currentSettings, function(){}); if ((modal.dataReady && !modal.anim && !modal.transition) && (settings.width || settings.height)) { calculateSize(true); if (fixFF) modal.content.css({position: ''}); currentSettings.resize(modal, currentSettings, function() { if (fixFF) modal.content.css({position: 'fixed'}); if ($.isFunction(currentSettings.endResize)) currentSettings.endResize(modal, currentSettings); }); } } }; // Remove the modal function $.nyroModalRemove = function() { removeModal(); }; // Go to the next image for a gallery // return false if nothing was done $.nyroModalNext = function() { if (currentSettings.type == 'gallery') { var gallery = $('[rel="'+currentSettings.from.rel+'"]'); var currentIndex = gallery.index(currentSettings.from); if (currentIndex < gallery.length-1) { return gallery.eq(currentIndex+1).nyroModalManual(currentSettings); } } return false; }; // Go to the previous image for a gallery // return false if nothing was done $.nyroModalPrev = function() { if (currentSettings.type == 'gallery') { var gallery = $('[rel="'+currentSettings.from.rel+'"]'); var currentIndex = gallery.index(currentSettings.from); if (currentIndex > 0) { return gallery.eq(currentIndex-1).nyroModalManual(currentSettings); } } return false; }; // ------------------------------------------------------- // Default Settings // ------------------------------------------------------- $.fn.nyroModal.settings = { debug: false, // Show the debug in the background modal: false, // Esc key or click backgrdound enabling or not type: '', // nyroModal type (form, formData, iframe, image, etc...) from: '', // Dom object where the call come from hash: '', // Eventual hash in the url processHandler: null, // Handler just before the real process selIndicator: 'nyroModalSel', // Value added when a form or Ajax is sent with a filter content formIndicator: 'nyroModal', // Value added when a form is sent content: null, // Raw content if type content is used bgColor: '#000000', // Background color ajax: {}, // Ajax option (url, data, type, success will be overwritten for a form, url and success only for an ajax call) width: null, // default Width If null, will be calculate automatically height: null, // default Height If null, will be calculate automatically minWidth: 600, // Minimum width minHeight: 500, // Minimum height resizeable: true, // Indicate if the content is resizable. Will be set to false for swf autoSizable: true, // Indicate if the content is auto sizable. If not, the min size will be used padding: 20, // padding for the max modal size extImg: 'jpg|jpeg|png|tiff|gif|bmp', // Images extensions seperate by | (regexp using) defaultImgAlt: 'Image', // Default alt attribute for the images setWidthImgTitle: true, // Set the width to the image title css: { // Default CSS option for the nyroModal Div. Some will be overwritten or updated when using IE6 bg: { zIndex: 100, position: 'fixed', top: 0, left: 0, height: '100%', width: '100%' }, wrapper: { zIndex: 101, position: 'fixed', top: '50%', left: '50%' }, wrapper2: { }, content: { overflow: 'auto' }, loading: { zIndex: 102, position: 'fixed', top: '50%', left: '50%', marginTop: '-50px', marginLeft: '-50px' } }, wrap: { // Wrapper div used to style the modal regarding the content type div: '
', ajax: '
', form: '
', formData: '
', image: '
', gallery: '
PrevNext
', // Use .nyroModalPrev and .nyroModalNext to set the navigation link swf: '
', iframe: '
', manual: '
' }, closeButton: 'Close', // Adding automaticly as the first child of #nyroModalWrapper openSelector: '.nyroModal', // selector for open a new modal. will be used to parse automaticly at page loading closeSelector: '.nyroModalClose', // selector to close the modal contentLoading: 'Cancel', // Loading div content errorClass: 'error', // CSS Error class added to the loading div in case of error contentError: 'The requested content cannot be loaded.
Please try again later.
Close', // Content placed in the loading div in case of error handleError: null, // Callback in case of error showBackground: showBackground, // Show background animation function hideBackground: hideBackground, // Hide background animation function endFillContent: null, // Will be called after filling and wraping the content, before parsing closeSelector and openSelector and showing the content showContent: showContent, // Show content animation function endShowContent: null, // Will be called once the content is shown hideContent: hideContent, // Hide content animation function showTransition: showTransition, // Show the transition animation (a modal is already shown and a new one is requested) hideTransition: hideTransition, // Hide the transition animation to show the content showLoading: showLoading, // show loading animation function hideLoading: hideLoading, // hide loading animation function resize: resize, // Resize animation function endResize: null, // Will be called one the content is resized updateBgColor: updateBgColor, // Change background color animation function endRemove: null // Will be called once the modal is totally gone }; // ------------------------------------------------------- // Private function // ------------------------------------------------------- // Main function function processModal(settings) { if (modal.loadingShown || modal.transition || modal.anim) return; debug('processModal'); setDefaultCurrentSettings(settings); modal.error = false; modal.dataReady = false; modal.scripts = new Array(); currentSettings.type = fileType(); if ($.isFunction(currentSettings.processHandler)) currentSettings.processHandler(currentSettings); from = currentSettings.from; if (currentSettings.type == 'swf') { // Swf is transforming as a raw content currentSettings.resizable = false; currentSettings.content = ''; } if (from) { if (currentSettings.type == 'form') { currentSettings.selector = getHash(from.action); var url = from.action.substring(0, from.action.length-currentSettings.selector.length); var data = $(from).serializeArray(); data.push({name: currentSettings.formIndicator, value: 1}); if (currentSettings.selector) data.push({name: currentSettings.selIndicator, value: currentSettings.selector.substring(1)}); $.ajax($.extend({}, currentSettings.ajax, { url: url, data: data, type: from.method, success: ajaxLoaded, error: loadingError })); debug('Form Ajax Load: '+from.action); showModal(); } else if (currentSettings.type == 'formData') { // Form with data. We're using a hidden iframe initModal(); from.target = 'nyroModalIframe'; currentSettings.selector = getHash(from.action); var url = from.action.substring(0, from.action.length - currentSettings.selector.length); from.action = url; $(from).prepend(''); if (currentSettings.selector) $(from).prepend(''); modal.tmp.html(''); $('iframe', modal.tmp) .css({ width: currentSettings.width, height: currentSettings.height }) .error(loadingError) .load(formDataLoaded); debug('Form Data Load: '+from.action); showModal(); showContentOrLoading(); } else if (currentSettings.type == 'image' || currentSettings.type == 'gallery') { var title = from.title || currentSettings.defaultImgAlt; initModal(); modal.tmp.html(''+title+''); debug('Image Load: '+from.href); $('img', modal.tmp) .error(loadingError) .load(function() { debug('Image Loaded: '+this.src); $(this).unbind('load'); var w = modal.tmp.width(); var h = modal.tmp.height(); setCurrentSettings({ width: w, height: h, imgWidth: w, imgHeight: h }); modal.dataReady = true; if (modal.loadingShown || modal.transition) showContentOrLoading(); }) .attr('src', from.href); showModal(); } else if (currentSettings.type == 'iframe') { initModal(); modal.tmp.html(''); debug('Iframe Load: '+from.href); $('iframe', modal.tmp).eq(0) .css({ width: '100%', height: '100%' }); currentSettings.autoSizable = false; modal.dataReady = true; showModal(); } else if (currentSettings.type) { // Could be every other kind of type or a dom selector debug('Content: '+currentSettings.type); initModal(); modal.tmp.html(currentSettings.content); var w = modal.tmp.width(); var h = modal.tmp.height(); var div = $(currentSettings.type); if (div.length) { setCurrentSettings({type: 'div'}); w = div.width(); h = div.height(); if (contentElt) contentEltLast = contentElt; contentElt = div; modal.tmp.append(div.contents()); } setCurrentSettings({ width: w, height: h }); if (modal.tmp.html()) modal.dataReady = true; else loadingError(); showModal(); showContentOrLoading(); } else { debug('Ajax Load: '+currentSettings.url); setCurrentSettings({type: 'ajax'}); var data = {}; if (currentSettings.selector) { data = currentSettings.ajax.data || {}; data[currentSettings.selIndicator] = currentSettings.selector.substring(1); } $.ajax($.extend({}, currentSettings.ajax, { url: currentSettings.url.substring(0, currentSettings.url.length-currentSettings.selector.length), success: ajaxLoaded, error: loadingError, data: data })); showModal(); } } else if (currentSettings.content) { // Raw content not from a DOM element debug('Content: '+currentSettings.type); setCurrentSettings({type: 'manual'}); initModal(); modal.tmp.html($('
').html(currentSettings.content).contents()); if (modal.tmp.html()) modal.dataReady = true; else loadingError(); showModal(); } else { // What should we show here? nothing happen } } // Update the current settings // object settings // string deep1 first key where overwrite the settings // string deep2 second key where overwrite the settings function setDefaultCurrentSettings(settings) { debug('setDefaultCurrentSettings'); currentSettings = $.extend({}, $.fn.nyroModal.settings, settings); currentSettings.selector = '', currentSettings.borderW = 0, currentSettings.borderH = 0, currentSettings.resizable = true; setMargin(); } function setCurrentSettings(settings, deep1, deep2) { if (deep1 && deep2) { $.extend(currentSettings[deep1][deep2], settings); } else if (deep1) { $.extend(currentSettings[deep1], settings); } else { $.extend(currentSettings, settings); } } // Set the margin for postionning the element. Useful for IE6 function setMarginScroll() { if (isIE6) { if (document.documentElement) { currentSettings.marginScrollLeft = document.documentElement.scrollLeft; currentSettings.marginScrollTop = document.documentElement.scrollTop; } else { currentSettings.marginScrollLeft = document.body.scrollLeft; currentSettings.marginScrollTop = document.body.scrollTop; } } else { currentSettings.marginScrollLeft = 0; currentSettings.marginScrollTop = 0; } } // Set the margin for the content function setMargin() { setMarginScroll(); currentSettings.marginLeft = -(currentSettings.width+currentSettings.borderW)/2 + currentSettings.marginScrollLeft; currentSettings.marginTop = -(currentSettings.height+currentSettings.borderH)/2 + currentSettings.marginScrollTop; } // Init the nyroModal div by settings the CSS elements and hide needed elements function initModal() { debug('initModal'); if (!modal.full) { if (currentSettings.debug) setCurrentSettings({color: 'white'}, 'css', 'bg'); var iframeHideIE = ''; if (isIE6) { body.css({ height: body.height()+'px', width: body.width()+'px', position: 'static', overflow: 'hidden'}); $('html').css({overflow: 'hidden'}); setCurrentSettings({ position: 'absolute', height: '110%', width: '110%', top: currentSettings.marginScrollTop+'px', left: currentSettings.marginScrollLeft+'px' }, 'css', 'bg'); setCurrentSettings({position: 'absolute'}, 'css', 'loading'); setCurrentSettings({position: 'absolute'}, 'css', 'wrapper'); iframeHideIE = $('') .css($.extend({}, currentSettings.css.bg, { opacity: 0, zIndex: 50, border: 'none' })); } body.append($('
').hide()); modal.full = $('#nyroModalFull').show(); modal.bg = $('#nyroModalBg') .css($.extend({ backgroundColor: currentSettings.bgColor }, currentSettings.css.bg)) .before(iframeHideIE); if (!currentSettings.modal) modal.bg.click(removeModal); modal.loading = $('#nyroModalLoading') .css(currentSettings.css.loading) .hide(); modal.contentWrapper = $('#nyroModalWrapper') .css(currentSettings.css.wrapper) .hide(); modal.content = $('#nyroModalContent'); modal.tmp = $('#nyrModalTmp').hide(); // To stop the mousewheel if the the plugin is available if ($.isFunction($.fn.mousewheel)) { modal.content.mousewheel(function(e, d) { var elt = modal.content.get(0); if ((d > 0 && elt.scrollTop == 0) || (d < 0 && elt.scrollHeight - elt.scrollTop == elt.clientHeight)) { e.preventDefault(); e.stopPropagation(); } }); } $(document).keydown(keyHandler); modal.content.css({width: 'auto', height: 'auto'}); modal.contentWrapper.css({width: 'auto', height: 'auto'}); } } // Show the modal (ie: the background and then the loading if needed or the content directly) function showModal() { debug('showModal'); if (!modal.ready) { initModal(); modal.anim = true; currentSettings.showBackground(modal, currentSettings, endBackground); } else { modal.anim = true; modal.transition = true; currentSettings.showTransition(modal, currentSettings, function(){endHideContent();modal.anim=false;showContentOrLoading();}); } } // Used for the escape key or the arrow in the gallery type function keyHandler(e) { if (e.keyCode == 27) { if (!currentSettings.modal) removeModal(); } else if (currentSettings.type == 'gallery' && modal.ready && modal.dataReady && !modal.anim && !modal.transition) { if (e.keyCode == 39 || e.keyCode == 40) { e.preventDefault(); $('.nyroModalNext', modal.content).eq(0).trigger('click'); return false; } else if (e.keyCode == 37 || e.keyCode == 38) { e.preventDefault(); $('.nyroModalPrev', modal.content).eq(0).trigger('click'); return false; } } } // Determine the filetype regarding the link DOM element function fileType() { var from = currentSettings.from; var url = currentSettings.url; if (from && from.nodeName) { if (from.nodeName.toLowerCase() == 'form') { if (from.enctype == 'multipart/form-data') return 'formData'; return 'form'; } if (from.rev == 'modal') currentSettings.modal = true; var image = new RegExp('[^\.]\.('+currentSettings.extImg+')\s*$', 'i'); if (image.test(from.href)) { if (from.rel) return 'gallery'; else return 'image'; } var swf = new RegExp('[^\.]\.(swf)\s*$', 'i'); if (swf.test(from.href)) return 'swf'; if (from.target.toLowerCase() == '_blank' || (from.hostname.replace(/:\d*$/,'') != window.location.hostname.replace(/:\d*$/,''))) return 'iframe'; url = from.href; } if (url) { if (from) currentSettings.url = url; else currentSettings.from = true; var hash = getHash(url); var hashLoc = getHash(window.location.href); var curLoc = window.location.href.substring(0, window.location.href.length - hashLoc.length); var req = url.substring(0, url.length - hash.length); if (req == curLoc) return hash; else currentSettings.selector = hash; } } // Called when the content cannot be loaded or tiemout reached function loadingError() { debug('loadingError'); modal.error = true; if (!modal.ready) return; if ($.isFunction(currentSettings.handleError)) currentSettings.handleError(modal, currentSettings); modal.loading .addClass(currentSettings.errorClass) .html(currentSettings.contentError); $(currentSettings.closeSelector, modal.loading).click(removeModal); } // Put the content from modal.tmp to modal.content function fillContent() { debug('fillContent'); if (!modal.tmp.html()) return; modal.content.html(modal.tmp.contents()); modal.tmp.empty(); wrapContent(); if ($.isFunction(currentSettings.endFillContent)) currentSettings.endFillContent(modal, currentSettings); modal.content.append(modal.scripts); var currentSettingsNew = $.extend({}, currentSettings); if (resized.width) currentSettingsNew.width = null; if (resized.height) currentSettingsNew.height = null; $(currentSettings.closeSelector, modal.contentWrapper).click(removeModal); $(currentSettings.openSelector, modal.contentWrapper).nyroModal(currentSettingsNew); } // Wrap the content and update the modal size if needed function wrapContent() { debug('wrapContent'); var wrap = $(currentSettings.wrap[currentSettings.type]); modal.content.append(wrap.children().remove()); modal.contentWrapper.wrapInner(wrap); if (currentSettings.type == 'gallery') { // Set the action for the next and prev button (or remove them) var gallery = $('[rel="'+currentSettings.from.rel+'"]'); var currentIndex = gallery.index(currentSettings.from); if (currentIndex > 0) { var linkPrev = gallery.eq(currentIndex-1); $('.nyroModalPrev', modal.contentWrapper) .attr('href', linkPrev.attr('href')) .click(function(e) { e.preventDefault(); linkPrev.nyroModalManual(currentSettings); return false; }); } else { $('.nyroModalPrev', modal.contentWrapper).remove(); } if (currentIndex < gallery.length-1) { var linkNext = gallery.eq(currentIndex+1); $('.nyroModalNext', modal.contentWrapper) .attr('href', linkNext.attr('href')) .click(function(e) { e.preventDefault(); linkNext.nyroModalManual(currentSettings); return false; }); } else { $('.nyroModalNext', modal.contentWrapper).remove(); } } calculateSize(); } // Calculate the size for the contentWrapper function calculateSize(resizing) { debug('calculateSize'); if (!modal.wrapper) modal.wrapper = modal.contentWrapper.children(':first'); resized.width = false; resized.height = false; if (currentSettings.autoSizable && (!currentSettings.width || !currentSettings.height)) { modal.contentWrapper.css({opacity: 0}).show(); var tmp = { width: 'auto', height: 'auto' }; if (currentSettings.width) tmp.width = currentSettings.width; if (currentSettings.height) tmp.height = currentSettings.height; modal.content.css(tmp); if (!currentSettings.width) { currentSettings.width = modal.content.width(); resized.width = true; } if (!currentSettings.height) { currentSettings.height = modal.content.height(); resized.height = true; } modal.contentWrapper.hide().css({opacity: 1}); } currentSettings.width = Math.max(currentSettings.width, currentSettings.minWidth); currentSettings.height = Math.max(currentSettings.height, currentSettings.minHeight); var outerWrapper = getOuter(modal.contentWrapper); var outerWrapper2 = getOuter(modal.wrapper); var outerContent = getOuter(modal.content); var tmp = { content: { width: currentSettings.width, height: currentSettings.height }, wrapper2: { width: currentSettings.width + outerContent.w.total, height: currentSettings.height + outerContent.h.total }, wrapper: { width: currentSettings.width + outerContent.w.total + outerWrapper2.w.total, height: currentSettings.height + outerContent.h.total + outerWrapper2.h.total } }; if (currentSettings.resizable) { var maxHeight = $(window).height() - currentSettings.padding*2 - outerWrapper.h.border - (tmp.wrapper.height - currentSettings.height); var maxWidth = $(window).width() - currentSettings.padding*2 - outerWrapper.w.border - (tmp.wrapper.width - currentSettings.width); if (tmp.content.height > maxHeight || tmp.content.width > maxWidth) { // We're gonna resize the modal as it will goes outside the view port if (currentSettings.type == 'image' || currentSettings.type == 'gallery') { // An image is resized proportionnaly var diffW = tmp.content.width - currentSettings.imgWidth; var diffH = tmp.content.height - currentSettings.imgHeight; if (diffH < 0) diffH = 0; if (diffW < 0) diffW = 0; var calcH = maxHeight - diffH; var calcW = maxWidth - diffW; var ratio = Math.min(calcH/currentSettings.imgHeight, calcW/currentSettings.imgWidth); calcH = Math.floor(currentSettings.imgHeight*ratio); calcW = Math.floor(currentSettings.imgWidth*ratio); $('img#nyroModalImg', modal.content).css({ height: calcH+'px', width: calcW+'px' }); tmp.content.height = calcH + diffH; tmp.content.width = calcW + diffW; } else { // For an HTML content, we simply decrease the size tmp.content.height = Math.min(tmp.content.height, maxHeight); tmp.content.width = Math.min(tmp.content.width, maxWidth); } tmp.wrapper2 = { width: tmp.content.width + outerContent.w.total, height: tmp.content.height + outerContent.h.total }; tmp.wrapper = { width: tmp.content.width + outerContent.w.total + outerWrapper2.w.total, height: tmp.content.height + outerContent.h.total + outerWrapper2.h.total }; } } modal.content.css($.extend({}, tmp.content, currentSettings.css.content)); modal.wrapper.css($.extend({}, tmp.wrapper2, currentSettings.css.wrapper2)); if (!resizing) { modal.contentWrapper.css($.extend({}, tmp.wrapper, currentSettings.css.wrapper)); if (currentSettings.type == 'image' || currentSettings.type == 'gallery') { // Adding the title for the image var title = $('img', modal.content).attr('alt'); $('img', modal.content).removeAttr('alt'); if (title != currentSettings.defaultImgAlt) { var divTitle = $('
'+title+'
'); modal.content.append(divTitle); if (currentSettings.setWidthImgTitle) { var outerDivTitle = getOuter(divTitle); divTitle.css({width: (tmp.content.width + outerContent.w.padding - outerDivTitle.w.total)+'px'}); } } } if (!currentSettings.modal) modal.contentWrapper.prepend(currentSettings.closeButton); } tmp.wrapper.borderW = outerWrapper.w.border; tmp.wrapper.borderH = outerWrapper.h.border; setCurrentSettings(tmp.wrapper); setMargin(); } function removeModal(e) { debug('removeModal'); if (e) e.preventDefault(); if (modal.full && modal.ready) { modal.ready = false; modal.anim = true; if (modal.loadingShown || modal.transition) { currentSettings.hideLoading(modal, currentSettings, function() { modal.loading.hide(); modal.loadingShown = false; modal.transition = false; currentSettings.hideBackground(modal, currentSettings, endRemove); }); } else { if (fixFF) modal.content.css({position: ''}); // Fix Issue #10, remove the attribute modal.wrapper.css({overflow: 'hidden'}); // Used to fix a visual issue when hiding modal.content.css({overflow: 'hidden'}); // Used to fix a visual issue when hiding currentSettings.hideContent(modal, currentSettings, function() { endHideContent(); currentSettings.hideBackground(modal, currentSettings, endRemove); }); } } if (e) return false; } function showContentOrLoading() { debug('showContentOrLoading'); if (modal.ready && !modal.anim) { if (modal.dataReady) { if (modal.tmp.html()) { modal.anim = true; if (modal.transition) { fillContent(); currentSettings.hideTransition(modal, currentSettings, function() { modal.loading.hide(); modal.transition = false; modal.loadingShown = false; endShowContent(); }); } else { currentSettings.hideLoading(modal, currentSettings, function() { modal.loading.hide(); modal.loadingShown = false; fillContent(); currentSettings.showContent(modal, $.extend({}, currentSettings), endShowContent); }); } } } else if (!modal.loadingShown && !modal.transition) { modal.anim = true; modal.loadingShown = true; if (modal.error) loadingError(); else modal.loading.html(currentSettings.contentLoading); $(currentSettings.closeSelector, modal.loading).click(removeModal); currentSettings.showLoading(modal, currentSettings, function(){modal.anim=false;showContentOrLoading();}); } } } // ------------------------------------------------------- // Private Data Loaded callback // ------------------------------------------------------- function ajaxLoaded(data) { debug('AjaxLoaded: '+this.url); modal.tmp.html(currentSettings.selector ?filterScripts($('
'+data+'
').find(currentSettings.selector).contents()) :filterScripts(data)); if (modal.tmp.html()) { modal.dataReady = true; showContentOrLoading(); } else loadingError(); } function formDataLoaded() { debug('formDataLoaded'); currentSettings.from.action += currentSettings.selector; currentSettings.from.target = ''; $('input[name='+currentSettings.formIndicator+']', currentSettings.from).remove(); var iframe = modal.tmp.children('iframe'); var iframeContent = iframe.unbind('load').contents().find(currentSettings.selector || 'body').not('script[src]'); iframe.attr('src', 'about:blank'); // Used to stop the loading in FF modal.tmp.html(iframeContent.html()); if (modal.tmp.html()) { modal.dataReady = true; showContentOrLoading(); } else loadingError(); } // ------------------------------------------------------- // Private Animation callback // ------------------------------------------------------- function endHideContent() { debug('endHideContent'); modal.anim = false; if (contentEltLast) { contentEltLast.append(modal.content.contents()); contentEltLast= null; } else if (contentElt) { contentElt.append(modal.content.contents()); contentElt= null; } modal.content.empty(); modal.contentWrapper .empty() .removeAttr('style') .hide() .css(currentSettings.css.wrapper) .append(modal.content); showContentOrLoading(); } function endRemove() { debug('endRemove'); $(document).unbind('keydown', keyHandler); modal.anim = false; modal.full.remove(); modal.full = null; if (isIE6) { body.css({height: '', width: '', position: '', overflow: ''}); $('html').css({overflow: ''}); } if ($.isFunction(currentSettings.endRemove)) currentSettings.endRemove(modal, currentSettings); } function endBackground() { debug('endBackground'); modal.ready = true; modal.anim = false; showContentOrLoading(); } function endShowContent() { debug('endShowContent'); modal.anim = false; modal.contentWrapper.css({opacity: ''}); // for the close button in IE fixFF = $.browser.mozilla && parseFloat($.browser.version) < 1.9 && currentSettings.type != 'gallery' && currentSettings.type != 'image'; if (fixFF) modal.content.css({position: 'fixed'}); // Fix Issue #10 if ($.isFunction(currentSettings.endShowContent)) currentSettings.endShowContent(modal, currentSettings); if (resized.width) setCurrentSettings({width: null}); if (resized.height) setCurrentSettings({height: null}); } // ------------------------------------------------------- // Utilities // ------------------------------------------------------- // Get the selector from an url (as string) function getHash(url) { var hashPos = url.indexOf('#'); if (hashPos > -1) return url.substring(hashPos); return ''; } // Filter an html content to remove the script[src] function filterScripts(data) { // Removing the body, head and html tag if (typeof data == 'string') data = data.replace(/<\/?(html|head|body)([^>]*)>/gi, ''); var tmp = new Array(); $.each($.clean({0:data}, this.ownerDocument), function() { if ($.nodeName(this, "script")) { if (!this.src || $(this).attr('rel') == 'forceLoad') modal.scripts.push(this); } else tmp.push(this); }); return tmp; } // Get the vertical and horizontal margin, padding and border dimension function getOuter(elm) { elm = elm.get(0); var ret = { h: { margin: getCurCSS(elm, 'marginTop') + getCurCSS(elm, 'marginBottom'), border: getCurCSS(elm, 'borderTopWidth') + getCurCSS(elm, 'borderBottomWidth'), padding: getCurCSS(elm, 'paddingTop') + getCurCSS(elm, 'paddingBottom') }, w: { margin: getCurCSS(elm, 'marginLeft') + getCurCSS(elm, 'marginRight'), border: getCurCSS(elm, 'borderLeftWidth') + getCurCSS(elm, 'borderRightWidth'), padding: getCurCSS(elm, 'paddingLeft') + getCurCSS(elm, 'paddingRight') } }; ret.h.outer = ret.h.margin + ret.h.border; ret.w.outer = ret.w.margin + ret.w.border; ret.h.inner = ret.h.padding + ret.h.border; ret.w.inner = ret.w.padding + ret.w.border; ret.h.total = ret.h.outer + ret.h.padding; ret.w.total = ret.w.outer + ret.w.padding; return ret; } function getCurCSS(elm, name) { var ret = parseInt($.curCSS(elm, name, true)); if (isNaN(ret)) ret = 0; return ret; } // Show the message in the background if possible. function debug(msg) { //alert(msg); if (currentSettings && currentSettings.debug && modal.full) modal.bg.prepend(msg+'
'); } // ------------------------------------------------------- // Default animation function // ------------------------------------------------------- function showBackground(elts, settings, callback) { elts.bg.css({opacity:0}).fadeTo(500, 0.75, callback); } function hideBackground(elts, settings, callback) { elts.bg.fadeOut(300, callback); } function showLoading(elts, settings, callback) { var h = elts.loading.height(); var w = elts.loading.width(); elts.loading .css({ height: h+'px', width: w+'px', marginTop: (-h/2 + settings.marginScrollTop)+'px', marginLeft: (-w/2 + settings.marginScrollLeft)+'px', opacity: 0 }) .show() .animate({ opacity: 1 }, {complete: callback, duration: 400}); } function hideLoading(elts, settings, callback) { callback(); } function showContent(elts, settings, callback) { var h = elts.loading.height(); var w = elts.loading.width(); elts.loading .css({ height: h+'px', width: w+'px', marginTop: (-h/2 + settings.marginScrollTop)+'px', marginLeft: (-w/2 + settings.marginScrollLeft)+'px' }) .show() .animate({ width: settings.width+'px', height: settings.height+'px', marginTop: (settings.marginTop)+'px', marginLeft: (settings.marginLeft)+'px' }, {duration: 350, complete: function() { elts.contentWrapper .css({ width: settings.width+'px', height: settings.height+'px', marginTop: (settings.marginTop)+'px', marginLeft: (settings.marginLeft)+'px' }) .show(); elts.loading.fadeOut(200, callback); } }); } function hideContent(elts, settings, callback) { elts.contentWrapper .animate({ height: '50px', width: '50px', marginTop: 25+settings.marginScrollTop+'px', marginLeft: 25+settings.marginScrollLeft+'px' }, {duration: 350, complete: function() { elts.contentWrapper.hide(); callback(); }}); } function showTransition(elts, settings, callback) { // Put the loading with the same dimensions of the current content elts.loading .css({ marginTop: elts.contentWrapper.css('marginTop'), marginLeft: elts.contentWrapper.css('marginLeft'), height: elts.contentWrapper.css('height'), width: elts.contentWrapper.css('width'), opacity: 0 }) .show() .fadeTo(400, 1, function() { elts.contentWrapper.hide(); callback(); }); } function hideTransition(elts, settings, callback) { // Place the content wrapper underneath the the loading with the right dimensions elts.contentWrapper .css({ width: settings.width+'px', marginLeft: (settings.marginLeft)+'px', height: settings.height+'px', marginTop: (settings.marginTop)+'px', opacity: 1 }); elts.loading .animate({ width: settings.width+'px', marginLeft: (settings.marginLeft)+'px', height: settings.height+'px', marginTop: (settings.marginTop)+'px' }, {complete: function() { elts.contentWrapper.show(); elts.loading.fadeOut(400, function() { elts.loading.hide(); callback(); }); }, duration: 350}); } function resize(elts, settings, callback) { elts.contentWrapper .animate({ width: settings.width+'px', marginLeft: (settings.marginLeft)+'px', height: settings.height+'px', marginTop: (settings.marginTop)+'px' }, {complete: callback, duration: 400}); } function updateBgColor(elts, settings, callback) { if (!$.fx.step.backgroundColor) { elts.bg.css({backgroundColor: settings.bgColor}); callback(); } else elts.bg .animate({ backgroundColor: settings.bgColor }, {complete: callback, duration: 400}); } // ------------------------------------------------------- // Default initialization // ------------------------------------------------------- $($.fn.nyroModal.settings.openSelector).nyroModal(); });