(function () {

	YAHOO.namespace("RMCGallery");

	// BEGIN PHOTOBOX SUBCLASS //
	YAHOO.widget.RMCPhotoBox = function(el, userConfig) {
		if (arguments.length > 0) {
			YAHOO.widget.RMCPhotoBox.superclass.constructor.call(this, el, userConfig);
		}
	};
	
	// Inherit from YAHOO.widget.Panel
	YAHOO.extend(YAHOO.widget.RMCPhotoBox, YAHOO.widget.Panel, {
	
	     // Define the CSS class for the PhotoBox
	     CSS_PHOTOBOX : "photobox",

	     // Define the HTML for the footer navigation
	     NAV_FOOTER_HTML : "<a id=\"$back.id\" href=\"javascript:void(null)\" class=\"back\"><img src=\"img/ybox-back.gif\" /></a><div id=\"$filename.id\" class=\"photobox-filename\"></div><a id=\"$next.id\" href=\"javascript:void(null)\" class=\"next\"><img src=\"img/ybox-next.gif\" /></a>",

		// Initialize the PhotoBox by setting up the footer navigation
		init : function(el, userConfig) {
			YAHOO.widget.RMCPhotoBox.superclass.init.call(this, el); 
			
			this.beforeInitEvent.fire(YAHOO.widget.RMCPhotoBox);

			YAHOO.util.Dom.addClass(this.innerElement, this.CSS_PHOTOBOX);
			
			if (userConfig) {
				this.cfg.applyConfig(userConfig, true);
			}
			
			this.setFooter(this.NAV_FOOTER_HTML.replace("$back.id",this.id+"_back").replace("$next.id",this.id+"_next").replace("$filename.id",this.id+"_filename"));
			
			this.renderEvent.subscribe(function() {
				var back = document.getElementById(this.id + "_back");
				var next = document.getElementById(this.id + "_next");
				var photobox = document.getElementById("photobox_content");

				YAHOO.util.Event.addListener(back, "mousedown", this.back, this, true);
				YAHOO.util.Event.addListener(next, "mousedown", this.next, this, true);
				YAHOO.util.Event.addListener(photobox, "click", this.navigate, this, true);

			}, this, true);

			this.initEvent.fire(YAHOO.widget.RMCPhotoBox);
		},

	// Set up the PhotoBox's "photos" property for setting up the list of photos
	initDefaultConfig : function() {
		YAHOO.widget.RMCPhotoBox.superclass.initDefaultConfig.call(this);
		
		this.cfg.addProperty("photos", { handler:this.configPhotos, suppressEvent:true });
	},

	// Handler executed when the "photos" property is modified
	configPhotos : function(type, args, obj) {
		var photos = args[0];

		if (photos) {
			this.images = [];

			if (! (photos instanceof Array)) {
				photos = [photos];
			}

			this.currentImage = 0;

			if (photos.length == 1) {
				this.footer.style.display = "none";
			}

			for (var p=0;p<photos.length;p++) {
				var photo = photos[p];
				var img = new Image();
				img.src = photo.src;
				img.title = photo.caption;
				img.id = this.id + "_img";
				//img.width = 500
				this.images[this.images.length] = img;
			}

			this.setImage(0);
		}
	},

	// Sets the current image displayed in the PhotoBox to the corresponding image in the photo dataset, 
	// and determines whether back and forward arrows should be diplsayed, based on the position in the dataset
	setImage : function(index) {
		var photos = this.cfg.getProperty("photos");

		if (photos) {
			if (! (photos instanceof Array)) {
				photos = [photos];
			}
			
			var back = document.getElementById(this.id + "_back");
			var next = document.getElementById(this.id + "_next");
			var img =  document.getElementById(this.id + "_img");
			var title = document.getElementById(this.id + "_title");
			var fileName = document.getElementById(this.id + "_filename");					

			this.currentImage = index;

			var current = this.images[index];
			
			var fn = current.src;
			fileName.innerHTML = fn.substr(fn.lastIndexOf('/')+1);

			var imgNode = document.createElement("IMG");
			imgNode.setAttribute("src",current.src);
			imgNode.setAttribute("title",current.title);
			//imgNode.setAttribute("width",500);
			imgNode.setAttribute("id",current.id);
			
			img.parentNode.replaceChild((this.browser == "safari"?imgNode:current), img);
			
			this.body.style.height = "auto";

			title.innerHTML = current.title;

			if (this.currentImage === 0) {
				back.style.display = "none";
			} else {
				back.style.display = "block";
			}

			if (this.currentImage === (photos.length-1)) {
				next.style.display = "none";
			} else {
				next.style.display = "block";
			}
		}
	},
	
	// Navigates to the next image
	navigate : function(e , matchedEl, container) {	
		if (typeof this.currentImage == 'undefined') {
			this.currentImage = 0;
		}
		
		if( e.clientX < matchedEl.element.offsetLeft + matchedEl.element.clientWidth/2) {
			if (this.currentImage > 0) {
				this.setImage(this.currentImage-1);
			}
		} else {
			if (this.currentImage < this.images.length - 1) {
				this.setImage(this.currentImage+1);
			}
		}
	},

	// Navigates to the next image
	next : function() {	
		if (typeof this.currentImage == 'undefined') {
			this.currentImage = 0;
		}

		this.setImage(this.currentImage+1);
	},

	// Navigates to the previous image
	back : function() {
		if (typeof this.currentImage == 'undefined') {
			this.currentImage = 0;
		}

		this.setImage(this.currentImage-1);
	},
	
	// Overrides the handler for the "modal" property with special animation-related functionality
	configModal : function(type, args, obj) {
		var modal = args[0];

		if (modal) {
			this.buildMask();

			if (typeof this.maskOpacity == 'undefined') {
				this.mask.style.visibility = "hidden";
				this.mask.style.display = "block";
				this.maskOpacity = YAHOO.util.Dom.getStyle(this.mask,"opacity");
				this.mask.style.display = "none";
				this.mask.style.visibility = "visible";
			}

			if (! YAHOO.util.Config.alreadySubscribed( this.beforeShowEvent, this.showMask, this ) ) {
				this.beforeShowEvent.subscribe(this.showMask, this, true);
			}
			if (! YAHOO.util.Config.alreadySubscribed( this.hideEvent, this.hideMask, this) ) {
				this.hideEvent.subscribe(this.hideMask, this, true);
			}
			if (! YAHOO.util.Config.alreadySubscribed( YAHOO.widget.Overlay.windowResizeEvent, this.sizeMask, this ) ) {
				YAHOO.widget.Overlay.windowResizeEvent.subscribe(this.sizeMask, this, true);
			}
			if (! YAHOO.util.Config.alreadySubscribed( this.destroyEvent, this.removeMask, this) ) {
				this.destroyEvent.subscribe(this.removeMask, this, true);
			}
			this.cfg.refireEvent("zIndex");
		} else {
			this.beforeShowEvent.unsubscribe(this.showMask, this);
			this.beforeHideEvent.unsubscribe(this.hideMask, this);
			YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.sizeMask);
		}
	},
	
	// Overrides the showMask function to allow for fade-in animation
	showMask : function() {
		if (this.cfg.getProperty("modal") && this.mask) {
			YAHOO.util.Dom.addClass(document.body, "masked");
			this.sizeMask();

			var o = this.maskOpacity;

			if (! this.maskAnimIn) {
				this.maskAnimIn = new YAHOO.util.Anim(this.mask, {opacity: {to:o}}, 0.25);
				YAHOO.util.Dom.setStyle(this.mask, "opacity", 0);
			}

			if (! this.maskAnimOut) {
				this.maskAnimOut = new YAHOO.util.Anim(this.mask, {opacity: {to:0}}, 0.25);
				this.maskAnimOut.onComplete.subscribe(function() {
														this.mask.tabIndex = -1;
														this.mask.style.display = "none";
														this.hideMaskEvent.fire();
														YAHOO.util.Dom.removeClass(document.body, "masked");
													  }, this, true);
				
			}
			this.mask.style.display = "block";
			this.maskAnimIn.animate();
			this.mask.tabIndex = 0;
			this.showMaskEvent.fire();
		}
	},

	// Overrides the showMask function to allow for fade-out animation
	hideMask : function() {
		if (this.cfg.getProperty("modal") && this.mask) {
			this.maskAnimOut.animate();
		}
	},

	// Loads the selected image and shows the panel
	selectImage : function(e, matchedEl, container) {
		var idx = Number(matchedEl.id.substr(matchedEl.id.lastIndexOf('_')+1));
		this.setImage(idx);
		this.show();
	},
	// END PHOTOBOX SUBCLASS //
	     dummy : null
	});




	YAHOO.RMCGallery.init = function (e, params) {
		YAHOO.RMCGallery.photobox = new YAHOO.widget.RMCPhotoBox("photobox", { 
			effect:{effect:YAHOO.widget.ContainerEffect.FADE,duration:0.45}, 
			fixedcenter: "contained", 
			constraintoviewport:true,
			underlay:"none",
			close:true,
			visible:false,
			draggable:false,
			modal:true, 
			photos: params.photos
		} );

		YAHOO.RMCGallery.photobox.render();		
		YAHOO.util.Event.addListener("show", "click", YAHOO.RMCGallery.photobox.show, YAHOO.RMCGallery.photobox, true);
		YAHOO.util.Event.delegate("thumbnails", "click", YAHOO.RMCGallery.photobox.selectImage, "img", YAHOO.RMCGallery.photobox, true);
	};


})();