comparison static/js/fancybox2/source/jquery.fancybox.js @ 106:846cda22d77c

Bootstrap: Photo pages reworked.
author Brian Neal <bgneal@gmail.com>
date Fri, 18 Oct 2013 20:31:36 -0500
parents
children
comparison
equal deleted inserted replaced
105:afcbfe23f068 106:846cda22d77c
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));