adblockpluschrome: Open share page in lightbox

fancybox/source/helpers/jquery.fancybox-thumbs.js

+ /*!
+ * Thumbnail helper for fancyBox
+ * version: 1.0.7 (Mon, 01 Oct 2012)
+ * @requires fancyBox v2.0 or later
+ *
+ * Usage:
+ *     $(".fancybox").fancybox({
+ *         helpers : {
+ *             thumbs: {
+ *                 width  : 50,
+ *                 height : 50
+ *             }
+ *         }
+ *     });
+ *
+ */
+(function ($) {
+        //Shortcut for fancyBox object
+        var F = $.fancybox;
+
+        //Add helper object
+        F.helpers.thumbs = {
+                defaults : {
+                        width    : 50,       // thumbnail width
+                        height   : 50,       // thumbnail height
+                        position : 'bottom', // 'top' or 'bottom'
+                        source   : function ( item ) {  // function to obtain the URL of the thumbnail image
+                                var href;
+
+                                if (item.element) {
+                                        href = $(item.element).find('img').attr('src');
+                                }
+
+                                if (!href && item.type === 'image' && item.href) {
+                                        href = item.href;
+                                }
+
+                                return href;
+                        }
+                },
+
+                wrap  : null,
+                list  : null,
+                width : 0,
+
+                init: function (opts, obj) {
+                        var that = this,
+                                list,
+                                thumbWidth  = opts.width,
+                                thumbHeight = opts.height,
+                                thumbSource = opts.source;
+
+                        //Build list structure
+                        list = '';
+
+                        for (var n = 0; n < obj.group.length; n++) {
+                                list += '<li><a style="width:' + thumbWidth + 'px;height:' + thumbHeight + 'px;" href="javascript:jQuery.fancybox.jumpto(' + n + ');"></a></li>';
+                        }
+
+                        this.wrap = $('<div id="fancybox-thumbs"></div>').addClass(opts.position).appendTo('body');
+                        this.list = $('<ul>' + list + '</ul>').appendTo(this.wrap);
+
+                        //Load each thumbnail
+                        $.each(obj.group, function (i) {
+                                var href = thumbSource( obj.group[ i ] );
+
+                                if (!href) {
+                                        return;
+                                }
+
+                                $("<img />").load(function () {
+                                        var width  = this.width,
+                                                height = this.height,
+                                                widthRatio, heightRatio, parent;
+
+                                        if (!that.list || !width || !height) {
+                                                return;
+                                        }
+
+                                        //Calculate thumbnail width/height and center it
+                                        widthRatio  = width / thumbWidth;
+                                        heightRatio = height / thumbHeight;
+
+                                        parent = that.list.children().eq(i).find('a');
+
+                                        if (widthRatio >= 1 && heightRatio >= 1) {
+                                                if (widthRatio > heightRatio) {
+                                                        width  = Math.floor(width / heightRatio);
+                                                        height = thumbHeight;
+
+                                                } else {
+                                                        width  = thumbWidth;
+                                                        height = Math.floor(height / widthRatio);
+                                                }
+                                        }
+
+                                        $(this).css({
+                                                width  : width,
+                                                height : height,
+                                                top    : Math.floor(thumbHeight / 2 - height / 2),
+                                                left   : Math.floor(thumbWidth / 2 - width / 2)
+                                        });
+
+                                        parent.width(thumbWidth).height(thumbHeight);
+
+                                        $(this).hide().appendTo(parent).fadeIn(300);
+
+                                }).attr('src', href);
+                        });
+
+                        //Set initial width
+                        this.width = this.list.children().eq(0).outerWidth(true);
+
+                        this.list.width(this.width * (obj.group.length + 1)).css('left', Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5)));
+                },
+
+                beforeLoad: function (opts, obj) {
+                        //Remove self if gallery do not have at least two items
+                        if (obj.group.length < 2) {
+                                obj.helpers.thumbs = false;
+
+                                return;
+                        }
+
+                        //Increase bottom margin to give space for thumbs
+                        obj.margin[ opts.position === 'top' ? 0 : 2 ] += ((opts.height) + 15);
+                },
+
+                afterShow: function (opts, obj) {
+                        //Check if exists and create or update list
+                        if (this.list) {
+                                this.onUpdate(opts, obj);
+
+                        } else {
+                                this.init(opts, obj);
+                        }
+
+                        //Set active element
+                        this.list.children().removeClass('active').eq(obj.index).addClass('active');
+                },
+
+                //Center list
+                onUpdate: function (opts, obj) {
+                        if (this.list) {
+                                this.list.stop(true).animate({
+                                        'left': Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5))
+                                }, 150);
+                        }
+                },
+
+                beforeClose: function () {
+                        if (this.wrap) {
+                                this.wrap.remove();
+                        }
+
+                        this.wrap  = null;
+                        this.list  = null;
+                        this.width = 0;
+                }
+        }
+
+}(jQuery));