source: extensions/Slim/js/jquery.fancybox.js

Last change on this file was 28556, checked in by Miklfe, 10 years ago

nouveau carousel: mousewheel; scrollable pour les écrans tactiles
nouvelle lightbox: Fancybox
File size: 47.6 KB
Line 
1/*!
2 * fancyBox - jQuery Plugin
3 * version: 2.1.5 (Fri, 14 Jun 2013)
4 * @requires jQuery v1.6 or later
5 *
6 * Examples at http://fancyapps.com/fancybox/
7 * License: www.fancyapps.com/fancybox/#license
8 *
9 * Copyright 2012 Janis Skarnelis - janis@fancyapps.com
10 *
11 */
12
13(function (window, document, $, undefined) {
14        "use strict";
15
16        var H = $("html"),
17                W = $(window),
18                D = $(document),
19                F = $.fancybox = function () {
20                        F.open.apply( this, arguments );
21                },
22                IE =  navigator.userAgent.match(/msie/i),
23                didUpdate       = null,
24                isTouch         = document.createTouch !== undefined,
25
26                isQuery = function(obj) {
27                        return obj && obj.hasOwnProperty && obj instanceof $;
28                },
29                isString = function(str) {
30                        return str && $.type(str) === "string";
31                },
32                isPercentage = function(str) {
33                        return isString(str) && str.indexOf('%') > 0;
34                },
35                isScrollable = function(el) {
36                        return (el && !(el.style.overflow && el.style.overflow === 'hidden') && ((el.clientWidth && el.scrollWidth > el.clientWidth) || (el.clientHeight && el.scrollHeight > el.clientHeight)));
37                },
38                getScalar = function(orig, dim) {
39                        var value = parseInt(orig, 10) || 0;
40
41                        if (dim && isPercentage(orig)) {
42                                value = F.getViewport()[ dim ] / 100 * value;
43                        }
44
45                        return Math.ceil(value);
46                },
47                getValue = function(value, dim) {
48                        return getScalar(value, dim) + 'px';
49                };
50
51        $.extend(F, {
52                // The current version of fancyBox
53                version: '2.1.5',
54
55                defaults: {
56                        padding : 15,
57                        margin  : 20,
58
59                        width     : 800,
60                        height    : 600,
61                        minWidth  : 100,
62                        minHeight : 100,
63                        maxWidth  : 9999,
64                        maxHeight : 9999,
65                        pixelRatio: 1, // Set to 2 for retina display support
66
67                        autoSize   : true,
68                        autoHeight : false,
69                        autoWidth  : false,
70
71                        autoResize  : true,
72                        autoCenter  : !isTouch,
73                        fitToView   : true,
74                        aspectRatio : false,
75                        topRatio    : 0.5,
76                        leftRatio   : 0.5,
77
78                        scrolling : 'auto', // 'auto', 'yes' or 'no'
79                        wrapCSS   : '',
80
81                        arrows     : true,
82                        closeBtn   : true,
83                        closeClick : false,
84                        nextClick  : false,
85                        mouseWheel : true,
86                        autoPlay   : false,
87                        playSpeed  : 3000,
88                        preload    : 3,
89                        modal      : false,
90                        loop       : true,
91
92                        ajax  : {
93                                dataType : 'html',
94                                headers  : { 'X-fancyBox': true }
95                        },
96                        iframe : {
97                                scrolling : 'auto',
98                                preload   : true
99                        },
100                        swf : {
101                                wmode: 'transparent',
102                                allowfullscreen   : 'true',
103                                allowscriptaccess : 'always'
104                        },
105
106                        keys  : {
107                                next : {
108                                        13 : 'left', // enter
109                                        34 : 'up',   // page down
110                                        39 : 'left', // right arrow
111                                        40 : 'up'    // down arrow
112                                },
113                                prev : {
114                                        8  : 'right',  // backspace
115                                        33 : 'down',   // page up
116                                        37 : 'right',  // left arrow
117                                        38 : 'down'    // up arrow
118                                },
119                                close  : [27], // escape key
120                                play   : [32], // space - start/stop slideshow
121                                toggle : [70]  // letter "f" - toggle fullscreen
122                        },
123
124                        direction : {
125                                next : 'left',
126                                prev : 'right'
127                        },
128
129                        scrollOutside  : true,
130
131                        // Override some properties
132                        index   : 0,
133                        type    : null,
134                        href    : null,
135                        content : null,
136                        title   : null,
137
138                        // HTML templates
139                        tpl: {
140                                wrap     : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>',
141                                image    : '<img class="fancybox-image" src="{href}" alt="" />',
142                                iframe   : '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen' + (IE ? ' allowtransparency="true"' : '') + '></iframe>',
143                                error    : '<p class="fancybox-error">The requested content cannot be loaded.<br/>Please try again later.</p>',
144                                closeBtn : '<a title="Close" class="fancybox-item fancybox-close" href="javascript:;"></a>',
145                                next     : '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
146                                prev     : '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>'
147                        },
148
149                        // Properties for each animation type
150                        // Opening fancyBox
151                        openEffect  : 'fade', // 'elastic', 'fade' or 'none'
152                        openSpeed   : 250,
153                        openEasing  : 'swing',
154                        openOpacity : true,
155                        openMethod  : 'zoomIn',
156
157                        // Closing fancyBox
158                        closeEffect  : 'fade', // 'elastic', 'fade' or 'none'
159                        closeSpeed   : 250,
160                        closeEasing  : 'swing',
161                        closeOpacity : true,
162                        closeMethod  : 'zoomOut',
163
164                        // Changing next gallery item
165                        nextEffect : 'elastic', // 'elastic', 'fade' or 'none'
166                        nextSpeed  : 250,
167                        nextEasing : 'swing',
168                        nextMethod : 'changeIn',
169
170                        // Changing previous gallery item
171                        prevEffect : 'elastic', // 'elastic', 'fade' or 'none'
172                        prevSpeed  : 250,
173                        prevEasing : 'swing',
174                        prevMethod : 'changeOut',
175
176                        // Enable default helpers
177                        helpers : {
178                                overlay : true,
179                                title   : true
180                        },
181
182                        // Callbacks
183                        onCancel     : $.noop, // If canceling
184                        beforeLoad   : $.noop, // Before loading
185                        afterLoad    : $.noop, // After loading
186                        beforeShow   : $.noop, // Before changing in current item
187                        afterShow    : $.noop, // After opening
188                        beforeChange : $.noop, // Before changing gallery item
189                        beforeClose  : $.noop, // Before closing
190                        afterClose   : $.noop  // After closing
191                },
192
193                //Current state
194                group    : {}, // Selected group
195                opts     : {}, // Group options
196                previous : null,  // Previous element
197                coming   : null,  // Element being loaded
198                current  : null,  // Currently loaded element
199                isActive : false, // Is activated
200                isOpen   : false, // Is currently open
201                isOpened : false, // Have been fully opened at least once
202
203                wrap  : null,
204                skin  : null,
205                outer : null,
206                inner : null,
207
208                player : {
209                        timer    : null,
210                        isActive : false
211                },
212
213                // Loaders
214                ajaxLoad   : null,
215                imgPreload : null,
216
217                // Some collections
218                transitions : {},
219                helpers     : {},
220
221                /*
222                 *      Static methods
223                 */
224
225                open: function (group, opts) {
226                        if (!group) {
227                                return;
228                        }
229
230                        if (!$.isPlainObject(opts)) {
231                                opts = {};
232                        }
233
234                        // Close if already active
235                        if (false === F.close(true)) {
236                                return;
237                        }
238
239                        // Normalize group
240                        if (!$.isArray(group)) {
241                                group = isQuery(group) ? $(group).get() : [group];
242                        }
243
244                        // Recheck if the type of each element is `object` and set content type (image, ajax, etc)
245                        $.each(group, function(i, element) {
246                                var obj = {},
247                                        href,
248                                        title,
249                                        content,
250                                        type,
251                                        rez,
252                                        hrefParts,
253                                        selector;
254
255                                if ($.type(element) === "object") {
256                                        // Check if is DOM element
257                                        if (element.nodeType) {
258                                                element = $(element);
259                                        }
260
261                                        if (isQuery(element)) {
262                                                obj = {
263                                                        href    : element.data('fancybox-href') || element.attr('href'),
264                                                        title   : element.data('fancybox-title') || element.attr('title'),
265                                                        isDom   : true,
266                                                        element : element
267                                                };
268
269                                                if ($.metadata) {
270                                                        $.extend(true, obj, element.metadata());
271                                                }
272
273                                        } else {
274                                                obj = element;
275                                        }
276                                }
277
278                                href  = opts.href  || obj.href || (isString(element) ? element : null);
279                                title = opts.title !== undefined ? opts.title : obj.title || '';
280
281                                content = opts.content || obj.content;
282                                type    = content ? 'html' : (opts.type  || obj.type);
283
284                                if (!type && obj.isDom) {
285                                        type = element.data('fancybox-type');
286
287                                        if (!type) {
288                                                rez  = element.prop('class').match(/fancybox\.(\w+)/);
289                                                type = rez ? rez[1] : null;
290                                        }
291                                }
292
293                                if (isString(href)) {
294                                        // Try to guess the content type
295                                        if (!type) {
296                                                if (F.isImage(href)) {
297                                                        type = 'image';
298
299                                                } else if (F.isSWF(href)) {
300                                                        type = 'swf';
301
302                                                } else if (href.charAt(0) === '#') {
303                                                        type = 'inline';
304
305                                                } else if (isString(element)) {
306                                                        type    = 'html';
307                                                        content = element;
308                                                }
309                                        }
310
311                                        // Split url into two pieces with source url and content selector, e.g,
312                                        // "/mypage.html #my_id" will load "/mypage.html" and display element having id "my_id"
313                                        if (type === 'ajax') {
314                                                hrefParts = href.split(/\s+/, 2);
315                                                href      = hrefParts.shift();
316                                                selector  = hrefParts.shift();
317                                        }
318                                }
319
320                                if (!content) {
321                                        if (type === 'inline') {
322                                                if (href) {
323                                                        content = $( isString(href) ? href.replace(/.*(?=#[^\s]+$)/, '') : href ); //strip for ie7
324
325                                                } else if (obj.isDom) {
326                                                        content = element;
327                                                }
328
329                                        } else if (type === 'html') {
330                                                content = href;
331
332                                        } else if (!type && !href && obj.isDom) {
333                                                type    = 'inline';
334                                                content = element;
335                                        }
336                                }
337
338                                $.extend(obj, {
339                                        href     : href,
340                                        type     : type,
341                                        content  : content,
342                                        title    : title,
343                                        selector : selector
344                                });
345
346                                group[ i ] = obj;
347                        });
348
349                        // Extend the defaults
350                        F.opts = $.extend(true, {}, F.defaults, opts);
351
352                        // All options are merged recursive except keys
353                        if (opts.keys !== undefined) {
354                                F.opts.keys = opts.keys ? $.extend({}, F.defaults.keys, opts.keys) : false;
355                        }
356
357                        F.group = group;
358
359                        return F._start(F.opts.index);
360                },
361
362                // Cancel image loading or abort ajax request
363                cancel: function () {
364                        var coming = F.coming;
365
366                        if (!coming || false === F.trigger('onCancel')) {
367                                return;
368                        }
369
370                        F.hideLoading();
371
372                        if (F.ajaxLoad) {
373                                F.ajaxLoad.abort();
374                        }
375
376                        F.ajaxLoad = null;
377
378                        if (F.imgPreload) {
379                                F.imgPreload.onload = F.imgPreload.onerror = null;
380                        }
381
382                        if (coming.wrap) {
383                                coming.wrap.stop(true, true).trigger('onReset').remove();
384                        }
385
386                        F.coming = null;
387
388                        // If the first item has been canceled, then clear everything
389                        if (!F.current) {
390                                F._afterZoomOut( coming );
391                        }
392                },
393
394                // Start closing animation if is open; remove immediately if opening/closing
395                close: function (event) {
396                        F.cancel();
397
398                        if (false === F.trigger('beforeClose')) {
399                                return;
400                        }
401
402                        F.unbindEvents();
403
404                        if (!F.isActive) {
405                                return;
406                        }
407
408                        if (!F.isOpen || event === true) {
409                                $('.fancybox-wrap').stop(true).trigger('onReset').remove();
410
411                                F._afterZoomOut();
412
413                        } else {
414                                F.isOpen = F.isOpened = false;
415                                F.isClosing = true;
416
417                                $('.fancybox-item, .fancybox-nav').remove();
418
419                                F.wrap.stop(true, true).removeClass('fancybox-opened');
420
421                                F.transitions[ F.current.closeMethod ]();
422                        }
423                },
424
425                // Manage slideshow:
426                //   $.fancybox.play(); - toggle slideshow
427                //   $.fancybox.play( true ); - start
428                //   $.fancybox.play( false ); - stop
429                play: function ( action ) {
430                        var clear = function () {
431                                        clearTimeout(F.player.timer);
432                                },
433                                set = function () {
434                                        clear();
435
436                                        if (F.current && F.player.isActive) {
437                                                F.player.timer = setTimeout(F.next, F.current.playSpeed);
438                                        }
439                                },
440                                stop = function () {
441                                        clear();
442
443                                        D.unbind('.player');
444
445                                        F.player.isActive = false;
446
447                                        F.trigger('onPlayEnd');
448                                },
449                                start = function () {
450                                        if (F.current && (F.current.loop || F.current.index < F.group.length - 1)) {
451                                                F.player.isActive = true;
452
453                                                D.bind({
454                                                        'onCancel.player beforeClose.player' : stop,
455                                                        'onUpdate.player'   : set,
456                                                        'beforeLoad.player' : clear
457                                                });
458
459                                                set();
460
461                                                F.trigger('onPlayStart');
462                                        }
463                                };
464
465                        if (action === true || (!F.player.isActive && action !== false)) {
466                                start();
467                        } else {
468                                stop();
469                        }
470                },
471
472                // Navigate to next gallery item
473                next: function ( direction ) {
474                        var current = F.current;
475
476                        if (current) {
477                                if (!isString(direction)) {
478                                        direction = current.direction.next;
479                                }
480
481                                F.jumpto(current.index + 1, direction, 'next');
482                        }
483                },
484
485                // Navigate to previous gallery item
486                prev: function ( direction ) {
487                        var current = F.current;
488
489                        if (current) {
490                                if (!isString(direction)) {
491                                        direction = current.direction.prev;
492                                }
493
494                                F.jumpto(current.index - 1, direction, 'prev');
495                        }
496                },
497
498                // Navigate to gallery item by index
499                jumpto: function ( index, direction, router ) {
500                        var current = F.current;
501
502                        if (!current) {
503                                return;
504                        }
505
506                        index = getScalar(index);
507
508                        F.direction = direction || current.direction[ (index >= current.index ? 'next' : 'prev') ];
509                        F.router    = router || 'jumpto';
510
511                        if (current.loop) {
512                                if (index < 0) {
513                                        index = current.group.length + (index % current.group.length);
514                                }
515
516                                index = index % current.group.length;
517                        }
518
519                        if (current.group[ index ] !== undefined) {
520                                F.cancel();
521
522                                F._start(index);
523                        }
524                },
525
526                // Center inside viewport and toggle position type to fixed or absolute if needed
527                reposition: function (e, onlyAbsolute) {
528                        var current = F.current,
529                                wrap    = current ? current.wrap : null,
530                                pos;
531
532                        if (wrap) {
533                                pos = F._getPosition(onlyAbsolute);
534
535                                if (e && e.type === 'scroll') {
536                                        delete pos.position;
537
538                                        wrap.stop(true, true).animate(pos, 200);
539
540                                } else {
541                                        wrap.css(pos);
542
543                                        current.pos = $.extend({}, current.dim, pos);
544                                }
545                        }
546                },
547
548                update: function (e) {
549                        var type = (e && e.type),
550                                anyway = !type || type === 'orientationchange';
551
552                        if (anyway) {
553                                clearTimeout(didUpdate);
554
555                                didUpdate = null;
556                        }
557
558                        if (!F.isOpen || didUpdate) {
559                                return;
560                        }
561
562                        didUpdate = setTimeout(function() {
563                                var current = F.current;
564
565                                if (!current || F.isClosing) {
566                                        return;
567                                }
568
569                                F.wrap.removeClass('fancybox-tmp');
570
571                                if (anyway || type === 'load' || (type === 'resize' && current.autoResize)) {
572                                        F._setDimension();
573                                }
574
575                                if (!(type === 'scroll' && current.canShrink)) {
576                                        F.reposition(e);
577                                }
578
579                                F.trigger('onUpdate');
580
581                                didUpdate = null;
582
583                        }, (anyway && !isTouch ? 0 : 300));
584                },
585
586                // Shrink content to fit inside viewport or restore if resized
587                toggle: function ( action ) {
588                        if (F.isOpen) {
589                                F.current.fitToView = $.type(action) === "boolean" ? action : !F.current.fitToView;
590
591                                // Help browser to restore document dimensions
592                                if (isTouch) {
593                                        F.wrap.removeAttr('style').addClass('fancybox-tmp');
594
595                                        F.trigger('onUpdate');
596                                }
597
598                                F.update();
599                        }
600                },
601
602                hideLoading: function () {
603                        D.unbind('.loading');
604
605                        $('#fancybox-loading').remove();
606                },
607
608                showLoading: function () {
609                        var el, viewport;
610
611                        F.hideLoading();
612
613                        el = $('<div id="fancybox-loading"><div></div></div>').click(F.cancel).appendTo('body');
614
615                        // If user will press the escape-button, the request will be canceled
616                        D.bind('keydown.loading', function(e) {
617                                if ((e.which || e.keyCode) === 27) {
618                                        e.preventDefault();
619
620                                        F.cancel();
621                                }
622                        });
623
624                        if (!F.defaults.fixed) {
625                                viewport = F.getViewport();
626
627                                el.css({
628                                        position : 'absolute',
629                                        top  : (viewport.h * 0.5) + viewport.y,
630                                        left : (viewport.w * 0.5) + viewport.x
631                                });
632                        }
633                },
634
635                getViewport: function () {
636                        var locked = (F.current && F.current.locked) || false,
637                                rez    = {
638                                        x: W.scrollLeft(),
639                                        y: W.scrollTop()
640                                };
641
642                        if (locked) {
643                                rez.w = locked[0].clientWidth;
644                                rez.h = locked[0].clientHeight;
645
646                        } else {
647                                // See http://bugs.jquery.com/ticket/6724
648                                rez.w = isTouch && window.innerWidth  ? window.innerWidth  : W.width();
649                                rez.h = isTouch && window.innerHeight ? window.innerHeight : W.height();
650                        }
651
652                        return rez;
653                },
654
655                // Unbind the keyboard / clicking actions
656                unbindEvents: function () {
657                        if (F.wrap && isQuery(F.wrap)) {
658                                F.wrap.unbind('.fb');
659                        }
660
661                        D.unbind('.fb');
662                        W.unbind('.fb');
663                },
664
665                bindEvents: function () {
666                        var current = F.current,
667                                keys;
668
669                        if (!current) {
670                                return;
671                        }
672
673                        // Changing document height on iOS devices triggers a 'resize' event,
674                        // that can change document height... repeating infinitely
675                        W.bind('orientationchange.fb' + (isTouch ? '' : ' resize.fb') + (current.autoCenter && !current.locked ? ' scroll.fb' : ''), F.update);
676
677                        keys = current.keys;
678
679                        if (keys) {
680                                D.bind('keydown.fb', function (e) {
681                                        var code   = e.which || e.keyCode,
682                                                target = e.target || e.srcElement;
683
684                                        // Skip esc key if loading, because showLoading will cancel preloading
685                                        if (code === 27 && F.coming) {
686                                                return false;
687                                        }
688
689                                        // Ignore key combinations and key events within form elements
690                                        if (!e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey && !(target && (target.type || $(target).is('[contenteditable]')))) {
691                                                $.each(keys, function(i, val) {
692                                                        if (current.group.length > 1 && val[ code ] !== undefined) {
693                                                                F[ i ]( val[ code ] );
694
695                                                                e.preventDefault();
696                                                                return false;
697                                                        }
698
699                                                        if ($.inArray(code, val) > -1) {
700                                                                F[ i ] ();
701
702                                                                e.preventDefault();
703                                                                return false;
704                                                        }
705                                                });
706                                        }
707                                });
708                        }
709
710                        if ($.fn.mousewheel && current.mouseWheel) {
711                                F.wrap.bind('mousewheel.fb', function (e, delta, deltaX, deltaY) {
712                                        var target = e.target || null,
713                                                parent = $(target),
714                                                canScroll = false;
715
716                                        while (parent.length) {
717                                                if (canScroll || parent.is('.fancybox-skin') || parent.is('.fancybox-wrap')) {
718                                                        break;
719                                                }
720
721                                                canScroll = isScrollable( parent[0] );
722                                                parent    = $(parent).parent();
723                                        }
724
725                                        if (delta !== 0 && !canScroll) {
726                                                if (F.group.length > 1 && !current.canShrink) {
727                                                        if (deltaY > 0 || deltaX > 0) {
728                                                                F.prev( deltaY > 0 ? 'down' : 'left' );
729
730                                                        } else if (deltaY < 0 || deltaX < 0) {
731                                                                F.next( deltaY < 0 ? 'up' : 'right' );
732                                                        }
733
734                                                        e.preventDefault();
735                                                }
736                                        }
737                                });
738                        }
739                },
740
741                trigger: function (event, o) {
742                        var ret, obj = o || F.coming || F.current;
743
744                        if (!obj) {
745                                return;
746                        }
747
748                        if ($.isFunction( obj[event] )) {
749                                ret = obj[event].apply(obj, Array.prototype.slice.call(arguments, 1));
750                        }
751
752                        if (ret === false) {
753                                return false;
754                        }
755
756                        if (obj.helpers) {
757                                $.each(obj.helpers, function (helper, opts) {
758                                        if (opts && F.helpers[helper] && $.isFunction(F.helpers[helper][event])) {
759                                                F.helpers[helper][event]($.extend(true, {}, F.helpers[helper].defaults, opts), obj);
760                                        }
761                                });
762                        }
763
764                        D.trigger(event);
765                },
766
767                isImage: function (str) {
768                        return isString(str) && str.match(/(^data:image\/.*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg)((\?|#).*)?$)/i);
769                },
770
771                isSWF: function (str) {
772                        return isString(str) && str.match(/\.(swf)((\?|#).*)?$/i);
773                },
774
775                _start: function (index) {
776                        var coming = {},
777                                obj,
778                                href,
779                                type,
780                                margin,
781                                padding;
782
783                        index = getScalar( index );
784                        obj   = F.group[ index ] || null;
785
786                        if (!obj) {
787                                return false;
788                        }
789
790                        coming = $.extend(true, {}, F.opts, obj);
791
792                        // Convert margin and padding properties to array - top, right, bottom, left
793                        margin  = coming.margin;
794                        padding = coming.padding;
795
796                        if ($.type(margin) === 'number') {
797                                coming.margin = [margin, margin, margin, margin];
798                        }
799
800                        if ($.type(padding) === 'number') {
801                                coming.padding = [padding, padding, padding, padding];
802                        }
803
804                        // 'modal' propery is just a shortcut
805                        if (coming.modal) {
806                                $.extend(true, coming, {
807                                        closeBtn   : false,
808                                        closeClick : false,
809                                        nextClick  : false,
810                                        arrows     : false,
811                                        mouseWheel : false,
812                                        keys       : null,
813                                        helpers: {
814                                                overlay : {
815                                                        closeClick : false
816                                                }
817                                        }
818                                });
819                        }
820
821                        // 'autoSize' property is a shortcut, too
822                        if (coming.autoSize) {
823                                coming.autoWidth = coming.autoHeight = true;
824                        }
825
826                        if (coming.width === 'auto') {
827                                coming.autoWidth = true;
828                        }
829
830                        if (coming.height === 'auto') {
831                                coming.autoHeight = true;
832                        }
833
834                        /*
835                         * Add reference to the group, so it`s possible to access from callbacks, example:
836                         * afterLoad : function() {
837                         *     this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
838                         * }
839                         */
840
841                        coming.group  = F.group;
842                        coming.index  = index;
843
844                        // Give a chance for callback or helpers to update coming item (type, title, etc)
845                        F.coming = coming;
846
847                        if (false === F.trigger('beforeLoad')) {
848                                F.coming = null;
849
850                                return;
851                        }
852
853                        type = coming.type;
854                        href = coming.href;
855
856                        if (!type) {
857                                F.coming = null;
858
859                                //If we can not determine content type then drop silently or display next/prev item if looping through gallery
860                                if (F.current && F.router && F.router !== 'jumpto') {
861                                        F.current.index = index;
862
863                                        return F[ F.router ]( F.direction );
864                                }
865
866                                return false;
867                        }
868
869                        F.isActive = true;
870
871                        if (type === 'image' || type === 'swf') {
872                                coming.autoHeight = coming.autoWidth = false;
873                                coming.scrolling  = 'visible';
874                        }
875
876                        if (type === 'image') {
877                                coming.aspectRatio = true;
878                        }
879
880                        if (type === 'iframe' && isTouch) {
881                                coming.scrolling = 'scroll';
882                        }
883
884                        // Build the neccessary markup
885                        coming.wrap = $(coming.tpl.wrap).addClass('fancybox-' + (isTouch ? 'mobile' : 'desktop') + ' fancybox-type-' + type + ' fancybox-tmp ' + coming.wrapCSS).appendTo( coming.parent || 'body' );
886
887                        $.extend(coming, {
888                                skin  : $('.fancybox-skin',  coming.wrap),
889                                outer : $('.fancybox-outer', coming.wrap),
890                                inner : $('.fancybox-inner', coming.wrap)
891                        });
892
893                        $.each(["Top", "Right", "Bottom", "Left"], function(i, v) {
894                                coming.skin.css('padding' + v, getValue(coming.padding[ i ]));
895                        });
896
897                        F.trigger('onReady');
898
899                        // Check before try to load; 'inline' and 'html' types need content, others - href
900                        if (type === 'inline' || type === 'html') {
901                                if (!coming.content || !coming.content.length) {
902                                        return F._error( 'content' );
903                                }
904
905                        } else if (!href) {
906                                return F._error( 'href' );
907                        }
908
909                        if (type === 'image') {
910                                F._loadImage();
911
912                        } else if (type === 'ajax') {
913                                F._loadAjax();
914
915                        } else if (type === 'iframe') {
916                                F._loadIframe();
917
918                        } else {
919                                F._afterLoad();
920                        }
921                },
922
923                _error: function ( type ) {
924                        $.extend(F.coming, {
925                                type       : 'html',
926                                autoWidth  : true,
927                                autoHeight : true,
928                                minWidth   : 0,
929                                minHeight  : 0,
930                                scrolling  : 'no',
931                                hasError   : type,
932                                content    : F.coming.tpl.error
933                        });
934
935                        F._afterLoad();
936                },
937
938                _loadImage: function () {
939                        // Reset preload image so it is later possible to check "complete" property
940                        var img = F.imgPreload = new Image();
941
942                        img.onload = function () {
943                                this.onload = this.onerror = null;
944
945                                F.coming.width  = this.width / F.opts.pixelRatio;
946                                F.coming.height = this.height / F.opts.pixelRatio;
947
948                                F._afterLoad();
949                        };
950
951                        img.onerror = function () {
952                                this.onload = this.onerror = null;
953
954                                F._error( 'image' );
955                        };
956
957                        img.src = F.coming.href;
958
959                        if (img.complete !== true) {
960                                F.showLoading();
961                        }
962                },
963
964                _loadAjax: function () {
965                        var coming = F.coming;
966
967                        F.showLoading();
968
969                        F.ajaxLoad = $.ajax($.extend({}, coming.ajax, {
970                                url: coming.href,
971                                error: function (jqXHR, textStatus) {
972                                        if (F.coming && textStatus !== 'abort') {
973                                                F._error( 'ajax', jqXHR );
974
975                                        } else {
976                                                F.hideLoading();
977                                        }
978                                },
979                                success: function (data, textStatus) {
980                                        if (textStatus === 'success') {
981                                                coming.content = data;
982
983                                                F._afterLoad();
984                                        }
985                                }
986                        }));
987                },
988
989                _loadIframe: function() {
990                        var coming = F.coming,
991                                iframe = $(coming.tpl.iframe.replace(/\{rnd\}/g, new Date().getTime()))
992                                        .attr('scrolling', isTouch ? 'auto' : coming.iframe.scrolling)
993                                        .attr('src', coming.href);
994
995                        // This helps IE
996                        $(coming.wrap).bind('onReset', function () {
997                                try {
998                                        $(this).find('iframe').hide().attr('src', '//about:blank').end().empty();
999                                } catch (e) {}
1000                        });
1001
1002                        if (coming.iframe.preload) {
1003                                F.showLoading();
1004
1005                                iframe.one('load', function() {
1006                                        $(this).data('ready', 1);
1007
1008                                        // iOS will lose scrolling if we resize
1009                                        if (!isTouch) {
1010                                                $(this).bind('load.fb', F.update);
1011                                        }
1012
1013                                        // Without this trick:
1014                                        //   - iframe won't scroll on iOS devices
1015                                        //   - IE7 sometimes displays empty iframe
1016                                        $(this).parents('.fancybox-wrap').width('100%').removeClass('fancybox-tmp').show();
1017
1018                                        F._afterLoad();
1019                                });
1020                        }
1021
1022                        coming.content = iframe.appendTo( coming.inner );
1023
1024                        if (!coming.iframe.preload) {
1025                                F._afterLoad();
1026                        }
1027                },
1028
1029                _preloadImages: function() {
1030                        var group   = F.group,
1031                                current = F.current,
1032                                len     = group.length,
1033                                cnt     = current.preload ? Math.min(current.preload, len - 1) : 0,
1034                                item,
1035                                i;
1036
1037                        for (i = 1; i <= cnt; i += 1) {
1038                                item = group[ (current.index + i ) % len ];
1039
1040                                if (item.type === 'image' && item.href) {
1041                                        new Image().src = item.href;
1042                                }
1043                        }
1044                },
1045
1046                _afterLoad: function () {
1047                        var coming   = F.coming,
1048                                previous = F.current,
1049                                placeholder = 'fancybox-placeholder',
1050                                current,
1051                                content,
1052                                type,
1053                                scrolling,
1054                                href,
1055                                embed;
1056
1057                        F.hideLoading();
1058
1059                        if (!coming || F.isActive === false) {
1060                                return;
1061                        }
1062
1063                        if (false === F.trigger('afterLoad', coming, previous)) {
1064                                coming.wrap.stop(true).trigger('onReset').remove();
1065
1066                                F.coming = null;
1067
1068                                return;
1069                        }
1070
1071                        if (previous) {
1072                                F.trigger('beforeChange', previous);
1073
1074                                previous.wrap.stop(true).removeClass('fancybox-opened')
1075                                        .find('.fancybox-item, .fancybox-nav')
1076                                        .remove();
1077                        }
1078
1079                        F.unbindEvents();
1080
1081                        current   = coming;
1082                        content   = coming.content;
1083                        type      = coming.type;
1084                        scrolling = coming.scrolling;
1085
1086                        $.extend(F, {
1087                                wrap  : current.wrap,
1088                                skin  : current.skin,
1089                                outer : current.outer,
1090                                inner : current.inner,
1091                                current  : current,
1092                                previous : previous
1093                        });
1094
1095                        href = current.href;
1096
1097                        switch (type) {
1098                                case 'inline':
1099                                case 'ajax':
1100                                case 'html':
1101                                        if (current.selector) {
1102                                                content = $('<div>').html(content).find(current.selector);
1103
1104                                        } else if (isQuery(content)) {
1105                                                if (!content.data(placeholder)) {
1106                                                        content.data(placeholder, $('<div class="' + placeholder + '"></div>').insertAfter( content ).hide() );
1107                                                }
1108
1109                                                content = content.show().detach();
1110
1111                                                current.wrap.bind('onReset', function () {
1112                                                        if ($(this).find(content).length) {
1113                                                                content.hide().replaceAll( content.data(placeholder) ).data(placeholder, false);
1114                                                        }
1115                                                });
1116                                        }
1117                                break;
1118
1119                                case 'image':
1120                                        content = current.tpl.image.replace('{href}', href);
1121                                break;
1122
1123                                case 'swf':
1124                                        content = '<object id="fancybox-swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%"><param name="movie" value="' + href + '"></param>';
1125                                        embed   = '';
1126
1127                                        $.each(current.swf, function(name, val) {
1128                                                content += '<param name="' + name + '" value="' + val + '"></param>';
1129                                                embed   += ' ' + name + '="' + val + '"';
1130                                        });
1131
1132                                        content += '<embed src="' + href + '" type="application/x-shockwave-flash" width="100%" height="100%"' + embed + '></embed></object>';
1133                                break;
1134                        }
1135
1136                        if (!(isQuery(content) && content.parent().is(current.inner))) {
1137                                current.inner.append( content );
1138                        }
1139
1140                        // Give a chance for helpers or callbacks to update elements
1141                        F.trigger('beforeShow');
1142
1143                        // Set scrolling before calculating dimensions
1144                        current.inner.css('overflow', scrolling === 'yes' ? 'scroll' : (scrolling === 'no' ? 'hidden' : scrolling));
1145
1146                        // Set initial dimensions and start position
1147                        F._setDimension();
1148
1149                        F.reposition();
1150
1151                        F.isOpen = false;
1152                        F.coming = null;
1153
1154                        F.bindEvents();
1155
1156                        if (!F.isOpened) {
1157                                $('.fancybox-wrap').not( current.wrap ).stop(true).trigger('onReset').remove();
1158
1159                        } else if (previous.prevMethod) {
1160                                F.transitions[ previous.prevMethod ]();
1161                        }
1162
1163                        F.transitions[ F.isOpened ? current.nextMethod : current.openMethod ]();
1164
1165                        F._preloadImages();
1166                },
1167
1168                _setDimension: function () {
1169                        var viewport   = F.getViewport(),
1170                                steps      = 0,
1171                                canShrink  = false,
1172                                canExpand  = false,
1173                                wrap       = F.wrap,
1174                                skin       = F.skin,
1175                                inner      = F.inner,
1176                                current    = F.current,
1177                                width      = current.width,
1178                                height     = current.height,
1179                                minWidth   = current.minWidth,
1180                                minHeight  = current.minHeight,
1181                                maxWidth   = current.maxWidth,
1182                                maxHeight  = current.maxHeight,
1183                                scrolling  = current.scrolling,
1184                                scrollOut  = current.scrollOutside ? current.scrollbarWidth : 0,
1185                                margin     = current.margin,
1186                                wMargin    = getScalar(margin[1] + margin[3]),
1187                                hMargin    = getScalar(margin[0] + margin[2]),
1188                                wPadding,
1189                                hPadding,
1190                                wSpace,
1191                                hSpace,
1192                                origWidth,
1193                                origHeight,
1194                                origMaxWidth,
1195                                origMaxHeight,
1196                                ratio,
1197                                width_,
1198                                height_,
1199                                maxWidth_,
1200                                maxHeight_,
1201                                iframe,
1202                                body;
1203
1204                        // Reset dimensions so we could re-check actual size
1205                        wrap.add(skin).add(inner).width('auto').height('auto').removeClass('fancybox-tmp');
1206
1207                        wPadding = getScalar(skin.outerWidth(true)  - skin.width());
1208                        hPadding = getScalar(skin.outerHeight(true) - skin.height());
1209
1210                        // Any space between content and viewport (margin, padding, border, title)
1211                        wSpace = wMargin + wPadding;
1212                        hSpace = hMargin + hPadding;
1213
1214                        origWidth  = isPercentage(width)  ? (viewport.w - wSpace) * getScalar(width)  / 100 : width;
1215                        origHeight = isPercentage(height) ? (viewport.h - hSpace) * getScalar(height) / 100 : height;
1216
1217                        if (current.type === 'iframe') {
1218                                iframe = current.content;
1219
1220                                if (current.autoHeight && iframe.data('ready') === 1) {
1221                                        try {
1222                                                if (iframe[0].contentWindow.document.location) {
1223                                                        inner.width( origWidth ).height(9999);
1224
1225                                                        body = iframe.contents().find('body');
1226
1227                                                        if (scrollOut) {
1228                                                                body.css('overflow-x', 'hidden');
1229                                                        }
1230
1231                                                        origHeight = body.outerHeight(true);
1232                                                }
1233
1234                                        } catch (e) {}
1235                                }
1236
1237                        } else if (current.autoWidth || current.autoHeight) {
1238                                inner.addClass( 'fancybox-tmp' );
1239
1240                                // Set width or height in case we need to calculate only one dimension
1241                                if (!current.autoWidth) {
1242                                        inner.width( origWidth );
1243                                }
1244
1245                                if (!current.autoHeight) {
1246                                        inner.height( origHeight );
1247                                }
1248
1249                                if (current.autoWidth) {
1250                                        origWidth = inner.width();
1251                                }
1252
1253                                if (current.autoHeight) {
1254                                        origHeight = inner.height();
1255                                }
1256
1257                                inner.removeClass( 'fancybox-tmp' );
1258                        }
1259
1260                        width  = getScalar( origWidth );
1261                        height = getScalar( origHeight );
1262
1263                        ratio  = origWidth / origHeight;
1264
1265                        // Calculations for the content
1266                        minWidth  = getScalar(isPercentage(minWidth) ? getScalar(minWidth, 'w') - wSpace : minWidth);
1267                        maxWidth  = getScalar(isPercentage(maxWidth) ? getScalar(maxWidth, 'w') - wSpace : maxWidth);
1268
1269                        minHeight = getScalar(isPercentage(minHeight) ? getScalar(minHeight, 'h') - hSpace : minHeight);
1270                        maxHeight = getScalar(isPercentage(maxHeight) ? getScalar(maxHeight, 'h') - hSpace : maxHeight);
1271
1272                        // These will be used to determine if wrap can fit in the viewport
1273                        origMaxWidth  = maxWidth;
1274                        origMaxHeight = maxHeight;
1275
1276                        if (current.fitToView) {
1277                                maxWidth  = Math.min(viewport.w - wSpace, maxWidth);
1278                                maxHeight = Math.min(viewport.h - hSpace, maxHeight);
1279                        }
1280
1281                        maxWidth_  = viewport.w - wMargin;
1282                        maxHeight_ = viewport.h - hMargin;
1283
1284                        if (current.aspectRatio) {
1285                                if (width > maxWidth) {
1286                                        width  = maxWidth;
1287                                        height = getScalar(width / ratio);
1288                                }
1289
1290                                if (height > maxHeight) {
1291                                        height = maxHeight;
1292                                        width  = getScalar(height * ratio);
1293                                }
1294
1295                                if (width < minWidth) {
1296                                        width  = minWidth;
1297                                        height = getScalar(width / ratio);
1298                                }
1299
1300                                if (height < minHeight) {
1301                                        height = minHeight;
1302                                        width  = getScalar(height * ratio);
1303                                }
1304
1305                        } else {
1306                                width = Math.max(minWidth, Math.min(width, maxWidth));
1307
1308                                if (current.autoHeight && current.type !== 'iframe') {
1309                                        inner.width( width );
1310
1311                                        height = inner.height();
1312                                }
1313
1314                                height = Math.max(minHeight, Math.min(height, maxHeight));
1315                        }
1316
1317                        // Try to fit inside viewport (including the title)
1318                        if (current.fitToView) {
1319                                inner.width( width ).height( height );
1320
1321                                wrap.width( width + wPadding );
1322
1323                                // Real wrap dimensions
1324                                width_  = wrap.width();
1325                                height_ = wrap.height();
1326
1327                                if (current.aspectRatio) {
1328                                        while ((width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight) {
1329                                                if (steps++ > 19) {
1330                                                        break;
1331                                                }
1332
1333                                                height = Math.max(minHeight, Math.min(maxHeight, height - 10));
1334                                                width  = getScalar(height * ratio);
1335
1336                                                if (width < minWidth) {
1337                                                        width  = minWidth;
1338                                                        height = getScalar(width / ratio);
1339                                                }
1340
1341                                                if (width > maxWidth) {
1342                                                        width  = maxWidth;
1343                                                        height = getScalar(width / ratio);
1344                                                }
1345
1346                                                inner.width( width ).height( height );
1347
1348                                                wrap.width( width + wPadding );
1349
1350                                                width_  = wrap.width();
1351                                                height_ = wrap.height();
1352                                        }
1353
1354                                } else {
1355                                        width  = Math.max(minWidth,  Math.min(width,  width  - (width_  - maxWidth_)));
1356                                        height = Math.max(minHeight, Math.min(height, height - (height_ - maxHeight_)));
1357                                }
1358                        }
1359
1360                        if (scrollOut && scrolling === 'auto' && height < origHeight && (width + wPadding + scrollOut) < maxWidth_) {
1361                                width += scrollOut;
1362                        }
1363
1364                        inner.width( width ).height( height );
1365
1366                        wrap.width( width + wPadding );
1367
1368                        width_  = wrap.width();
1369                        height_ = wrap.height();
1370
1371                        canShrink = (width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight;
1372                        canExpand = current.aspectRatio ? (width < origMaxWidth && height < origMaxHeight && width < origWidth && height < origHeight) : ((width < origMaxWidth || height < origMaxHeight) && (width < origWidth || height < origHeight));
1373
1374                        $.extend(current, {
1375                                dim : {
1376                                        width   : getValue( width_ ),
1377                                        height  : getValue( height_ )
1378                                },
1379                                origWidth  : origWidth,
1380                                origHeight : origHeight,
1381                                canShrink  : canShrink,
1382                                canExpand  : canExpand,
1383                                wPadding   : wPadding,
1384                                hPadding   : hPadding,
1385                                wrapSpace  : height_ - skin.outerHeight(true),
1386                                skinSpace  : skin.height() - height
1387                        });
1388
1389                        if (!iframe && current.autoHeight && height > minHeight && height < maxHeight && !canExpand) {
1390                                inner.height('auto');
1391                        }
1392                },
1393
1394                _getPosition: function (onlyAbsolute) {
1395                        var current  = F.current,
1396                                viewport = F.getViewport(),
1397                                margin   = current.margin,
1398                                width    = F.wrap.width()  + margin[1] + margin[3],
1399                                height   = F.wrap.height() + margin[0] + margin[2],
1400                                rez      = {
1401                                        position: 'absolute',
1402                                        top  : margin[0],
1403                                        left : margin[3]
1404                                };
1405
1406                        if (current.autoCenter && current.fixed && !onlyAbsolute && height <= viewport.h && width <= viewport.w) {
1407                                rez.position = 'fixed';
1408
1409                        } else if (!current.locked) {
1410                                rez.top  += viewport.y;
1411                                rez.left += viewport.x;
1412                        }
1413
1414                        rez.top  = getValue(Math.max(rez.top,  rez.top  + ((viewport.h - height) * current.topRatio)));
1415                        rez.left = getValue(Math.max(rez.left, rez.left + ((viewport.w - width)  * current.leftRatio)));
1416
1417                        return rez;
1418                },
1419
1420                _afterZoomIn: function () {
1421                        var current = F.current;
1422
1423                        if (!current) {
1424                                return;
1425                        }
1426
1427                        F.isOpen = F.isOpened = true;
1428
1429                        F.wrap.css('overflow', 'visible').addClass('fancybox-opened');
1430
1431                        F.update();
1432
1433                        // Assign a click event
1434                        if ( current.closeClick || (current.nextClick && F.group.length > 1) ) {
1435                                F.inner.css('cursor', 'pointer').bind('click.fb', function(e) {
1436                                        if (!$(e.target).is('a') && !$(e.target).parent().is('a')) {
1437                                                e.preventDefault();
1438
1439                                                F[ current.closeClick ? 'close' : 'next' ]();
1440                                        }
1441                                });
1442                        }
1443
1444                        // Create a close button
1445                        if (current.closeBtn) {
1446                                $(current.tpl.closeBtn).appendTo(F.skin).bind('click.fb', function(e) {
1447                                        e.preventDefault();
1448
1449                                        F.close();
1450                                });
1451                        }
1452
1453                        // Create navigation arrows
1454                        if (current.arrows && F.group.length > 1) {
1455                                if (current.loop || current.index > 0) {
1456                                        $(current.tpl.prev).appendTo(F.outer).bind('click.fb', F.prev);
1457                                }
1458
1459                                if (current.loop || current.index < F.group.length - 1) {
1460                                        $(current.tpl.next).appendTo(F.outer).bind('click.fb', F.next);
1461                                }
1462                        }
1463
1464                        F.trigger('afterShow');
1465
1466                        // Stop the slideshow if this is the last item
1467                        if (!current.loop && current.index === current.group.length - 1) {
1468                                F.play( false );
1469
1470                        } else if (F.opts.autoPlay && !F.player.isActive) {
1471                                F.opts.autoPlay = false;
1472
1473                                F.play();
1474                        }
1475                },
1476
1477                _afterZoomOut: function ( obj ) {
1478                        obj = obj || F.current;
1479
1480                        $('.fancybox-wrap').trigger('onReset').remove();
1481
1482                        $.extend(F, {
1483                                group  : {},
1484                                opts   : {},
1485                                router : false,
1486                                current   : null,
1487                                isActive  : false,
1488                                isOpened  : false,
1489                                isOpen    : false,
1490                                isClosing : false,
1491                                wrap   : null,
1492                                skin   : null,
1493                                outer  : null,
1494                                inner  : null
1495                        });
1496
1497                        F.trigger('afterClose', obj);
1498                }
1499        });
1500
1501        /*
1502         *      Default transitions
1503         */
1504
1505        F.transitions = {
1506                getOrigPosition: function () {
1507                        var current  = F.current,
1508                                element  = current.element,
1509                                orig     = current.orig,
1510                                pos      = {},
1511                                width    = 50,
1512                                height   = 50,
1513                                hPadding = current.hPadding,
1514                                wPadding = current.wPadding,
1515                                viewport = F.getViewport();
1516
1517                        if (!orig && current.isDom && element.is(':visible')) {
1518                                orig = element.find('img:first');
1519
1520                                if (!orig.length) {
1521                                        orig = element;
1522                                }
1523                        }
1524
1525                        if (isQuery(orig)) {
1526                                pos = orig.offset();
1527
1528                                if (orig.is('img')) {
1529                                        width  = orig.outerWidth();
1530                                        height = orig.outerHeight();
1531                                }
1532
1533                        } else {
1534                                pos.top  = viewport.y + (viewport.h - height) * current.topRatio;
1535                                pos.left = viewport.x + (viewport.w - width)  * current.leftRatio;
1536                        }
1537
1538                        if (F.wrap.css('position') === 'fixed' || current.locked) {
1539                                pos.top  -= viewport.y;
1540                                pos.left -= viewport.x;
1541                        }
1542
1543                        pos = {
1544                                top     : getValue(pos.top  - hPadding * current.topRatio),
1545                                left    : getValue(pos.left - wPadding * current.leftRatio),
1546                                width   : getValue(width  + wPadding),
1547                                height  : getValue(height + hPadding)
1548                        };
1549
1550                        return pos;
1551                },
1552
1553                step: function (now, fx) {
1554                        var ratio,
1555                                padding,
1556                                value,
1557                                prop       = fx.prop,
1558                                current    = F.current,
1559                                wrapSpace  = current.wrapSpace,
1560                                skinSpace  = current.skinSpace;
1561
1562                        if (prop === 'width' || prop === 'height') {
1563                                ratio = fx.end === fx.start ? 1 : (now - fx.start) / (fx.end - fx.start);
1564
1565                                if (F.isClosing) {
1566                                        ratio = 1 - ratio;
1567                                }
1568
1569                                padding = prop === 'width' ? current.wPadding : current.hPadding;
1570                                value   = now - padding;
1571
1572                                F.skin[ prop ](  getScalar( prop === 'width' ?  value : value - (wrapSpace * ratio) ) );
1573                                F.inner[ prop ]( getScalar( prop === 'width' ?  value : value - (wrapSpace * ratio) - (skinSpace * ratio) ) );
1574                        }
1575                },
1576
1577                zoomIn: function () {
1578                        var current  = F.current,
1579                                startPos = current.pos,
1580                                effect   = current.openEffect,
1581                                elastic  = effect === 'elastic',
1582                                endPos   = $.extend({opacity : 1}, startPos);
1583
1584                        // Remove "position" property that breaks older IE
1585                        delete endPos.position;
1586
1587                        if (elastic) {
1588                                startPos = this.getOrigPosition();
1589
1590                                if (current.openOpacity) {
1591                                        startPos.opacity = 0.1;
1592                                }
1593
1594                        } else if (effect === 'fade') {
1595                                startPos.opacity = 0.1;
1596                        }
1597
1598                        F.wrap.css(startPos).animate(endPos, {
1599                                duration : effect === 'none' ? 0 : current.openSpeed,
1600                                easing   : current.openEasing,
1601                                step     : elastic ? this.step : null,
1602                                complete : F._afterZoomIn
1603                        });
1604                },
1605
1606                zoomOut: function () {
1607                        var current  = F.current,
1608                                effect   = current.closeEffect,
1609                                elastic  = effect === 'elastic',
1610                                endPos   = {opacity : 0.1};
1611
1612                        if (elastic) {
1613                                endPos = this.getOrigPosition();
1614
1615                                if (current.closeOpacity) {
1616                                        endPos.opacity = 0.1;
1617                                }
1618                        }
1619
1620                        F.wrap.animate(endPos, {
1621                                duration : effect === 'none' ? 0 : current.closeSpeed,
1622                                easing   : current.closeEasing,
1623                                step     : elastic ? this.step : null,
1624                                complete : F._afterZoomOut
1625                        });
1626                },
1627
1628                changeIn: function () {
1629                        var current   = F.current,
1630                                effect    = current.nextEffect,
1631                                startPos  = current.pos,
1632                                endPos    = { opacity : 1 },
1633                                direction = F.direction,
1634                                distance  = 200,
1635                                field;
1636
1637                        startPos.opacity = 0.1;
1638
1639                        if (effect === 'elastic') {
1640                                field = direction === 'down' || direction === 'up' ? 'top' : 'left';
1641
1642                                if (direction === 'down' || direction === 'right') {
1643                                        startPos[ field ] = getValue(getScalar(startPos[ field ]) - distance);
1644                                        endPos[ field ]   = '+=' + distance + 'px';
1645
1646                                } else {
1647                                        startPos[ field ] = getValue(getScalar(startPos[ field ]) + distance);
1648                                        endPos[ field ]   = '-=' + distance + 'px';
1649                                }
1650                        }
1651
1652                        // Workaround for http://bugs.jquery.com/ticket/12273
1653                        if (effect === 'none') {
1654                                F._afterZoomIn();
1655
1656                        } else {
1657                                F.wrap.css(startPos).animate(endPos, {
1658                                        duration : current.nextSpeed,
1659                                        easing   : current.nextEasing,
1660                                        complete : F._afterZoomIn
1661                                });
1662                        }
1663                },
1664
1665                changeOut: function () {
1666                        var previous  = F.previous,
1667                                effect    = previous.prevEffect,
1668                                endPos    = { opacity : 0.1 },
1669                                direction = F.direction,
1670                                distance  = 200;
1671
1672                        if (effect === 'elastic') {
1673                                endPos[ direction === 'down' || direction === 'up' ? 'top' : 'left' ] = ( direction === 'up' || direction === 'left' ? '-' : '+' ) + '=' + distance + 'px';
1674                        }
1675
1676                        previous.wrap.animate(endPos, {
1677                                duration : effect === 'none' ? 0 : previous.prevSpeed,
1678                                easing   : previous.prevEasing,
1679                                complete : function () {
1680                                        $(this).trigger('onReset').remove();
1681                                }
1682                        });
1683                }
1684        };
1685
1686        /*
1687         *      Overlay helper
1688         */
1689
1690        F.helpers.overlay = {
1691                defaults : {
1692                        closeClick : true,      // if true, fancyBox will be closed when user clicks on the overlay
1693                        speedOut   : 200,       // duration of fadeOut animation
1694                        showEarly  : true,      // indicates if should be opened immediately or wait until the content is ready
1695                        css        : {},        // custom CSS properties
1696                        locked     : !isTouch,  // if true, the content will be locked into overlay
1697                        fixed      : true       // if false, the overlay CSS position property will not be set to "fixed"
1698                },
1699
1700                overlay : null,      // current handle
1701                fixed   : false,     // indicates if the overlay has position "fixed"
1702                el      : $('html'), // element that contains "the lock"
1703
1704                // Public methods
1705                create : function(opts) {
1706                        opts = $.extend({}, this.defaults, opts);
1707
1708                        if (this.overlay) {
1709                                this.close();
1710                        }
1711
1712                        this.overlay = $('<div class="fancybox-overlay"></div>').appendTo( F.coming ? F.coming.parent : opts.parent );
1713                        this.fixed   = false;
1714
1715                        if (opts.fixed && F.defaults.fixed) {
1716                                this.overlay.addClass('fancybox-overlay-fixed');
1717
1718                                this.fixed = true;
1719                        }
1720                },
1721
1722                open : function(opts) {
1723                        var that = this;
1724
1725                        opts = $.extend({}, this.defaults, opts);
1726
1727                        if (this.overlay) {
1728                                this.overlay.unbind('.overlay').width('auto').height('auto');
1729
1730                        } else {
1731                                this.create(opts);
1732                        }
1733
1734                        if (!this.fixed) {
1735                                W.bind('resize.overlay', $.proxy( this.update, this) );
1736
1737                                this.update();
1738                        }
1739
1740                        if (opts.closeClick) {
1741                                this.overlay.bind('click.overlay', function(e) {
1742                                        if ($(e.target).hasClass('fancybox-overlay')) {
1743                                                if (F.isActive) {
1744                                                        F.close();
1745                                                } else {
1746                                                        that.close();
1747                                                }
1748
1749                                                return false;
1750                                        }
1751                                });
1752                        }
1753
1754                        this.overlay.css( opts.css ).show();
1755                },
1756
1757                close : function() {
1758                        var scrollV, scrollH;
1759
1760                        W.unbind('resize.overlay');
1761
1762                        if (this.el.hasClass('fancybox-lock')) {
1763                                $('.fancybox-margin').removeClass('fancybox-margin');
1764
1765                                scrollV = W.scrollTop();
1766                                scrollH = W.scrollLeft();
1767
1768                                this.el.removeClass('fancybox-lock');
1769
1770                                W.scrollTop( scrollV ).scrollLeft( scrollH );
1771                        }
1772
1773                        $('.fancybox-overlay').remove().hide();
1774
1775                        $.extend(this, {
1776                                overlay : null,
1777                                fixed   : false
1778                        });
1779                },
1780
1781                // Private, callbacks
1782
1783                update : function () {
1784                        var width = '100%', offsetWidth;
1785
1786                        // Reset width/height so it will not mess
1787                        this.overlay.width(width).height('100%');
1788
1789                        // jQuery does not return reliable result for IE
1790                        if (IE) {
1791                                offsetWidth = Math.max(document.documentElement.offsetWidth, document.body.offsetWidth);
1792
1793                                if (D.width() > offsetWidth) {
1794                                        width = D.width();
1795                                }
1796
1797                        } else if (D.width() > W.width()) {
1798                                width = D.width();
1799                        }
1800
1801                        this.overlay.width(width).height(D.height());
1802                },
1803
1804                // This is where we can manipulate DOM, because later it would cause iframes to reload
1805                onReady : function (opts, obj) {
1806                        var overlay = this.overlay;
1807
1808                        $('.fancybox-overlay').stop(true, true);
1809
1810                        if (!overlay) {
1811                                this.create(opts);
1812                        }
1813
1814                        if (opts.locked && this.fixed && obj.fixed) {
1815                                if (!overlay) {
1816                                        this.margin = D.height() > W.height() ? $('html').css('margin-right').replace("px", "") : false;
1817                                }
1818
1819                                obj.locked = this.overlay.append( obj.wrap );
1820                                obj.fixed  = false;
1821                        }
1822
1823                        if (opts.showEarly === true) {
1824                                this.beforeShow.apply(this, arguments);
1825                        }
1826                },
1827
1828                beforeShow : function(opts, obj) {
1829                        var scrollV, scrollH;
1830
1831                        if (obj.locked) {
1832                                if (this.margin !== false) {
1833                                        $('*').filter(function(){
1834                                                return ($(this).css('position') === 'fixed' && !$(this).hasClass("fancybox-overlay") && !$(this).hasClass("fancybox-wrap") );
1835                                        }).addClass('fancybox-margin');
1836
1837                                        this.el.addClass('fancybox-margin');
1838                                }
1839
1840                                scrollV = W.scrollTop();
1841                                scrollH = W.scrollLeft();
1842
1843                                this.el.addClass('fancybox-lock');
1844
1845                                W.scrollTop( scrollV ).scrollLeft( scrollH );
1846                        }
1847
1848                        this.open(opts);
1849                },
1850
1851                onUpdate : function() {
1852                        if (!this.fixed) {
1853                                this.update();
1854                        }
1855                },
1856
1857                afterClose: function (opts) {
1858                        // Remove overlay if exists and fancyBox is not opening
1859                        // (e.g., it is not being open using afterClose callback)
1860                        //if (this.overlay && !F.isActive) {
1861                        if (this.overlay && !F.coming) {
1862                                this.overlay.fadeOut(opts.speedOut, $.proxy( this.close, this ));
1863                        }
1864                }
1865        };
1866
1867        /*
1868         *      Title helper
1869         */
1870
1871        F.helpers.title = {
1872                defaults : {
1873                        type     : 'float', // 'float', 'inside', 'outside' or 'over',
1874                        position : 'bottom' // 'top' or 'bottom'
1875                },
1876
1877                beforeShow: function (opts) {
1878                        var current = F.current,
1879                                text    = current.title,
1880                                type    = opts.type,
1881                                title,
1882                                target;
1883
1884                        if ($.isFunction(text)) {
1885                                text = text.call(current.element, current);
1886                        }
1887
1888                        if (!isString(text) || $.trim(text) === '') {
1889                                return;
1890                        }
1891
1892                        title = $('<div class="fancybox-title fancybox-title-' + type + '-wrap">' + text + '</div>');
1893
1894                        switch (type) {
1895                                case 'inside':
1896                                        target = F.skin;
1897                                break;
1898
1899                                case 'outside':
1900                                        target = F.wrap;
1901                                break;
1902
1903                                case 'over':
1904                                        target = F.inner;
1905                                break;
1906
1907                                default: // 'float'
1908                                        target = F.skin;
1909
1910                                        title.appendTo('body');
1911
1912                                        if (IE) {
1913                                                title.width( title.width() );
1914                                        }
1915
1916                                        title.wrapInner('<span class="child"></span>');
1917
1918                                        //Increase bottom margin so this title will also fit into viewport
1919                                        F.current.margin[2] += Math.abs( getScalar(title.css('margin-bottom')) );
1920                                break;
1921                        }
1922
1923                        title[ (opts.position === 'top' ? 'prependTo'  : 'appendTo') ](target);
1924                }
1925        };
1926
1927        // jQuery plugin initialization
1928        $.fn.fancybox = function (options) {
1929                var index,
1930                        that     = $(this),
1931                        selector = this.selector || '',
1932                        run      = function(e) {
1933                                var what = $(this).blur(), idx = index, relType, relVal;
1934
1935                                if (!(e.ctrlKey || e.altKey || e.shiftKey || e.metaKey) && !what.is('.fancybox-wrap')) {
1936                                        relType = options.groupAttr || 'data-fancybox-group';
1937                                        relVal  = what.attr(relType);
1938
1939                                        if (!relVal) {
1940                                                relType = 'rel';
1941                                                relVal  = what.get(0)[ relType ];
1942                                        }
1943
1944                                        if (relVal && relVal !== '' && relVal !== 'nofollow') {
1945                                                what = selector.length ? $(selector) : that;
1946                                                what = what.filter('[' + relType + '="' + relVal + '"]');
1947                                                idx  = what.index(this);
1948                                        }
1949
1950                                        options.index = idx;
1951
1952                                        // Stop an event from bubbling if everything is fine
1953                                        if (F.open(what, options) !== false) {
1954                                                e.preventDefault();
1955                                        }
1956                                }
1957                        };
1958
1959                options = options || {};
1960                index   = options.index || 0;
1961
1962                if (!selector || options.live === false) {
1963                        that.unbind('click.fb-start').bind('click.fb-start', run);
1964
1965                } else {
1966                        D.undelegate(selector, 'click.fb-start').delegate(selector + ":not('.fancybox-item, .fancybox-nav')", 'click.fb-start', run);
1967                }
1968
1969                this.filter('[data-fancybox-start=1]').trigger('click');
1970
1971                return this;
1972        };
1973
1974        // Tests that need a body at doc ready
1975        D.ready(function() {
1976                var w1, w2;
1977
1978                if ( $.scrollbarWidth === undefined ) {
1979                        // http://benalman.com/projects/jquery-misc-plugins/#scrollbarwidth
1980                        $.scrollbarWidth = function() {
1981                                var parent = $('<div style="width:50px;height:50px;overflow:auto"><div/></div>').appendTo('body'),
1982                                        child  = parent.children(),
1983                                        width  = child.innerWidth() - child.height( 99 ).innerWidth();
1984
1985                                parent.remove();
1986
1987                                return width;
1988                        };
1989                }
1990
1991                if ( $.support.fixedPosition === undefined ) {
1992                        $.support.fixedPosition = (function() {
1993                                var elem  = $('<div style="position:fixed;top:20px;"></div>').appendTo('body'),
1994                                        fixed = ( elem[0].offsetTop === 20 || elem[0].offsetTop === 15 );
1995
1996                                elem.remove();
1997
1998                                return fixed;
1999                        }());
2000                }
2001
2002                $.extend(F.defaults, {
2003                        scrollbarWidth : $.scrollbarWidth(),
2004                        fixed  : $.support.fixedPosition,
2005                        parent : $('body')
2006                });
2007
2008                //Get real width of page scroll-bar
2009                w1 = $(window).width();
2010
2011                H.addClass('fancybox-lock-test');
2012
2013                w2 = $(window).width();
2014
2015                H.removeClass('fancybox-lock-test');
2016
2017                $("<style type='text/css'>.fancybox-margin{margin-right:" + (w2 - w1) + "px;}</style>").appendTo("head");
2018        });
2019
2020}(window, document, jQuery));
Note: See TracBrowser for help on using the repository browser.