var Gallery = Class.create();
Object.extend(Object.extend(Gallery.prototype, FileExplorer.prototype), {
	DIRECTORY_ICON_CLASS_NAME : "galleryDirectoryIcon",
	FILE_ICON_CLASS_NAME : "galleryFileIcon",
	createDirHandler : function() {
		this.dirs = this.content.getElementsBySelector('div[class="'+
		this.DIRECTORY_ICON_CLASS_NAME +'"]');
		this.dirCount = 0;
		this.setContentHeader(this.folderName);
		this.dirs.each(function(dir) {
			dir.style.cursor = "pointer";
			++this.dirCount;
			Event.observe(dir, "mouseover", function(evt) {
				this.tooltip = fName || "Parent";
				this.showToolTip(Event.pointerX(evt), Event.pointerY(evt));
			}.bindAsEventListener(this));
			Event.observe(dir, "mouseout", function(evt) {
				this.hideToolTip();
			}.bindAsEventListener(this));
			var fName = "";
			if(".." == dir.innerHTML) {
				fName = this.folderName.substring(0, this.folderName.lastIndexOf("/"));
			} else {
				fName = this.folderName + "/" + dir.firstChild.innerHTML;
			}
			Event.observe(dir, "click", function(event) {
				if(0 != this.processingCount) return;
				this.folderName = fName;
				this.request();
			}.bindAsEventListener(this));
		}.bind(this));
	},
	createFileHandler : function() {
		this.fileCount = 0;
		this.files = this.content.getElementsBySelector('div[class="' +	this.FILE_ICON_CLASS_NAME +'"]');
		this.files.each(function(file, index) {
			++this.fileCount;
			file.style.cursor = "pointer";
			Event.observe(file, "mouseover", function(evt) {
				this.tooltip = file.firstChild.innerHTML || "";
				this.showToolTip(Event.pointerX(evt), Event.pointerY(evt));
			}.bindAsEventListener(this));
			Event.observe(file, "mouseout", function(evt) {
				this.hideToolTip();
			}.bindAsEventListener(this));
			Event.observe(file, "click", function(event) {
				this.showFile(file, index);
			}.bindAsEventListener(this));
		}.bind(this));
	},
	showFile : function(file, index) {
		if(!this.viewer) {
			this.element.style.left = "0px";
			this.viewer = system.menu.show({id : "55", parentId : this.id});
			this.viewer.element.style.position = "absolute";
			this.viewer.element.style.left = null;
			this.viewer.element.style.bottom = null;
			this.viewer.element.style.right = "0px";
			this.viewer.element.style.top = $("javawideTaskManager").getHeight() + "px";
		}
		this.viewer.setVisible(true);
		this.viewer.content.innerHTML = "";
		var dummy = this.viewer.buildElement(this.viewer.content);
		var img = this.viewer.buildElement(dummy, {elementName: "img",
		src: "/content/jsp/dispatcher.jsp?contentId=download&FOLDERNAME=" + 
		encodeURIComponent(this.rootFolderName + this.folderName) +
		"&FILENAME=" + encodeURIComponent(file.firstChild.innerHTML)});
		Event.observe(img, "load", function(evt) {
			this.viewer.resizeToContent();
		}.bind(this));
	},
	createUpload : function() {
		var btnSingle = document.createElement("input");
		btnSingle.setAttribute("type", "button");
		btnSingle.setAttribute("value", "업로드 - Upload");
		var btnMultiple = document.createElement("input");
		btnMultiple.setAttribute("type", "button");
		btnMultiple.setAttribute("value", "다중 업로드 - Multiple Upload");
		Event.observe(btnSingle, "click", function(evt) {
			system.menu.show({id : "52", parentId : this.id});
		}.bindAsEventListener(this));
		Event.observe(btnMultiple, "click", function(evt) {
			system.menu.show({id : "53", parentId : this.id});
		}.bindAsEventListener(this));
		return [btnSingle, btnMultiple];
	},
	createButtons: function() {
		if($(this.id+"explorerButtons")) return;
		var buttons = document.createElement("div");
		buttons.setAttribute("id", this.id+"explorerButtons");
		var uploadButtons = this.createUpload();
		uploadButtons.each(function(elem) {
			elem.className = "explorerButtons";
			buttons.appendChild(elem);
		});
		this.contentFooter.appendChild(buttons);
	}
});