// If we set this to be too wide, then in the event 
	// of a portrait-orientation photo, it'll look distorted
	debug = false;
	
	// Set the arguments			
	var faboalbum_args = {
		outer_id: "faboalbum_outer_container",
		display_id: "mod_faboalbum_images",
		prev_id: "faboalbum_prev",
		next_id: "faboalbum_next",
		enlarge_id: "faboalbum_enlarge",
		url: base_url + "index2.php?option=com_faboalbum",
		debug: debug
	};
	
	var faboalbum_photos;
	
dojo.addOnLoad(function() {
	// Create a new instance of faboalbum.cycle
	faboalbum_photos = new faboalbum.cycle(faboalbum_args);
	
	// Get the POST data
	dojo.xhrPost( {
		url: faboalbum_args.url,
		handleAs: "json",
		load: function (response, ioArgs) { 
			// Process the response and populate faboalbum_data_array with the facebook objects
			successful_process = faboalbum_photos.process_facebook_information(response, ioArgs);
			if (successful_process) { // means no errors in sending and receiving the ajax data 
				// Set the dimensions
				faboalbum_photos.set_dimensions();
				// Display the first photo
				faboalbum_photos.display_photo(0);
				// Set up the event handlers
				dojo.connect(faboalbum_photos._prev_node, 'onclick', function(evt) { faboalbum_photos._prev_next_handler("prev"); } );
				dojo.connect(faboalbum_photos._next_node, 'onclick', function(evt) { faboalbum_photos._prev_next_handler("next"); } );
				// Display the selection button only if more than 1 photo
				if (response.enabled_albums_count > 1) {
					dojo.style("faboalbum_select_outer", "display", "block");
					dojo.connect(dojo.byId("faboalbum_select_outer"), "onclick", function(evt) {
						// assume each image takes up 40 px
						var height = response.enabled_albums_count * 40;
						// maximum height for the Shadowbox that we allow is 200 (5 images)
						if (height > 200) {
							height = 200;
						}
						Shadowbox.open({
					       	title:      'Select Album',
					       	type:       'html',
					       	content:    response.enabled_albums_table,
					   	 	height:     height,
					  	  	width:      350
   						 });
					});
					
				}
			}
			return response;
		},
		content: {
			no_html: "1",
			format: "raw"
		}
	});	
});

dojo.declare("faboalbum.cycle", null, {

	_faboalbum_data_array: null,
	dimensions: null,
	_error_output_node: null,
	_display_node: null,
	_prev_node: null,
	_next_node: null,
	_enlarge_node: null,
	_url: "",
	_debug: false,
	_enlarge_text: "",
			
	//constructor : function(display_node, error_output_node, prev_node, next_node) {
	constructor : function(faboalbum_args) {
		this._error_output_node = dojo.byId(faboalbum_args.outer_id);	
		this._display_node = dojo.byId(faboalbum_args.display_id);
		this._prev_node = dojo.byId(faboalbum_args.prev_id);
		this._next_node = dojo.byId(faboalbum_args.next_id);
		this._enlarge_node = dojo.byId(faboalbum_args.enlarge_id);
		this._enlarge_text = dojo.byId(faboalbum_args.enlarge_id).innerHTML;
		this._url = faboalbum_args.url;
		this._debug = faboalbum_args.debug;
		
		// Get and set dimensions
		this.set_dimensions(this._error_output_node, this._display_node);
		// Initialize shadowbox
		Shadowbox.init({listenOverlay:	false});
	},
	
	
	// Get the width of the containing div (reference_container), and then sets the width and height of the internal (displaying) div accordingly, and returns 
	// the set width and height
	set_dimensions : function($height) { // example "faboalbum_outer_container", "mod_faboalbum_photos"
		// Get the width and height of the containing(external) div
		var div_width = dojo.coords(this._error_output_node).w;
		var div_height = $height; // we don't set height
		
		// Set the height of the displaying div so it's not collapsed, so we can see the ajax-loading.gif
		//this._display_node.style.height = div_height + "px";
		// do this only for non-IE, else IE will complain of an error.
		if (!dojo.isIE) {
			dojo.style("mod_faboalbum_images", "height", div_height + "px");
		}

		if(this._debug) console.log("width and height: " + div_width + div_height);	

		this.dimensions = {width: div_width, height: div_height};
	},
	
	// This function will process the information that is retrieved via ajax.
	// It will also populate the global array faboalbum_data_array with the facebook data objects.
	// This function returns true if there are facebook information, and false if none.
	process_facebook_information : function(response, ioArgs) {
		if (response.error != 0) {
			this._error_output_node.innerHTML = response.error_msg;
			return false;
		}
		var data = response.data;
		for (i=0; i<data.length; i++) {
			if(this.debug) console.log(data[i].url);
		}
		
		// Show the Prev and Next if data.length > 1
		if (data.length > 1) {
			dojo.style(this._prev_node.parentNode, "display", "block");
		}
		else {
			dojo.style(this._prev_node.parentNode, "display", "none")
		}
	
		// Place the facebook data (which are objects) inside a global array 
		this._faboalbum_data_array = data;
		return true;
	},
	
	// This function will display the first photo in the global array faboalbum_data_array initially.
	// It also sets up faboalbum_enlarge.
	// It also sets up the Prev and Next hrefs to enable cycling
	display_photo : function(photo_number_to_show) {
		
		photo_number_to_show = parseInt(photo_number_to_show);
		photo_to_be_shown = this._faboalbum_data_array[photo_number_to_show].src_big;
		photo_caption = "";
		photo_caption = this._faboalbum_data_array[photo_number_to_show].caption;
		if(this._debug) console.log("photo number to show: " + photo_number_to_show);
		var div_width = this.dimensions.width;
		var div_height = this.dimensions.height;
		var photo_html = '<a id="faboalbum_current_photo_enlarge_href" href="' + photo_to_be_shown + '" rel="shadowbox" title="' + photo_caption + '"><img id="faboalbum_current_photo" src="' + photo_to_be_shown + '" style="width:' + div_width + 'px; height: auto" faboalbum_photo_number="' + photo_number_to_show + '"></a>';
		var current_instance = this;
		
		// Fade the faboalbum_current_photo out first
		if (dojo.byId("faboalbum_current_photo") != null ) { // check if node exists (required as first image won't have this node when page first starts up
			var a = dojo.fadeOut({node: "faboalbum_current_photo", duration: 300});			
			
			// set what to do after fadeOut
			dojo.connect(a, "onEnd", function(){
				current_instance._display_node.innerHTML = photo_html;			
				Shadowbox.setup(	dojo.byId("faboalbum_current_photo_enlarge_href"), 
				{						
					handleLgImages: "resize"
				});
				
				// set what to do after the new pic has been loaded
				dojo.connect(dojo.byId("faboalbum_current_photo"), "onload", function(e) {
					// For slow connections, the image may overrun the containing div. So we have to set the height.
					current_instance.set_dimensions(dojo.coords("faboalbum_current_photo", false).h);
					dojo.fadeIn({node: "faboalbum_current_photo", duration: 300}).play();
				});
				
			});
			a.play();
			
			
		}
		else {
			// Write out the facebook photo html
			this._display_node.innerHTML = photo_html;
			
			// Set up shadowbox for enlarging
			Shadowbox.setup(	dojo.byId("faboalbum_current_photo_enlarge_href"), 
			{						
				handleLgImages: "resize"
	       	});
		}
			
		// set what to do after the new pic has been loaded
		dojo.connect(dojo.byId("faboalbum_current_photo"), "onload", function(e) {
			// For slow connections, the image may overrun the containing div. So we have to set the height.
			current_instance.set_dimensions(dojo.coords("faboalbum_current_photo", false).h);
			dojo.fadeIn({node: "faboalbum_current_photo", duration: 300}).play();
		});
		
		if(this._debug) console.log("number: " + photo_number_to_show);
	},
	
	// Stub: Event handler when Prev is clicked
	_prev_handler : function() {
		this._prev_next_handler("prev");
	},
	
	// Stub: Event handler when Next is clicked
	_next_handler : function() {
		this._prev_next_handler("next");
	},
	
	// Actual Event handler for Prev and Next 
	_prev_next_handler : function(prev_or_next) {
		if ( (prev_or_next != "prev") && (prev_or_next != "next") ) {
			if(this._debug) console.log("Neither prev or next");
			return false;
		}
		// Get current photo number
		var current_photo_number = dojo.attr(dojo.byId("faboalbum_current_photo"), "faboalbum_photo_number");
		if(this._debug) console.log("Current photo showing: " + current_photo_number);
		// Increment by 1 to get next photo number
		if (prev_or_next == "prev") {
			photo_number_to_show = parseInt(current_photo_number) - 1;
			// Check if it's out of range 
			// If out of range, show the last photo (faboalbum_data_array.length)
			if (photo_number_to_show < 0) {
				photo_number_to_show = this._faboalbum_data_array.length - 1;
			}
		}
		else {
			photo_number_to_show = parseInt(current_photo_number) + 1;
			// Check if it's out of range (compare against faboalbum_data_array.length)
			// If out of range, show the first photo
			if (photo_number_to_show > (this._faboalbum_data_array.length - 1)) {
				photo_number_to_show = 0;
			}
		}
		
		// Call faboalbum_display_photo
		this.display_photo(photo_number_to_show);	
	}
	
});


// function that is called when user chooses and clicks on an album in shadowbox
function switch_album(aid) {
	Shadowbox.close();
	
		// Get the POST data
	dojo.xhrPost( {
		url: faboalbum_args.url,
		handleAs: "json",
		content: {
			no_html: "1",
			format: "raw",
			"single_album_aid": aid
		},
		load: function (response, ioArgs) { 
			// Process the response and populate faboalbum_data_array with the facebook objects
			successful_process = faboalbum_photos.process_facebook_information(response, ioArgs);
			if (successful_process) { // means no errors in sending and receiving the ajax data 
				faboalbum_photos.process_facebook_information(response, ioArgs);
				faboalbum_photos.display_photo(0);
			}
		}
	});
}