+++ /dev/null
-/*!
- Slimbox v2.05 - The ultimate lightweight Lightbox clone for jQuery
- (c) 2007-2013 Christophe Beyls <http://www.digitalia.be>
- MIT-style license.
-
- Modified by WoltLab GmbH to support large images.
-*/
-
-(function($) {
-
- // Global variables, accessible to Slimbox only
- var win = $(window), options, images, activeImage = -1, activeURL, prevImage, nextImage, compatibleOverlay, middle, centerWidth, centerHeight,
- ie6 = !window.XMLHttpRequest, hiddenElements = [], documentElement = document.documentElement,
-
- // Preload images
- preload = {}, preloadPrev = new Image(), preloadNext = new Image(),
-
- // DOM elements
- overlay, center, image, sizer, prevLink, nextLink, bottomContainer, bottom, caption, number;
-
- /*
- Initialization
- */
-
- $(function() {
- // Append the Slimbox HTML code at the bottom of the document
- $("body").append(
- $([
- overlay = $('<div id="lbOverlay" />').click(close)[0],
- center = $('<div id="lbCenter" />')[0],
- bottomContainer = $('<div id="lbBottomContainer" />')[0]
- ]).css("display", "none")
- );
-
- image = $('<div id="lbImage" />').appendTo(center).append(
- sizer = $('<div style="position: relative;" />').append([
- prevLink = $('<a id="lbPrevLink" href="#" />').click(previous)[0],
- nextLink = $('<a id="lbNextLink" href="#" />').click(next)[0]
- ])[0]
- )[0];
-
- bottom = $('<div id="lbBottom" />').appendTo(bottomContainer).append([
- $('<a id="lbCloseLink" href="#" />').click(close)[0],
- caption = $('<div id="lbCaption" />')[0],
- number = $('<div id="lbNumber" />')[0],
- $('<div style="clear: both;" />')[0]
- ])[0];
- });
-
-
- /*
- API
- */
-
- // Open Slimbox with the specified parameters
- $.slimbox = function(_images, startImage, _options) {
- options = $.extend({
- loop: false, // Allows to navigate between first and last images
- overlayOpacity: 0.8, // 1 is opaque, 0 is completely transparent (change the color in the CSS file)
- overlayFadeDuration: 400, // Duration of the overlay fade-in and fade-out animations (in milliseconds)
- resizeDuration: 400, // Duration of each of the box resize animations (in milliseconds)
- resizeEasing: "swing", // "swing" is jQuery's default easing
- initialWidth: 250, // Initial width of the box (in pixels)
- initialHeight: 250, // Initial height of the box (in pixels)
- imageFadeDuration: 400, // Duration of the image fade-in animation (in milliseconds)
- captionAnimationDuration: 400, // Duration of the caption animation (in milliseconds)
- counterText: "Image {x} of {y}", // Translate or change as you wish, or set it to false to disable counter text for image groups
- closeKeys: [27, 88, 67], // Array of keycodes to close Slimbox, default: Esc (27), 'x' (88), 'c' (67)
- previousKeys: [37, 80], // Array of keycodes to navigate to the previous image, default: Left arrow (37), 'p' (80)
- nextKeys: [39, 78] // Array of keycodes to navigate to the next image, default: Right arrow (39), 'n' (78)
- }, _options);
-
- // The function is called for a single image, with URL and Title as first two arguments
- if (typeof _images == "string") {
- _images = [[_images, startImage]];
- startImage = 0;
- }
-
- // WoltLab modifications BEGIN
- if (activeImage == -1) {
- WCF.System.DisableScrolling.disable();
-
- middle = win.scrollTop() + (win.height() / 2);
- centerWidth = options.initialWidth;
- centerHeight = options.initialHeight;
- $(center).css({top: Math.max(0, middle - (centerHeight / 2)), width: centerWidth, height: centerHeight, marginLeft: -centerWidth/2}).show();
- compatibleOverlay = ie6 || (overlay.currentStyle && (overlay.currentStyle.position != "fixed"));
- if (compatibleOverlay) overlay.style.position = "absolute";
- $(overlay).css("opacity", options.overlayOpacity).fadeIn(options.overlayFadeDuration);
-
- position();
- setup(1);
- }
- // WoltLab modifications END
-
- images = _images;
- options.loop = options.loop && (images.length > 1);
- return changeImage(startImage);
- };
-
- /*
- options: Optional options object, see jQuery.slimbox()
- linkMapper: Optional function taking a link DOM element and an index as arguments and returning an array containing 2 elements:
- the image URL and the image caption (may contain HTML)
- linksFilter: Optional function taking a link DOM element and an index as arguments and returning true if the element is part of
- the image collection that will be shown on click, false if not. "this" refers to the element that was clicked.
- This function must always return true when the DOM element argument is "this".
- */
- $.fn.slimbox = function(_options, linkMapper, linksFilter) {
- linkMapper = linkMapper || function(el) {
- return [el.href, el.title];
- };
-
- linksFilter = linksFilter || function() {
- return true;
- };
-
- var links = this;
-
- return links.unbind("click").click(function() {
- // Build the list of images that will be displayed
- var link = this, startIndex = 0, filteredLinks, i = 0, length;
- filteredLinks = $.grep(links, function(el, i) {
- return linksFilter.call(link, el, i);
- });
-
- // We cannot use jQuery.map() because it flattens the returned array
- for (length = filteredLinks.length; i < length; ++i) {
- if (filteredLinks[i] == link) startIndex = i;
- filteredLinks[i] = linkMapper(filteredLinks[i], i);
- }
-
- return $.slimbox(filteredLinks, startIndex, _options);
- });
- };
-
-
- /*
- Internal functions
- */
-
- function position() {
- var l = win.scrollLeft(), w = win.width();
- $([center, bottomContainer]).css("left", l + (w / 2));
- if (compatibleOverlay) $(overlay).css({left: l, top: win.scrollTop(), width: w, height: win.height()});
- }
-
- function setup(open) {
- if (open) {
- $("object").add(ie6 ? "select" : "embed").each(function(index, el) {
- hiddenElements[index] = [el, el.style.visibility];
- el.style.visibility = "hidden";
- });
- } else {
- $.each(hiddenElements, function(index, el) {
- el[0].style.visibility = el[1];
- });
- hiddenElements = [];
- }
- var fn = open ? "bind" : "unbind";
- win[fn]("scroll resize", position);
- $(document)[fn]("keydown", keyDown);
- }
-
- function keyDown(event) {
- var code = event.which, fn = $.inArray;
- // Prevent default keyboard action (like navigating inside the page)
- return (fn(code, options.closeKeys) >= 0) ? close()
- : (fn(code, options.nextKeys) >= 0) ? next()
- : (fn(code, options.previousKeys) >= 0) ? previous()
- : null;
- }
-
- function previous() {
- return changeImage(prevImage);
- }
-
- function next() {
- return changeImage(nextImage);
- }
-
- function changeImage(imageIndex) {
- if (imageIndex >= 0) {
- activeImage = imageIndex;
- activeURL = images[activeImage][0];
- prevImage = (activeImage || (options.loop ? images.length : 0)) - 1;
- nextImage = ((activeImage + 1) % images.length) || (options.loop ? 0 : -1);
-
- stop();
- // WoltLab modifications BEGIN
-
- // center.className = "lbLoading";
- $('<span class="icon icon48 icon-spinner" />').appendTo(center);
-
- // WoltLab modifications END
-
- preload = new Image();
- preload.onload = animateBox;
- preload.src = activeURL;
- }
-
- return false;
- }
-
- function animateBox() {
- // WoltLab modifications BEGIN
-
- //center.className = "";
- //$(image).css({backgroundImage: "url(" + activeURL + ")", visibility: "hidden", display: ""});
- $(image).css({backgroundImage: "url('" + activeURL + "')", visibility: "hidden", display: ""});
- // WoltLab modifications END
- $(sizer).width(preload.width);
- $([sizer, prevLink, nextLink]).height(preload.height);
-
- $(caption).html(images[activeImage][1] || "");
- $(number).html((((images.length > 1) && options.counterText) || "").replace(/{x}/, activeImage + 1).replace(/{y}/, images.length));
-
- if (prevImage >= 0) preloadPrev.src = images[prevImage][0];
- if (nextImage >= 0) preloadNext.src = images[nextImage][0];
-
- centerWidth = image.offsetWidth;
- centerHeight = image.offsetHeight;
-
- // WoltLab modifications BEGIN
-
- // restrict maximum dimensions to 80% of page size
- var $dimensions = $(window).getDimensions();
- var $maxHeight = Math.round($dimensions.height * 0.8);
- var $maxWidth = Math.round($dimensions.width * 0.8);
- if (centerHeight > $maxHeight || centerWidth > $maxWidth) {
- var $ratioHeight = $maxHeight / centerHeight;
- var $ratioWidth = $maxWidth / centerWidth;
- if ($ratioHeight < $ratioWidth) {
- centerWidth = Math.round(centerWidth * ($maxHeight / centerHeight));
- centerHeight = $maxHeight;
- }
- else {
- centerHeight = Math.round(centerHeight * ($maxWidth / centerWidth));
- centerWidth = $maxWidth;
- }
-
- // update dimensions for sizer and navigation links
- $(sizer).width(centerWidth - 20);
- $([sizer, prevLink, nextLink]).height(centerHeight - 20);
- }
-
- // WoltLab modifications END
-
- var top = Math.max(0, middle - (centerHeight / 2));
- if (center.offsetHeight != centerHeight) {
- $(center).animate({height: centerHeight, top: top}, options.resizeDuration, options.resizeEasing);
- }
- if (center.offsetWidth != centerWidth) {
- $(center).animate({width: centerWidth, marginLeft: -centerWidth/2}, options.resizeDuration, options.resizeEasing);
- }
- $(center).queue(function() {
- $(bottomContainer).css({width: centerWidth, top: top + centerHeight, marginLeft: -centerWidth/2, visibility: "hidden", display: ""});
-
- // WoltLab modifications BEGIN
-
- // remove spinner
- $(center).children('.icon-spinner').remove();
-
- // WoltLab modifications END
-
- $(image).css({display: "none", visibility: "", opacity: ""}).fadeIn(options.imageFadeDuration, animateCaption);
- });
- }
-
- function animateCaption() {
- if (prevImage >= 0) $(prevLink).show();
- if (nextImage >= 0) $(nextLink).show();
- $(bottom).css("marginTop", -bottom.offsetHeight).animate({marginTop: 0}, options.captionAnimationDuration);
- bottomContainer.style.visibility = "";
- }
-
- function stop() {
- preload.onload = null;
- preload.src = preloadPrev.src = preloadNext.src = activeURL;
- $([center, image, bottom]).stop(true);
- $([prevLink, nextLink, image, bottomContainer]).hide();
- }
-
- function close() {
- if (activeImage >= 0) {
- stop();
- activeImage = prevImage = nextImage = -1;
- $(center).hide();
- $(overlay).stop().fadeOut(options.overlayFadeDuration, setup);
-
- // WoltLab modifications BEGIN
-
- WCF.System.DisableScrolling.enable();
-
- // WoltLab modifications END
- }
-
- return false;
- }
-
-})(jQuery);
\ No newline at end of file
+++ /dev/null
-/*!
- Slimbox v2.04 - The ultimate lightweight Lightbox clone for jQuery
- (c) 2007-2010 Christophe Beyls <http://www.digitalia.be>
- MIT-style license.
-
- Modified by WoltLab GmbH to support large images.
-*/
-(function(e){function L(){var n=t.scrollLeft(),r=t.width();e([b,T]).css("left",n+r/2);if(a)e(y).css({left:n,top:t.scrollTop(),width:r,height:t.height()})}function A(n){if(n){e("object").add(h?"select":"embed").each(function(e,t){p[e]=[t,t.style.visibility];t.style.visibility="hidden"})}else{e.each(p,function(e,t){t[0].style.visibility=t[1]});p=[]}var r=n?"bind":"unbind";t[r]("scroll resize",L);e(document)[r]("keydown",O)}function O(t){var r=t.which,i=e.inArray;return i(r,n.closeKeys)>=0?j():i(r,n.nextKeys)>=0?_():i(r,n.previousKeys)>=0?M():null}function M(){return D(o)}function _(){return D(u)}function D(t){if(t>=0){i=t;s=r[i][0];o=(i||(n.loop?r.length:0))-1;u=(i+1)%r.length||(n.loop?0:-1);B();e('<span class="icon icon48 icon-spinner" />').appendTo(b);v=new Image;v.onload=P;v.src=s}return false}function P(){e(w).css({backgroundImage:"url('"+s+"')",visibility:"hidden",display:""});e(E).width(v.width);e([E,S,x]).height(v.height);e(C).html(r[i][1]||"");e(k).html((r.length>1&&n.counterText||"").replace(/{x}/,i+1).replace(/{y}/,r.length));if(o>=0)m.src=r[o][0];if(u>=0)g.src=r[u][0];l=w.offsetWidth;c=w.offsetHeight;var t=e(window).getDimensions();var a=Math.round(t.height*.8);var h=Math.round(t.width*.8);if(c>a||l>h){var p=a/c;var d=h/l;if(p<d){l=Math.round(l*(a/c));c=a}else{c=Math.round(c*(h/l));l=h}e(E).width(l-20);e([E,S,x]).height(c-20)}var y=Math.max(0,f-c/2);if(b.offsetHeight!=c){e(b).animate({height:c,top:y},n.resizeDuration,n.resizeEasing)}if(b.offsetWidth!=l){e(b).animate({width:l,marginLeft:-l/2},n.resizeDuration,n.resizeEasing)}e(b).queue(function(){e(T).css({width:l,top:y+c,marginLeft:-l/2,visibility:"hidden",display:""});e(b).children(".icon-spinner").remove();e(w).css({display:"none",visibility:"",opacity:""}).fadeIn(n.imageFadeDuration,H)})}function H(){if(o>=0)e(S).show();if(u>=0)e(x).show();e(N).css("marginTop",-N.offsetHeight).animate({marginTop:0},n.captionAnimationDuration);T.style.visibility=""}function B(){v.onload=null;v.src=m.src=g.src=s;e([b,w,N]).stop(true);e([S,x,w,T]).hide()}function j(){if(i>=0){B();i=o=u=-1;e(b).hide();e(y).stop().fadeOut(n.overlayFadeDuration,A);WCF.System.DisableScrolling.enable()}return false}var t=e(window),n,r,i=-1,s,o,u,a,f,l,c,h=!window.XMLHttpRequest,p=[],d=document.documentElement,v={},m=new Image,g=new Image,y,b,w,E,S,x,T,N,C,k;e(function(){e("body").append(e([y=e('<div id="lbOverlay" />').click(j)[0],b=e('<div id="lbCenter" />')[0],T=e('<div id="lbBottomContainer" />')[0]]).css("display","none"));w=e('<div id="lbImage" />').appendTo(b).append(E=e('<div style="position: relative;" />').append([S=e('<a id="lbPrevLink" href="#" />').click(M)[0],x=e('<a id="lbNextLink" href="#" />').click(_)[0]])[0])[0];N=e('<div id="lbBottom" />').appendTo(T).append([e('<a id="lbCloseLink" href="#" />').click(j)[0],C=e('<div id="lbCaption" />')[0],k=e('<div id="lbNumber" />')[0],e('<div style="clear: both;" />')[0]])[0]});e.slimbox=function(s,o,u){n=e.extend({loop:false,overlayOpacity:.8,overlayFadeDuration:400,resizeDuration:400,resizeEasing:"swing",initialWidth:250,initialHeight:250,imageFadeDuration:400,captionAnimationDuration:400,counterText:"Image {x} of {y}",closeKeys:[27,88,67],previousKeys:[37,80],nextKeys:[39,78]},u);if(typeof s=="string"){s=[[s,o]];o=0}if(i==-1){WCF.System.DisableScrolling.disable();f=t.scrollTop()+t.height()/2;l=n.initialWidth;c=n.initialHeight;e(b).css({top:Math.max(0,f-c/2),width:l,height:c,marginLeft:-l/2}).show();a=h||y.currentStyle&&y.currentStyle.position!="fixed";if(a)y.style.position="absolute";e(y).css("opacity",n.overlayOpacity).fadeIn(n.overlayFadeDuration);L();A(1)}r=s;n.loop=n.loop&&r.length>1;return D(o)};e.fn.slimbox=function(t,n,r){n=n||function(e){return[e.href,e.title]};r=r||function(){return true};var i=this;return i.unbind("click").click(function(){var s=this,o=0,u,a=0,f;u=e.grep(i,function(e,t){return r.call(s,e,t)});for(f=u.length;a<f;++a){if(u[a]==s)o=a;u[a]=n(u[a],a)}return e.slimbox(u,o,t)})}})(jQuery)
\ No newline at end of file
projects / GitHub / WoltLab / WCF.git / commitdiff