FISH = function(id, parent_id) {
	this.init(id, parent_id);
}

Class(
	FISH, DIV,

	"init", function(id, parent_id) {
		FISH.superclass.init.call(this, id, parent_id);
		this.timer = 0;
		this.direction = 1;
		this.moving = false;
		this.intensity = 5; // zIndex
	},

	"create", function(x, y, w, h) {
		FISH.superclass.create.call(this, x, y, w, h);
		this.setClass("me2fish");

		YAHOO.util.Event.addListener(this.id, "mouseover", function(e) {
			this.stop = true;
		}, this, true);
		YAHOO.util.Event.addListener(this.id, "mouseout", function(e) {
			this.stop = false;
		}, this, true);
		YAHOO.util.Event.addListener(this.id, "click", function(e) {
			SEA.direction = Math.floor(Math.random() * 4);
			if( SEA.owner && this.id == SEA.owner.id ) {
			}

			SEA.zoomOut(this);
			this.direction = 1;
			this.speed = 0;
			this.setStyle("background", SEA.color[_CURRENT_+_FISH_]);
			this.setStyle("color", SEA.color[_CURRENT_+_FONT_]);
			//this.setBackground(SEA.color[_CURRENT_+_FISH_]);
			delete SEA.name_list;
			SEA.name_list = null;

			SEA.onClickFish(this.fishId, this);
		}, this, true);
	},

	"getSpeed", function(intensity) {
		return intensity + 1;
	},

	"getDirection", function() {
		return SEA.direction;
	},

	"getFont", function() {
		if( this.direction == 5 ) {
			return "10pt 'Malgun Gothic', dotum";
		}

		var fontSize = 8 + this.intensity;
		var fontWeight = Math.floor(Math.random() * 2) ? "" : " bold";

		return fontSize + "pt 'Malgun Gothic', dotum" + fontWeight;
	},

	"getLevel", function() {
		return Math.floor(this.intensity / 2) + 1;
	},

	"getFishColor", function(intensity) {
		var level = this.getLevel();
		return SEA.color[eval("_LEVEL" + level + "_")+_FISH_];
	},

	"getFontColor", function(intensity) {
		var level = this.getLevel();
		return SEA.color[eval("_LEVEL" + level + "_")+_FONT_];
	},

	"setFishColor", function(color) {
		this.setStyle("background", color);
	},

	"setFontColor", function(color) {
		this.setStyle("color", color);
	},

	"setup", function() {
		this.intensity = Math.floor(Math.random() * 10);
		this.speed = this.getSpeed(this.intensity);
		this.direction = this.getDirection();
		this.font = this.getFont();

		var size = getTextSize(this.getText(), this.font, "150%", 600);
		var w = size.width;
		var h = size.height;

		this.setStyle("cursor", "pointer");
		this.setStyle("zIndex", this.intensity);
		this.setStyle("font", this.font);
		this.setStyle("lineHeight", "150%");
		this.setStyle("color", this.getFontColor(this.intensity));
		this.setStyle("background", this.getFishColor(this.intensity));
		this.setStyle("textAlign", "center");

		this.setW(w);
		this.setH(h);

		switch( this.direction ) {
		case 0: // left
		case 1: // right
			this.setX((this.direction == 0) ? SEA.w : -this.w);
			this.setY(10 + Math.floor(Math.random() * (SEA.h - 20 - h)));
			break;
		case 2: // up
		case 3: // down
			this.setX(10 + Math.floor(Math.random() * (SEA.w - 20 - w)));
			this.setY((this.direction == 2) ? SEA.h : -this.h);
			break;
		}

	},

	"moveUp", function() {
		FISH.superclass.setY.call(this, this.y - this.speed);
	},

	"moveDown", function() {
		FISH.superclass.setY.call(this, this.y + this.speed);
	},

	"moveLeft", function() {
		FISH.superclass.setX.call(this, this.x - this.speed);
	},

	"moveRight", function() {
		FISH.superclass.setX.call(this, this.x + this.speed);
	},

	"moveBackward", function(target_w, target_h) {
		target_w = 4;
		target_h = 3;

		if( this.w <= target_w && this.h <= target_h ) {
			this.setX(this.x + Math.floor((this.w - target_w) / 2));
			this.setY(this.y + Math.floor((this.h - target_h) / 2));
			this.setW(target_w);
			this.setH(target_h);

			this.direction = this.getDirection();
			this.speed = 5 + this.speed * 2;

			this.setStyle("zIndex", 1);
			this.setStyle("background", this.getFontColor(this.intensity)); //"#ffffff");
			return;
		}

		var w = (this.w <= target_w + 1) ? target_w : this.w - Math.floor((this.w - target_w) / 2);
		var h = (this.h <= target_h + 1) ? target_h : this.h - Math.floor((this.h - target_h) / 2);

		this.setX(this.x + Math.floor((this.w - w) / 2));
		this.setY(this.y + Math.floor((this.h - h) / 2));
		this.setW(w);
		this.setH(h);
	},

	"moveForward", function(target_w, target_h) {
		target_w = this.target_w;
		target_h = this.target_h;

		if( this.w >= target_w && this.h >= target_h ) {
			this.setX(this.x + Math.floor((this.w - target_w) / 2));
			this.setY(this.y + Math.floor((this.h - target_h) / 2));
			this.setW(target_w);
			this.setH(target_h);

			this.direction = this.getDirection();
			this.speed = 0;

			this.setStyle("zIndex", this.intensity);
			this.setText(this.fish_text);
			this.setStyle("background", SEA.color[_CURRENT_+_FISH_]);
			this.setStyle("color", SEA.color[_CURRENT_+_FONT_]);
			return;
		}

		var w = this.w + Math.floor((target_w - this.w) / 2);
		var h = this.h + Math.floor((target_h - this.h) / 2);
		w = (w >= target_w - 1) ? target_w : w;
		h = (h >= target_h - 1) ? target_h : h;

		this.setX(this.x + Math.floor((this.w - w) / 2));
		this.setY(this.y + Math.floor((this.h - h) / 2));
		this.setW(w);
		this.setH(h);
	},

	"go", function(name) {
		if( this.stop && this.speed ) {
			return;
		}

		if( !this.moving ) {
			if( this.getText() == "" ) {
				this.fishNumber = SEA.getFishNumber();
				this.setText(SEA.getFishName(this.fishNumber));
				this.fishId = SEA.getFishId(this.fishNumber)
				return;
			}
			this.setup();
			this.moving = true;
		}
		else {
			if( (this.direction == 0 && this.x < -this.w) || (this.direction == 1 && this.x > SEA.w) || (this.direction == 2 && this.y < -this.h) || (this.direction == 3 && this.y > SEA.h) ) {
				this.setText("");
				this.moving = false;
			}

			switch( this.direction ) {
			case 0: // left
				this.moveLeft();
				break;
			case 1: // right
				this.moveRight();
				break;
			case 2: // up
				this.moveUp();
				break;
			case 3: // down
				this.moveDown();
				break;
			case 4: // backward
				this.moveBackward();
				break;
			case 5: // forward
				this.moveForward();
				break;
			}
		}
	}
);

var _BACKGROUND_ = 0;
var _CURRENT_ = 1;
var _LEVEL1_ = 6; // foremost
var _LEVEL2_ = 5;
var _LEVEL3_ = 4;
var _LEVEL4_ = 3;
var _LEVEL5_ = 2; // farthest
var _FISH_ = 0; // SEA.color[_LEVEL1_][_FISH_]
var _FONT_ = 1; // SEA.color[_LEVEL1_][_FONT_]

var _BACKGROUND_ = 0;
var _CURRENT_ = 1;
var _LEVEL1_ = 11; // foremost
var _LEVEL2_ = 9;
var _LEVEL3_ = 7;
var _LEVEL4_ = 5;
var _LEVEL5_ = 3; // farthest
var _FISH_ = 0; // SEA.color[_LEVEL1_+_FISH_]
var _FONT_ = 1; // SEA.color[_LEVEL1_+_FONT_]

SEA = {
	w: 800,

	h: 500,

	fishes: [],

	count: 60,

	index: 0,

	pre: null,

	cur: null,

	timer: 0,

	timer_read: 0,

	name_list: null,

	id_list: null,

	direction: 2,

	//color: ["#000000", ["#ff3300", "#ffffff"], ["#303030", "#ff00ff"], ["#252525", "#00ffff"], ["#202020", "#ffff00"], ["#151515", "#ff0000"], ["#101010", "#33ffff"]],
	default_color: ["#000000", "#ff3300", "#ffffff", "#303030", "#FFB5B5", "#252525", "#FFBCFE", "#202020", "#A5A8FF", "#151515", "#C9FFC9", "#101010", "#FFE1BF"],

	color: ["#000000", "#ff3300", "#ffffff", "#303030", "#ffffff", "#252525", "#ffffff", "#202020", "#ffffff", "#151515", "#ffffff", "#101010", "#ffffff"],

	color_name: ["BACKGROUND", "SELECTED BOX COLOR", "SELECTED FONT COLOR", "LEVEL1 BOX COLOR", "LEVEL1 FONT COLOR", "LEVEL2 BOX COLOR", "LEVEL2 FONT COLOR", "LEVEL3 BOX COLOR", "LEVEL3 FONT COLOR", "LEVEL4 BOX COLOR", "LEVEL4 FONT COLOR", "LEVEL5 BOX COLOR", "LEVEL5 FONT COLOR"],

	id: null,

	full: false,

	create: function(id) {
		YAHOO.namespace("FISH");

		SEA.id = id;
		SEA.setLayout();

		YAHOO.util.Dom.setStyle(SEA.id, "background", SEA.color[_BACKGROUND_]);

		YAHOO.util.Event.addListener(window, "resize", function(e) {
			SEA.setLayout();
		});
	},

	setLayout: function() {
		if( SEA.full ) {
			YAHOO.util.Dom.setStyle(SEA.id, "border", "none");
			SEA.w = Math.max(800, YAHOO.util.Dom.getViewportWidth());
			SEA.h = Math.max(500, YAHOO.util.Dom.getViewportHeight());
		}
		else {
			YAHOO.util.Dom.setStyle(SEA.id, "border", "solid 1px #333333");
			SEA.w = 800;
			SEA.h = 500;
		}
		YAHOO.util.Dom.setStyle(SEA.id, "width", SEA.w + "px");
		YAHOO.util.Dom.setStyle(SEA.id, "height", SEA.h + "px");

		var r = YAHOO.util.Dom.getRegion(SEA.id);
		SEA.w = r.right - r.left;
		SEA.h = r.bottom - r.top;

		YAHOO.util.Dom.setStyle("fish_profile", "width", SEA.w - 140 + "px");
		YAHOO.util.Dom.setStyle("fish_profile_", "width", SEA.w - 140 + "px");
		YAHOO.util.Dom.setStyle(SEA.id, "margin", "0");

		if( SEA.full ) {
			SEA.x = 0;
			SEA.y = 0;
		}
		else {
			SEA.x = Math.max(0, Math.floor((YAHOO.util.Dom.getViewportWidth() - SEA.w) /2));
			SEA.y = Math.max(0, Math.floor((YAHOO.util.Dom.getViewportHeight() - SEA.h) / 2));
		}
		YAHOO.util.Dom.setStyle(SEA.id, "left", SEA.x + "px");
		YAHOO.util.Dom.setStyle(SEA.id, "top", SEA.y + "px");

		SETTING.setLayout();
		TOOLBOX.setLayout();
	},

	changeFull: function(full) {
		SEA.full = full;
		SEA.setLayout();

		if( SEA.full ) {
			for( var i = 0; i < SEA.fishes.length; i++ ) {
				var x = Math.floor((SEA.w - 800) / 2);
				var y = Math.floor((SEA.h - 500) / 2);
				var fish = SEA.fishes[i];
				fish.setXY(x + fish.x, y + fish.y);
			}
			YAHOO.util.Dom.setStyle(document.body, "background", SEA.color[_BACKGROUND_]);
		}
		else {
			YAHOO.util.Dom.setStyle(document.body, "background", "#000000");
		}

		var temp = SEA.name_list;
		SEA.zoomOut(null);
		SEA.name_list = temp;
	},

	generateFish: function() {
		for( var i = 0; i < SEA.count; i++ ) {
			var fish = new FISH("fish" + i, SEA.id);
			fish.create(0, 0, 1, 1);
			fish.setText("");
			SEA.fishes.push(fish);
		}
	},

	setList: function(name_list, id_list) {
		SEA.name_list = name_list;
		SEA.id_list = id_list;
	},

	getFishNumber: function() {
		if( !SEA.name_list ) {
			return -1;
		}

		if( SEA.index >= SEA.name_list.length ) {
			SEA.index = 0;
		}

		return SEA.index++;
	},

	getFishName: function(num) {
		if( !SEA.name_list || num < 0 || num >= SEA.name_list.length ) {
			return "";
		}

		return SEA.name_list[num];
	},

	getFishId: function(num) {
		if( !SEA.id_list || num < 0 || num >= SEA.id_list.length ) {
			return "";
		}

		return SEA.id_list[num];
	},

	zoomOut: function(fish) {
		SEA.name_list = null;

		for( var i = 0; i < SEA.fishes.length; i++ ) {
			if( fish && fish.id == SEA.fishes[i].id ) {
				continue;
			}
			SEA.fishes[i].setText("");
			SEA.fishes[i].direction = 4;
		}

		if( SEA.owner ) {
			SEA.owner.speed = 10;
		}
		if( fish ) {
			SEA.owner = fish;
			SEA.owner.direction = 5;
		}
	},

	onClickFish: function(fish_id, fish) {
	},

	moveFish: function() {
		for( var i = 0; i < SEA.fishes.length; i++ ) {
			SEA.fishes[i].go("SEA.fishes[" + i + "]");
		}

		clearTimeout(SEA.timer);
		SEA.timer = setTimeout("SEA.moveFish()", 50);
	},

	applyColor: function() {
		YAHOO.util.Dom.setStyle(SEA.id, "background", SEA.color[_BACKGROUND_]);

		for( var i = 0; i < SEA.fishes.length; i++ ) {
			if( SEA.fishes[i].speed == 0 ) {
				SEA.fishes[i].setFishColor(SEA.color[_CURRENT_+_FISH_]);
				SEA.fishes[i].setFontColor(SEA.color[_CURRENT_+_FONT_]);
			}
			else {
				var level = SEA.fishes[i].getLevel();
				SEA.fishes[i].setFishColor(SEA.color[eval("_LEVEL" + level + "_")+_FISH_]);
				SEA.fishes[i].setFontColor(SEA.color[eval("_LEVEL" + level + "_")+_FONT_]);
			}
		}

		for( var i = 0; i < SEA.color.length && i < SETTING.color.length; i++ ) {
			SETTING.color[i].setStyle("background", SEA.color[i]);
		}
	},

	saveColor: function(id) {
		if( !id ) {
			return;
		}

		var color = SEA.color.toString();
		color = color.replace(/,/gi, "\",\"");
		color = "[\"" + color + "\"]";

		//alert(color);

		var url = "./php/color.save.php";
		var dat = "callback=SEA.handleSave"
				+ "&id=" + id 
				+ "&color=" + color;
		YAHOO.util.Connect.asyncRequest("POST", url, SEA.SAVE.callback, dat);		
	},

	SAVE: {
		handleSuccess: function(o) {
			if( o.responseText.match("SEA.handleSave") ) {
				eval(o.responseText);
			}
			else {
				alert(o.responseText);
			}
		},

		handleFailure: function(o) {
			alert(o.responseText);
		}
	},

	handleSave: function(json) {
		SEA.onSave(json);
	},

	onSave: function(json) {
	},

	loadColor: function(id) {
		if( !id ) {
			return;
		}

		var url = "./php/color.load.php?callback=SEA.handleLoad&id=" + id;
		var dat = "callback=SEA.handleLoad"
				+ "&id=" + id;
		YAHOO.util.Connect.asyncRequest("GET", url, SEA.LOAD.callback, null);
	},

	LOAD: {
		handleSuccess: function(o) {
			if( o.responseText.match("SEA.handleLoad") ) {
				eval(o.responseText);
			}
			else {
				alert(o.responseText);
			}
		},

		handleFailure: function(o) {
			//alert(o.responseText);
		}
	},

	handleLoad: function(json) {
		SEA.onLoad(json);
	},

	onLoad: function(json) {
	}
};

SEA.SAVE.callback = {
	success: SEA.SAVE.handleSuccess,
	failure: SEA.SAVE.handleFailure,
	scope: SEA
};

SEA.LOAD.callback = {
	success: SEA.LOAD.handleSuccess,
	failure: SEA.LOAD.handleFailure,
	scope: SEA
};

// full screen
// color setting
// id input
// login/out
SETTING = {
	wnd: null,

	index: 0,

	color: [],

	create: function() {
		if( SETTING.wnd ) {
			return;
		}

		SETTING.wnd = new WINDOW("color_setting");
		SETTING.wnd.color = "#000000";
		SETTING.wnd.title_color = "#333333";
		SETTING.wnd.create(SEA.x + Math.floor((SEA.w - 218) / 2), SEA.y + 10, 218, 90, "CLOSE");
		SETTING.wnd.setTitle("COLOR SETTING");
		SETTING.wnd.enableDragdrop();
		YAHOO.util.Dom.setStyle(SETTING.wnd.container, "zIndex", "999");

		var btn = new DIV("setting_btn", SETTING.wnd.get_id());
		btn.create(5, 60, 208, 20);
		btn.setStyle("borderTop", "solid 1px #333333");
		btn.setStyle("paddingTop", "7px");
		btn.setStyle("font", "9pt arial");
		btn.setStyle("textAlign", "center");
		btn.setText("<a href='javascript:SETTING.save()' style='color:#ffffff;text-decoration:none;'>SAVE</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href='javascript:SETTING.hide()' style='color:#ffffff;text-decoration:none;'>CLOSE</a>");
		//btn.setStyle("background", "#ff3333");

		for( var i = 0; i < 13; i++ ) {
			var div = new DIV("color_setting" + i, SETTING.wnd.get_id());
			div.create(11 + Math.ceil(i / 2) * (10 + 19), 10 + (i == 0 || (i % 2 == 1) ? 0 : 10 + 15), 19, 15);
			div.setStyle("background", SEA.color[i]);
			div.setStyle("border", "solid 1px #ffffff");
			div.setStyle("cursor", "pointer");
			
			YAHOO.util.Event.addListener(div.id, "click", function(e) {
				SETTING.index = this;
				ColorPicker.show();
				ColorPicker.setTitle(SEA.color_name[this]);
				ColorPicker.setColor(SEA.color[this].substr(1), true);
			}, i, true);

			SETTING.color[i] = div;
		}
		SETTING.wnd.onClose = SETTING.hide;
		ColorPicker.onChange = function(hex) {
			SEA.color[SETTING.index] = "#" + hex;
			SETTING.color[SETTING.index].setStyle("background", "#" + hex);
			SEA.applyColor();
		}
	},

	setLayout: function() {
		if( !SETTING.wnd ) {
			return;
		}
		SETTING.wnd.setXY(SEA.x + Math.floor((SEA.w - 218) / 2), SEA.y + 10);
		ColorPicker.setLayout();
	},

	show: function() {
		SETTING.create();
		SETTING.wnd.show();
		SETTING.setLayout();
		ColorPicker.show();
		ColorPicker.setColor(SEA.color[SETTING.index].substr(1), true);
	},

	hide: function() {
		ColorPicker.wnd.hide();
		SETTING.wnd.hide();
	},

	save: function() {
		InputForm.show();
	}
};

TOOLBOX = {
	container: null,

	full: null,

	setting: null,
	
	me2day: null,

	create: function() {
		TOOLBOX.container = new DIV("toolbox");
		TOOLBOX.container.create(0, 0, 92, 34);
		YAHOO.util.Dom.setStyle(TOOLBOX.container.id, "zIndex", "998");
		DW_UTIL.setOpacity(TOOLBOX.container.el, 0.5);
		YAHOO.util.Event.addListener(TOOLBOX.container.get_id(), "mouseover", function(e) {
			DW_UTIL.setOpacity(TOOLBOX.container.el, 1);
			e.cancelBubble = true;
		});
		YAHOO.util.Event.addListener(TOOLBOX.container.get_id(), "mouseout", function(e) {
			DW_UTIL.setOpacity(TOOLBOX.container.el, 0.5);
			e.cancelBubble = true;
		});

		TOOLBOX.full = new DIV("toolbox_full", "toolbox");
		TOOLBOX.full.create(5, 5, 24, 24);
		TOOLBOX.full.setStyle("background", "url('image/full.gif')");
		TOOLBOX.full.setStyle("cursor", "pointer");
		TOOLBOX.full.el.title = "전체화면/작은화면";
		YAHOO.util.Event.addListener(TOOLBOX.full.get_id(), "click", function(e) {
			TOOLBOX.onFull();
			e.cancelBubble = true;
		});

		TOOLBOX.setting = new DIV("toolbox_setting", "toolbox");
		TOOLBOX.setting.create(34, 5, 24, 24);
		TOOLBOX.setting.setStyle("background", "url('image/setting.gif')");
		TOOLBOX.setting.setStyle("cursor", "pointer");
		TOOLBOX.setting.el.title = "내 미친바다 색상 정해주기";
		YAHOO.util.Event.addListener(TOOLBOX.setting.get_id(), "click", function(e) {
			TOOLBOX.onSetting();
			e.cancelBubble = true;
		});

		TOOLBOX.me2day = new DIV("toolbox_me2day", "toolbox");
		TOOLBOX.me2day.create(63, 5, 24, 24);
		TOOLBOX.me2day.setStyle("background", "url('image/me2day.gif')");
		TOOLBOX.me2day.setStyle("cursor", "pointer");
		TOOLBOX.me2day.el.title = "미투데이에 내 미친바다 포스팅";
		YAHOO.util.Event.addListener(TOOLBOX.me2day.get_id(), "click", function(e) {
			TOOLBOX.onMe2day();
			e.cancelBubble = true;
		});

		TOOLBOX.setLayout();
	},

	setLayout: function() {
		if( !TOOLBOX.container ) {
			return;
		}
		TOOLBOX.container.setXY(SEA.x + 1, SEA.y + SEA.h - 34 - 1);
	},

	onFull: function() {
		SEA.full = !SEA.full;
		SEA.changeFull(SEA.full);
	},

	onSetting: function() {
		SETTING.show();
	},

	onMe2day: function() {
		if( !me2.auth.id || !me2.auth.pw ) {
			LoginForm.show();
			return;
		}
		me2.person.onRead = function(json) {
			me2.post.onWrite = function(json) {
				alert("나의 미친바다를 미투데이에 포스팅했습니다.");
			}
			me2.post.write("\"" + json.nickname + "의 미친바다\":http://ideapool.co.kr/me2day/sea/?id=" + me2.auth.id + " 로 풍덩 빠져 보아요.", "미친바다 me2app me2sea");
		}
		me2.person.read(me2.auth.id);
	}
};