(function() {

    DS.getPublishedPhotosByGallery = function(config, callback) {
        DS.doAjaxPost("Data.asmx/GetPagedLatestPublishedPhotos", {
            startIndex: config.page,
            pageSize: config.pageSize,
            CatId: config.CatId
        }, callback);
    };

    var PhotoGallery = function(element, config) {
        element = $(element);
        var obj = this;
        this.config = $.extend({
            page: 0,
            scroll: 0,
            pageSize: 4,
            enlargeView: element.find(".enlarge-view"),
            listing: element.find(".listing"),
            loadingTop: element.find(".enlarge-view .loading")
        }, config);
        var co = this.config;

        this.init = function() {
            var co = obj.config;
            co.width = 115;
            co.height = 75;
            obj.attachEvent();
            obj.displayDefault();
            co.listing.find(".pnext").click(function(ev) {
                $(obj).trigger("next");
                ev.preventDefault();
            });
            co.listing.find(".pprev").click(function(ev) {
                $(obj).trigger("previous");
                ev.preventDefault();
            });
        };

        this.displayDefault = function() {
            var slug;
            var location = window.location.href.indexOf("#");
            var co = obj.config;

            if (location !== -1) { slug = window.location.href.substring(location);  }
            if (slug) { co.photoId = parseInt(slug.replace("#", ""));}
            if (slug) {
                var o = co.listing.find("ul li a[itemId=" + slug.replace("#", "") + "]");
                if (o.length > 0) { o.trigger("click"); }
                
            }
        };

        this.attachEvent = function() {
            co.listing.find("ul li a").unbind("click").click(function(ev) {
                var img = new Image();
                co.enlargeView.addClass("loading");
                co.enlargeView.find("img").remove();
                $(img).attr("src", $(this).find("img").attr("src").replace("109", "505").replace("75", "364")).hide();
                $(img).load(function() {
                    $(this).fadeIn(2000);
                    co.enlargeView.removeClass("loading");
                });
                co.enlargeView.append(img);
                ev.preventDefault();
            });
        };

        this.scroll = function() {
            var multiplier = -1;
            var itemWidth = co.listing.find("ul li:eq(0)").outerWidth();
            var scrollLength = (co.page) * itemWidth * multiplier;
            if (co.isArabic) {
                co.listing.find("ul").animate({ right: scrollLength });
            } else {
                co.listing.find("ul").animate({ left: scrollLength });
            }
        };

        $(this).bind("next", function() {
            var co = obj.config;
            co.photoId = null;
            var onLastPage = co.listing.find("ul li").length == Math.abs(co.page) + 1;

            if (co.listing.find("ul li.last-item").length === 0 && onLastPage) {
                co.page++;
                var li = $(document.createElement("li"));
                var itemWidth = co.listing.find("ul li:eq(0)").outerWidth();
                co.listing.find("ul").append(li).css("width", co.listing.find("ul li").length * itemWidth);
                obj.scroll();

                setTimeout(function() {
              
                    DS.getPublishedPhotosByGallery(co, function(data) {

                        for (var i = 0; i < data.length; i++) {
                            if (data[i].isLastItem) { li.addClass("last-item"); }
                            li.append("<a href=\"photo-gallery.aspx#" + data[i].id + "\" itemId=\"" + data[i].id + "\" " + (i == data.length - 1 ? "class=\"no-margin\"" : "") + "><img src=\"GetImage.aspx?file=" + data[i].imageUrl + "&width=109&height=75&crop=true\" /></a>");
                        }
                       
                        obj.attachEvent();
                    });
                }, 600);
            } else {
                if (!onLastPage) {
                    co.page++;
                    obj.scroll();
                }
            }
            return false;
        });

        $(this).bind("previous", function() {
            if (co.page > 0) {
                co.page--;
                obj.scroll();
            }
            return false;
        });
    };
    $.fn.photoGallery = function(config) {
        return this.each(function() {
            var photoGallery = new PhotoGallery(this, config);
            photoGallery.init();
        });
    };
})(jQuery);