﻿/*
    jqPicasaSlideshow - (c) 2010 - Emil Müller
    http://ize.webhop.net/home/jquery-plugins/jqpicasaslideshow
	Released under the GPL License
	http://www.gnu.org/licenses/gpl-3.0.txt
	
	requires:
	- jQuery 1.4.x
	
	optional:
	- jqCurtainsTransition.js (required if you'd like to use transition: 'curtains')
*/
(function($) {

    $.fn.PicasaSlideshow = function(settings) {
        var config = {
            //AlbumRSS: 'http://picasaweb.google.com/data/feed/base/user/izemanNL/albumid/5122324011051876481?alt=rss&kind=photo&hl=en_US',
			AlbumRSS: 'http://picasaweb.google.com/data/feed/base/user/101623518491206431568/albumid/5658844590608503137?alt=rss&kind=photo&authkey=Gv1sRgCOLJ2KynlrLZgQE&hl=da',
            width: 310,
            height: 220,
            interval: 3500,
            showTitle: false,
            shuffle: true,
            linkToOriginal: false,
            customLink: null,
            transition: 'fadeInOut' // fadeInOut - standard jquery fadein/fadeout, curtains - curtains transition (requires jqCurtainsTransition.js)
        };
        //var albumFeed;
        //var index = -1;
        //var imgWidth = 72;
        //var titleTimeout = -1;

        if (settings) $.extend(config, settings);

        ImageInfo = function(title, src, url) {
            this.title = title;
            this.src = src;
            this.url = url;
        }

        init = function(el) {
        	$(el).data("config", config);
        	$(el).data("index", -1);
        	$(el).data("imgWidth", "72");
        	$(el).data("titleTimeout", -1);
        	
            setupMainContainer(el);

            setupLoader(el);

            setupImagesContainer(el);
            setupTitleContainer(el);

            initImageWidth(el);

            setupEvents(el);

            loadAlbum(el);
        }

        setupMainContainer = function(el) {
            $(el).css({ 'width': $(el).data("config").width + 'px', 'height': $(el).data("config").height + 'px', 'overflow': 'hidden', 'position': 'relative' });
        }

        setupLoader = function(el) {
            var loader = $("<img />").attr("id", "loader").attr("src", "http://www.ajaxload.info/download.php?img=cache/00/00/00/09/3A/89/38-1.gif");
            loader.css({ 'top': '48%', 'left': '48%', 'position': 'absolute' });
            $(el).append(loader);
        }

        setupTitleContainer = function(el) {
            var titleContainer = $("<div />").attr("id", "titleContainer").attr("data-hidden", "true");
            titleContainer.css({ 'width': $(el).data("config").width + 'px', 'height': '20px', 'position': 'absolute', 'left': '0px', 'top': '-20px', 'overflow': 'hidden' });

            titleContainer.append($("<div />").attr("id", "label"));
            $(el).append(titleContainer);
        }

        setupImagesContainer = function(el) {
            var imagesContainer = $("<div />").attr("id", "imagesContainer");
            imagesContainer.css({ 'width': $(el).data("config").width + 'px', 'height': $(el).data("config").height + 'px', 'overflow': 'hidden', 'position': 'absolute', 'top': '0px', 'left': '0px' });
            $(el).append(imagesContainer);
        }

        initImageWidth = function(el) {
            if ($(el).data("config").width >= 72) $(el).data("imgWidth", "72");
            if ($(el).data("config").width >= 160) $(el).data("imgWidth", "320");
            if ($(el).data("config").width >= 320) $(el).data("imgWidth", "320");
            if ($(el).data("config").width >= 400) $(el).data("imgWidth", "400");
            if ($(el).data("config").width >= 640) $(el).data("imgWidth", "640");
            if ($(el).data("config").width >= 800) $(el).data("imgWidth", "800");
            if ($(el).data("config").width >= 1024) $(el).data("imgWidth", "1024");
            if ($(el).data("config").width >= 1280) $(el).data("imgWidth", "1280");
            if ($(el).data("config").width >= 1440) $(el).data("imgWidth", "1440");
            if ($(el).data("config").width >= 1600) $(el).data("imgWidth", "1600");
        }

        setupEvents = function(el) {
            $(el).mouseenter(function() { clearTimeout($(el).data("titleTimeout")); showTitleContainer(el); });
            $(el).mouseleave(function() { hideTitleContainer(el); });
        }

        loadAlbum = function(el) {
        	
        	
        	
            //replace alt param with json-in-script
            var url = $(el).data("config").AlbumRSS.replace("alt=rss", "alt=json-in-script");
            url += "&callback=?";
            
            $.getJSON(url, function(data) {
            	$(el).data("albumfeed", data.feed);
            	
                //albumFeed = data.feed;
                $("#loader", $(el)).remove();

                if ($(el).data("config").shuffle) fisherYates($(el).data("albumfeed").entry); //shuffle array

                switchSlide(el);
            });
            

        }

        getNextImage = function(el) {
        	var index = $(el).data("index");
            index++;
            if (index >= $(el).data("albumfeed").entry.length) index = 0;
            $(el).data("index", index);
            
            return new ImageInfo($(el).data("albumfeed").entry[index].title.$t,
            		$(el).data("albumfeed").entry[index].media$group.media$thumbnail[0].url.replace(/\/s72\//g, "/s" + $(el).data("imgWidth") + "/"),
            		$(el).data("albumfeed").entry[index].media$group.media$content[0].url);
        }

        switchSlide = function(el) {
        	
            var nextImg = getNextImage(el);            
            $('<img />')
  	        .attr('id', "nextImg_"+$(el).attr('id'))
            .attr('src', nextImg.src)
            .load(function() {
                if ($('#imagesContainer .picasaitem', $(el)).length > 0) {
                    $('#imagesContainer .picasaitem:eq(0) div', $(el)).attr("id", "oldImg");

                }
                newDiv = $('<div />').attr('class', 'picasaitem').css({ 'width': $(el).width() + 'px', 'height': $(el).height() + 'px',
                    'margin-left': -($(el).width() / 2) + 'px',
                    'margin-top': -($(el).height() / 2) + 'px',
                    'position': 'absolute',
                    'top': '50%',
                    'left': '50%'
                });
                $("#imagesContainer", $(el)).append(newDiv);
                newDiv.append($(this));

                if ($(el).data("config").linkToOriginal && $(el).data("config").customlink==null) {
                    $('#imagesContainer .picasaitem').css("cursor", "pointer");
                    newDiv.click(function() {
                        window.open(nextImg.url);
                    });
                }
                
                if ($(el).data("config").customlink != null)
                {
                	//parse the custom link and replace the pattern
                	//eg. http://www.foo.bar/details.php?id={title}
                	var link = $(el).data("config").customlink.replace("{title}", nextImg.title);
                	nextImg.url = link;
                	$('#imagesContainer .picasaitem').css("cursor", "pointer");
                    newDiv.click(function() {
                        location.href = nextImg.url;
                    });
                }
                
                newDiv.hide();
                if ($(el).data("config").transition == 'fadeInOut') {
                    newDiv.fadeIn("slow", function() {
                        //set caption
                        $("#titleContainer #label", $(el)).text(nextImg.title);
                        //showcaption for a moment	        
                        if (showTitleContainer(el))
                        {
                        	clearTimeout($(el).data("titleTimeout"));
                        	$(el).data("titleTimeout", setTimeout(function() { hideTitleContainer(el); }, 5000));
                        }

                        if ($("#imagesContainer .picasaitem", $(el)).length > 1)
                            $("#imagesContainer .picasaitem:eq(0)", $(el)).fadeOut("normal", function() { $(this).remove(); });

                        setTimeout(function() { switchSlide(el); }, $(el).data("config").interval);
                    });
                } else {
                    newDiv.fadeIn("normal");
                    $(this).CurtainsTransition({ effect: 'random' }, function() {

                        //set caption
                        $("#titleContainer #label", $(el)).text(nextImg.title);
                        //showcaption for a moment	        
                        if (showTitleContainer(el))
                        {
                        	clearTimeout($(el).data("titleTimeout"));
                        	$(el).data("titleTimeout", setTimeout(function() { hideTitleContainer(el); }, 5000));
                        }
                        if ($("#imagesContainer .picasaitem", $(el)).length > 1)
                            $("#imagesContainer .picasaitem:eq(0)", $(el)).fadeOut("normal", function() { $(this).remove(); });

                        setTimeout(function() { switchSlide(el); }, $(el).data("config").interval);
                    });
                }

            });
        }

        showTitleContainer = function(el) {        	
            if (!$(el).data("config").showTitle) return false;
            if ($("#titleContainer", $(el)).attr("data-hidden") == "false") return false;
            $("#titleContainer", $(el)).animate({ 'top': '0px' });
            $("#titleContainer", $(el)).attr("data-hidden", "false");            
            return true;
        }

        hideTitleContainer = function(el) {
            if ($("#titleContainer", $(el)).attr("data-hidden") == "true") return;
            $("#titleContainer", $(el)).animate({ 'top': '-20px' });
            $("#titleContainer", $(el)).attr("data-hidden", "true");
        }

        fisherYates = function(myArray) {
            var i = myArray.length;
            if (i == 0) return false;
            while (--i) {
                var j = Math.floor(Math.random() * (i + 1));
                var tempi = myArray[i];
                var tempj = myArray[j];
                myArray[i] = tempj;
                myArray[j] = tempi;
            }
        }

        this.each(function() {
            init(this);
        });

        return this;
    };

})(jQuery);


