/*!
 * NextGEN Slideshow based on jQuery Cycle Plugin
 * Copyright (c) 2010 Alex Rabe
 * Version: 1.0.3
 * Requires: jQuery v1.2.6 or later
 */
jQuery.fn.nggSlideshow = function ( args ) { 
    
    var defaults = { id:    1,
                     width: 320,
                     height: 240,
                     fx: 	'fade',
                     domain: '',
                     timeout: 4000 };
                     
    var s = jQuery.extend( {}, defaults, args);
    
    var obj = this.selector;
	// initialize counters for the description and title arrays
	var descripnum = 0;
	var titlenum = 0;
	// initialize vars to hold the arrays
	var title = [];
	var descrip = [];
    var stack = [];
    var url = s.domain + 'index.php?callback=json&api_key=true&format=json&method=gallery&id=' + s.id
    // alert(url);
	
    jQuery.getJSON(url, function(r){
        
		
		if (r.stat == "ok"){
            
            for (img in r.images) {
				var photo = r.images[img];
                //populate images into an array
                stack.push( decodeURI( photo['imageURL'] ) );
				//populate titles descriptions into arrays
				descrip.push( decodeURI( photo['description'] ) );
				title.push( decodeURI( photo['alttext'] ) );
            }

            // push the first three images out
            var i = 1;

            while (stack.length && i <= 3) {
                var img = new Image(); 
                img.src = stack.shift();
                // Hide them first, Cycle plugin will show them
                jQuery( img ).hide(); 
                // Add the image now and resize after loaded
                jQuery( obj ).append( imageResize(img, s.width , s.height) );
                i++;
                // start cycle after the third image
                if (i == 3 || stack.length == 0 )
                    startSlideshow();  
            }
            
		}
	});

    function startSlideshow() {

		//show the first description and title from the descrip and title arrays
		var descripwrite = (descrip[descripnum]);
		document.getElementById("info").innerHTML = descripwrite;
		var titlewrite = (title[titlenum]);
		document.getElementById("title").innerHTML = titlewrite;

		
        // hide the loader icon
    	jQuery( obj + '-loader' ).empty().remove();
        // Start the slideshow
        jQuery(obj + ' img:first').fadeIn(1000, function() {
       	    // Start the cycle plugin
        	jQuery( obj ).cycle( {
        		fx: 	s.fx,
                containerResize: 1,
                fit: 1,
                timeout: 3200,
                next:   obj,
                before: jCycle_onBefore

        	});
        });
        
    }

    //Resize Image and keep ratio on client side, better move to server side later
    function imageResize(img, maxWidth , maxHeight) {

        // we need to wait until the image is loaded
        if ( !img.complete )
            jQuery( img ).bind('load', function() { imageResize(img, maxWidth , maxHeight) });

        // in some cases the image is not loaded, we can't resize them
        if (img.height == 0 || img.width == 0)
            return img;
 
        var height = (img.height < maxHeight) ? img.height : maxHeight;
       	var width  = (img.width  < maxWidth)  ? img.width  : maxWidth;
        if (img.height >= img.width)
        	width = Math.floor( Math.ceil(img.width / img.height * maxHeight) );
        else
        	height = Math.floor( Math.ceil(img.height / img.width * maxWidth) );
  
        jQuery( img ).css({
          'height': height,
          'width': width
        });
                
        return img;
	};

    // add images to slideshow step by step
    function jCycle_onBefore(curr, next, opts) {
	
				//initialize vars for array lengths and current array rows
				var descriplength = (descrip.length - 1)
				var titlelength = (title.length - 1)
				var descripwrite = (descrip[descripnum]);
				var titlewrite = (title[titlenum]);
				
				//write to divs in the html
				document.getElementById("info").innerHTML = descripwrite;
				document.getElementById("title").innerHTML = titlewrite;
				
				// increment so that we grab the correct information, back to zero when the end of the array is reached
				if (descripnum < descriplength){
				titlenum +=1;
				descripnum += 1; }
				else {
				titlenum = 0;
				descripnum = 0;
				}
	
        if (opts.addSlide)
            if (stack.length) {
	
                var img = new Image(); 
                img.src = stack.shift();
                jQuery( img ).bind('load', function() {
                    opts.addSlide( imageResize(this, s.width , s.height) );                     
                });
            }
    }; 
}