/* ぺぺぺぺ */

var JalanMap = Class.create();


JalanMap.prototype = {
	initialize : function() {

		this.floq = {};

		var bodyId = document.body.id;
		var initById = 'init' + bodyId.substr(0,1).toUpperCase() + bodyId.substr(1);
		// bodyのidによる初期化 (id、method共にあれば)
		bodyId && this[initById] && this[initById]();

/*
		 var bodyClassName = document.body.className;
		var initByClassName = 'init' + bodyClassName.substr(0,1).toUpperCase() + bodyClassName.substr(1);
		bodyClassName && this[initByClassName] && this[initByClassName]();
*/


		this.checkSystemMessage();
		this.setFooter();



		// 問題画面はタイトル横アニメ「県or県」
		// その他の画面は、列島が浮かび上がるのみ
		var r1, r2;
		if (document.body.id == 'comments') {
			r1 = document.getElementById('area_id1').value,
			r2 = document.getElementById('area_id2').value
		}

		this.island = new IslandClass();
		this.island.emerging(r1, r2);
	},

	initLoginToAccountHome: function() {
		$('login_mail').focus();
	},

	initIndex: function() {
		// サイドの白青クラスチェンジ
/*
		var asks = $('sub').getElementsByClassName('news');

		var x = 1;
		for (var i=0; i<asks.length; i++) {
			var className = 'news topAsk' + (x=x^1);

			asks[i].setAttribute('class', className);
			asks[i].setAttribute('className', className);

			// ロールオーバー
			// new RollOverClass(asks[i], 'news topAskHi');
		}
*/

/*
// トップページからの即投票はなくなっちゃったよ…！ (flash除く)
		var btVote = document.getElementsByClassName('btVote');
		for (var i=0; i<btVote.length; i++) {
			var qid = btVote[i].href.match(/#(\d+)/);
			qid && (qid = qid[1]);
			var url = '/floq.php?qid='+qid;

			// 投票するボタン (overlay表示)
			this.floq[i] = new FloqClass(btVote[i], url, i, qid);
		}
*/


		// flash書き出し (日本地図)
		var so;
		so = new SWFObject('/swf/BeautifulCountry.swf', 'jalanMap', '500', '350', '7', 'transparent');

		so.addParam('useExpressInstall', true);
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('domain', $('domain').value);

//		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('mainFlash');

		// flash書き出し (パーツサンプル)
/*
		so = new SWFObject('/swf/parts.swf', 'jalanMapParts', '150', '360', '7');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('pref', $('blogPartsSamplePref').value);
		so.addVariable('domain', $('domain').value);

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('blogPartsSample');
*/

		// flash書き出し (じゃらん広告 - 右)
/*
		so = new SWFObject('/swf/jalan_hotel_right.swf', 'jalanHotelMini', '228', '112', '7', 'transparent');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('pref', $('kkJalanPref').value);
		so.addVariable('domain', $('domain').value);

		so.useExpressInstall('/swf/expressinstall.swf');
*/

/*
		var kk3 = $('kkAppeal').getElementsByTagName('li');
		for (var i=0; i<kk3.length; i++) {
			so.write(kk3[i]);
		}
*/

//		so.write($('kkAppeal').getElementsByTagName('li')[0]);


		// flash書き出し (じゃらん広告 - 下)
		so = new SWFObject('/swf/jalan_hotel.swf', 'jalanHotel', '771', '210', '7', 'transparent');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('pref', $('kkJalanPrefFooter').value);
		so.addVariable('domain', $('domain').value);

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('kkJalan');

	},
	closeFloq: function(vote) {
		this.floq[this.floqNow].close(vote);
	},

	classChanger: function(elm, className) {
		elm.setAttribute('class', className);
		elm.setAttribute('className', className);
	},

	initComments: function() {

		$('voteThis').onclick = function () { return false };

/*
		if ($('discription')) {
			if ($('discription').innerHTML == '') {
				$('discription').style.display = 'none';
			}
		}
*/


		var so;
		// flash書き出し (別の都道府県 - 左)
		so = new SWFObject('/swf/nextBtn.swf', 'graph', '140', '193', '7', 'transparent');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('domain', $('domain').value);
		so.addVariable('direction', 'left');
		so.addVariable('name', $('area1').value);
		so.addVariable('aid', $('area_id1').value);
		so.addVariable('qid', $('qid').value);

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('city1Passage');

		// flash書き出し (別の都道府県 - 右)
		so = new SWFObject('/swf/nextBtn.swf', 'graph', '140', '193', '7', 'transparent');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('domain', $('domain').value);
		so.addVariable('direction', 'right');
		so.addVariable('name', $('area2').value);
		so.addVariable('aid', $('area_id2').value);
		so.addVariable('qid', $('qid').value);

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('city2Passage');

		// flash書き出し (比率)
		so = new SWFObject('/swf/graph.swf', 'graph', '420', '34', '7', 'transparent');
		so.addParam('quality', 'high');
		so.addParam('wmode', 'transparent');
		so.addParam('salign', 't');

		so.addVariable('c1', $('ratio1').value);
		so.addVariable('c2', $('ratio2').value);

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('ratioFlash');

		// flash書き出し (じゃらん広告 - 右)
		if ($('kkAppeal')) {
			so = new SWFObject('/swf/jalan_hotel_right.swf', 'jalanHotelMini', '228', '112', '7', 'transparent');
			so.addParam('quality', 'high');
			so.addParam('wmode', 'transparent');
			so.addParam('salign', 't');

			so.addVariable('pref', $('kkJalanPref').value);
			so.addVariable('domain', $('domain').value);

			so.useExpressInstall('/swf/expressinstall.swf');

	/*
			var kk3 = $('kkAppeal').getElementsByTagName('li');
			for (var i=0; i<kk3.length; i++) {
				so.write(kk3[i]);
			}
	*/
			so.write($('kkAppeal').getElementsByTagName('li')[0]);
		}

		// クリップボードへコピーボタン
		Event.observe($('clip'), 'click', function(e) {
			$('parmaLinkURL').select();
			clipbrd.copyText($('parmaLinkURL').value)
		}, false);



		var qid = $('qid').value;
		var url = '/floq.php?qid='+qid;

		// 投票するボタン (overlay表示)
		this.floq[0] = new FloqClass($('voteThis'), url, 0);


		var border = RUZEE.ShadedBorder.create({ corner:6, shadow:0,  border:1 });
		border.render('parmaLinkWrapper');




	},

	initFloq: function() {
		// flash書き出し (比率)
		var so = new SWFObject('/swf/float2.swf', 'floqSWF', '500', '500', '7');
		so.addParam('quality', 'high');
		so.addParam('salign', 't');

		so.addVariable('domain', $('domain').value);
		so.addVariable('uid', $('uid').value);
		so.addVariable('nick', $('nick').value);
		so.addVariable('pref', getQueryParamValue('qid'));

		so.useExpressInstall('/swf/expressinstall.swf');
		so.write('floqWrapper');
	},

	initProfileHome: function() {

		// タブ切り替え
/*
		var start = new TabMaker();
		start.create();
*/

		// タブ角丸
//		RUZEE.ShadedBorder.create({ corner:6 }).render('test');


		// タグtextareaクリック時の自動選択
		if ($('stickyTag')) {


			Event.observe($('stickyTag'), 'click', function(e) {
				var elm;
				if (e.srcElement) {
					elm = e.srcElement;
				} else if (e.target) {
					elm = e.target;
				} else {
					return;
				}

				elm.select();

			}, false);


			// クリップボードへコピーボタン
			Event.observe($('clip'), 'click', function(e) {
				$('stickyTag').select();
				clipbrd.copyText($('stickyTag').value)
			}, false);
		}

	},

	checkSystemMessage: function() {
		var elm = $('systemMessage');
		if (elm) {
			if (elm.innerHTML != '') {
				elm.setAttribute('class', 'systemMessage');
				elm.setAttribute('className', 'systemMessage');
			}
		}
	},

	setFooter: function() {
		$('footer').innerHTML = '<a href="http://www.jalan.net/" target="_blank"><img src="/img/jalan_logo.gif" width="120" height="50" /></a>';
	},

	generateOptions: function(elm, vsArray, selected) {
		var temp;

		for (var a in vsArray) {
			var oOption = document.createElement('option');
			oOption.setAttribute('value', a);
			oOption.appendChild(document.createTextNode(vsArray[a]));
			elm.appendChild(oOption);
		}

		return temp;

	},



	cities: {
		10000: '北海道',
		20000: '青森県',
		30000: '岩手県',
		40000: '宮城県',
		50000: '秋田県',
		60000: '山形県',
		70000: '福島県',
		80000: '茨城県',
		90000: '栃木県',
		100000: '群馬県',
		110000: '埼玉県',
		120000: '千葉県',
		130000: '東京都',
		140000: '神奈川県',
		150000: '新潟県',
		160000: '富山県',
		170000: '石川県',
		180000: '福井県',
		190000: '山梨県',
		200000: '長野県',
		210000: '岐阜県',
		220000: '静岡県',
		230000: '愛知県',
		240000: '三重県',
		250000: '滋賀県',
		260000: '京都府',
		270000: '大阪府',
		280000: '兵庫県',
		290000: '奈良県',
		300000: '和歌山県',
		310000: '鳥取県',
		320000: '島根県',
		330000: '岡山県',
		340000: '広島県',
		350000: '山口県',
		360000: '徳島県',
		370000: '香川県',
		380000: '愛媛県',
		390000: '高知県',
		400000: '福岡県',
		410000: '佐賀県',
		420000: '長崎県',
		430000: '熊本県',
		440000: '大分県',
		450000: '宮崎県',
		460000: '鹿児島県',
		470000: '沖縄県'
	}
}



Object.extend(JalanMap, {
});

//alert((new JalanMap).cities[1]);


var IslandClass = Class.create();
IslandClass.prototype = {
	initialize : function() {
		// preload images
		var temp = new Image();
		temp.src = '/img/or.gif';
	},

	emerging: function (r1, r2, rand) {

		var island = document.createElement('div');
		this.island = island;

		island.setAttribute('id', 'island');
		island.style.display = 'none';
		document.getElementById('headerContainer').appendChild(island);


		var omiyage1 = document.createElement('div');
		this.omiyage1 = omiyage1;

		omiyage1.setAttribute('id', 'omiyage1');
		omiyage1.className = 'omiyage';
		island.appendChild(omiyage1);

		var omiyage2 = document.createElement('div');
		this.omiyage2 = omiyage2;

		omiyage2.setAttribute('id', 'omiyage2');
		omiyage2.className = 'omiyage';
		island.appendChild(omiyage2);

		new Effect.Appear(island, { 
			from:0.1, // 開始時透明度 
			to:1.0, // 終了時透明度 
			delay:0, // 開始までの秒数
			fps:32, // フレームレート 
			duration: 1.2, // アニメーションする時間(秒) 

			beforeStartInternal: function(effect) {
			},

			afterFinishInternal: function(effect) {
				if (rand) {
					// ランダム
					while (1) {
						r1 = this.getRandLand();
						r2 = this.getRandLand();
						if (r1 != r2) {
							break;
						}
					}
				} else if (r1 && r2) {
					// 県指定
					r1 = document.getElementById('area_id1').value.replace(/0000$/, '');
					r2 = document.getElementById('area_id2').value.replace(/0000$/, '');
				} else {
					// 列島オンリー
					return;
				}

				this.peepOmiyage('left', this.omiyageItems[r1], omiyage1);
				this.peepOmiyage('right', this.omiyageItems[r2], omiyage2);
				this.flushOrrr(island);
			}.bind(this)
		}); 
	},

	getRandLand: function () {
		return Math.floor( Math.random() * 47 ) + 1;
	},


	flushOrrr: function (elm) {
		var or1 = document.createElement('img');
		or1.setAttribute('src', '/img/or.gif');
		or1.className = 'or';

		var or2 = document.createElement('img');
		or2.setAttribute('src', '/img/or.gif');
		or2.className = 'or';

		setTimeout(function () {
			elm.appendChild(or1);
			elm.appendChild(or2);

			new Effect.Puff(or2, {
				from:0.6, // 開始時透明度
				to:1.0, // 終了時透明度
				delay:0, // 開始までの秒数
				fps:60, // フレームレート
				duration: 1.5, // アニメーションする時間(秒)
				beforeStartInternal: function(effect) {
				},
				afterFinishInternal: function(effect) {
				}
			});
		}, 1200);

	},

	peepOmiyage: function (lr, imageFile, elm) {
		var id = 1;
		var move = 100;

		if (lr == 'right') {
			id = 2;
			move = -100;
		}

		var omiyage = document.createElement('img');
		omiyage.setAttribute('id', 'omiyage' + id);
		omiyage.setAttribute('src', '/img/omiyage_header/' + imageFile);
		omiyage.className = 'omiyage';
		omiyage.style.display = 'none';

		elm.appendChild(omiyage);

// ↓Todo: 右も左もパラレルに入れると、動作安定するかも？ しないかも？
	new Effect.Parallel([
		new Effect.MoveBy(omiyage, 


			0,
			move, {
				duration:2,
				fps:16,
				delay:0,
				beforeStartInternal: function(effect) {
				},
				afterFinishInternal: function(effect) {
				}
			}

		),


		new Effect.Appear(omiyage, { 
			from:0.1, // 開始時透明度 
			to:1.0, // 終了時透明度 
			delay:1, // 開始までの秒数
			fps:16, // フレームレート 
			duration: 2, // アニメーションする時間(秒) 

			beforeStartInternal: function(effect) {
			},

			afterFinishInternal: function(effect) {
			}
		})
	]);




	},

	omiyageItems: {
		 1: 't_hokkaido.gif',
		 2: 't_aomori.gif',
		 3: 't_iwate.gif',
		 4: 't_miyagi.gif',
		 5: 't_akita.gif',
		 6: 't_yamagata.gif',
		 7: 't_fukushima.gif',
		 8: 't_tochigi.gif',
		 9: 't_gunma.gif',
		10: 't_ibaraki.gif',
		11: 't_saitama.gif',
		12: 't_chiba.gif',
		13: 't_tokyo.gif',
		14: 't_kanagawa.gif',
		15: 't_yamanashi.gif',
		16: 't_nagano.gif',
		17: 't_niigata.gif',
		18: 't_toyama.gif',
		19: 't_ishikawa.gif',
		20: 't_fukui.gif',
		21: 't_shizuoka.gif',
		22: 't_gifu.gif',
		23: 't_aichi.gif',
		24: 't_mie.gif',
		25: 't_shiga.gif',
		26: 't_kyoto.gif',
		27: 't_oosaka.gif',
		28: 't_hyougo.gif',
		29: 't_nara.gif',
		30: 't_wakayama.gif',
		31: 't_tottori.gif',
		32: 't_shimane.gif',
		33: 't_okayama.gif',
		34: 't_hiroshima.gif',
		35: 't_yamaguchi.gif',
		36: 't_tokushima.gif',
		37: 't_kagawa.gif',
		38: 't_ehime.gif',
		39: 't_kouchi.gif',
		40: 't_fukuoka.gif',
		41: 't_saga.gif',
		42: 't_nagasaki.gif',
		43: 't_kumamoto.gif',
		44: 't_ooita.gif',
		45: 't_miyazaki.gif',
		46: 't_kagoshima.gif',
		47: 't_okinawa.gif'
	}
};


//new RollOverClass(elm,mouseOverClass,mouseDownClass);
var RollOverClass = Class.create();
RollOverClass.prototype = {
	initialize: function (elm){
		this.elm = elm;
		this.originalClass = this.elm.getAttribute('class');
		this.originalClassName = this.elm.getAttribute('className');
		if(arguments[1]) this.setMouseOverClass(arguments[1]);
		if(arguments[2]) this.setMouseDownClass(arguments[2]);
	},
	setMouseOverClass: function (className){
		this.mouseOverClass = className;
		this.elm.onmouseover = this.rollover.bind(this);
		this.elm.onmouseout = this.reversion.bind(this);
	},
	setMouseDownClass: function (className){
		this.mouseDownClass = className;
		this.elm.onmousedown = this.mousedown.bind(this);
		this.elm.onmouseup = this.reversion.bind(this);
	},
	rollover: function (){
		this.elm.setAttribute('class', this.mouseOverClass);
		this.elm.setAttribute('className', this.mouseOverClass);
	},
	mousedown: function (){
		this.elm.setAttribute('class', this.mouseDownClass);
		this.elm.setAttribute('className', this.mouseDownClass);
	},
	reversion: function (){
		this.elm.setAttribute('class', this.originalClass);
		this.elm.setAttribute('className', this.originalClassName);
	}
};


var FloqClass = Class.create();
FloqClass.prototype = {
	initialize: function(elm, url, n, qid){
		this.n   = n;
		this.elm = elm;
		this.url = url;
		this.qid = qid;


		Event.observe(this.elm, 'click', this.clickFloq.bind(this))
	},
	clickFloq: function() {
		jalanmap.floqNow = this.n;
		this.LITBox = new LITBox(this.url, {
			type: 'window',
			width: 510,
			height: 510,
			overlay: true,
			opacity: 1,
			left: false,
			top: false,
			draggable: false,
			resizable: false
		});
	},
	close: function(vote) {
		this.LITBox.remove();
		if (vote) {
			if ((document.body.id == 'index')) {
				var qid = this.qid;
				setTimeout(function(){ location.href = '/vote_view/' + qid }, 1000);
			} else {
				setTimeout(function(){location.reload()}, 1000);
			}
		}
	}
}





/* タブ切り替えインターフェース */

/*
<div id="tabContent">
  <ul id="tabIndex">
    <li class="tab">タブ１</li>
    <li class="tab">タブ２</li>
    <li class="tab">タブ３</li>
  </ul>
  <div id="tabBoxIndex">
    <div class="tabBox">
    </div>
    <div class="tabBox">
    </div>
    <div class="tabBox">
    </div>
  </div>
</div>
*/

var TabMaker = Class.create()
TabMaker.prototype = {
  initialize: function() {
    this.tabLnegth = document.getElementsByClassName('tab').length;
  },
  create: function() {
    var menu = new TabIndex();
    for (var i = 0; i < this.tabLnegth; i++) {
      menu.appendTab(new Tab('Tab' + i, (i==0)));
    }
    menu.setTab();
  }
}

var Tab = Class.create();
Tab.prototype = {
  initialize: function(name, open) {
    this.name = name;
    this.page = name + 'Page';
    this.open = (open);
  },
  styleTab: function() {
    if (this.open)
//      this.setStyle('visible', '', 'open');
      this.setStyle('block', '', 'open');
    else
//      this.setStyle('hidden', 'absolute', 'close');
      this.setStyle('none', 'absolute', 'close');
    this.open = false;
  },
  setStyle: function(visibility, position, className){
    var page = $(this.page).style;
    var name = $(this.name);
//    page.visibility = visibility;
    page.display = visibility;
    page.position = position;
    name.className = className;
  }
}

var TabIndex = Class.create();
TabIndex.prototype = {
  initialize : function() {
    this.last = 0;
    this.tabs = new Array();
  },
  getTabAt : function(index) {
    return this.tabs[index];
  },
  appendTab : function(tab) {
    this.tabs[this.last] = tab;
    document.getElementsByClassName('tab')[this.last].id = tab.name;
    document.getElementsByClassName('tabBox')[this.last].id = tab.page;
    this.last++;
    $(tab.name).getElementsByTagName('a')[0].onclick = function(){
      tab.open = true;
      this.setTab();
		return void(0);
    }.bind(this);
  },
  getLength : function() {
    return this.last;
  },
  each : function(func) {
    for (var i = 0; i < this.getLength(); i++) {
      func(this.getTabAt(i));
    }
  },
  setTab: function() {
    this.each(function(tab) {
        tab.styleTab();
    });
  }
};



var items = IslandClass.prototype.omiyageItems;
for (var i=0; i<items.length; i++) {
	var temp = new Image();
	temp.src = '/img/omiyage_header/' + items[i];
}

var jalanmap;
Event.observe(window, 'load', function() {
	jalanmap = new JalanMap();
}, false);