//ヘルプ画面の表示位置を取得
var top  = 0;
var left = 0;
var sc_top  = 0;
var sc_left = 0;
var win_width  = 0;
var win_height = 0;
var ua = navigator.userAgent;

function showHelp(flg){
	
	var main = createHelp(flg);
	document.getElementById('help').innerHTML = main;
	document.getElementById('help').style.display = 'block';
	
	sc_top  = document.documentElement.scrollTop  || document.body.scrollTop;
	sc_left = document.documentElement.scrollLeft || document.body.scrollLeft;
	
	top = parseInt(document.getElementById('help').style.top.replace('px',''));
	var pop_top = top - sc_top;
	var pop_height = document.getElementById('help').offsetHeight;
	
	win_width  = document.documentElement.clientWidth || document.body.clientWidth || document.body.scrollWidth;
	win_height = document.documentElement.clientHeight || document.body.clientHeight || document.body.scrollHeight;
	
	
	if(pop_top + pop_height > win_height){
		top = top - (pop_top + pop_height - win_height);
		if (top < sc_top) {
			top = sc_top;
		}
	}
	document.getElementById('help').style.top = top+'px';
}

function createHelp(flg){
	
	var main = '';
	var title = '';
	var contents = '';
	
	if(flg == 'mypage'){
		title = 'てるみくらぶのMyPage';
		contents = 'てるみくらぶの<span style="color:#f09;">MyPage</span>はとても便利です。<br /><br />PC用と携帯用、両方のメールアドレスを入力すると、旅行申込の確認メールがPCにも携帯にも届きます。<br /><br />確認メールには、あなたの今回の旅行の<span style="color:#f09;">MyPage</span>のURLが記載されています。そのURLからすぐ<span style="color:#f09;">MyPage</span>に飛んで下さい。<br /><br />PC・携帯どちらの<span style="color:#f09;">MyPage</span>でも、お申し込みいただいた旅行内容の確認、旅行申込書の入力、お問い合わせなどができます。又、問合せと回答のやり取りの履歴が確認できます。お友達と話しながら、電車の中でなどちょっとした時間に携帯で確認したり、入力できるのは便利ですよね。<br /><br />今後は、オプションの申込や現地の天気情報など、どんどん充実させていく予定です。<br />どうぞ<span style="color:#f09;">MyPage</span>をご活用下さい。';
	}else if(flg == 'name'){
		title = 'お名前';
		contents = '<span style="color:#f09; font-weight:bold;">■お名前の入力について</span><br />ローマ字氏名は、パスポートに印字されている通りに入力して下さい。<br />1文字でもパスポートと異なった場合、航空機への搭乗ができません。<br /><br /><span style="color:#f6c;">●</span>ご結婚などで姓が変わった方はご注意を。<br />・パスポートを新姓で取得して旅行される場合<br />⇒新姓を入力<br />・追記で新姓に訂正したパスポートで旅行される場合（写真の頁は旧姓のまま）<br />⇒新姓を入力<br />・旧姓のパスポートのまま旅行される場合<br />⇒旧姓を入力<br /><br /><span style="color:#f6c;">●</span>ミドルネームが印字されている方は「名」の欄にパスポートの順どおり、間に空白（スペース）を入れて続けて入力して下さい。<br /><br />※実際にパスポートを見ながら入力されることをおすすめします。<br />※パスポートをこれから申請される方は、下記URLのヘボン式ローマ字綴方表をご参考にご入力下さい。<br /><a href="http://www.seikatubunka.metro.tokyo.jp/hebon/" target="_blank">http://www.seikatubunka.metro.tokyo.jp/hebon/</a>';
	}else if(flg == 'carrier'){
		title = '利用予定航空会社';
		contents = 'このツアーで利用する航空会社です。<br />複数表示してある場合は、いずれかの航空会社を利用します。<br /><br />※共同運航便とは、複数の航空会社が一つの航空機にそれぞれの会社の便名を付けて運航する便のことです。<br />サービスの内容、チェックインカウンターなどは航空会社の基準に準じます。';
	}else if(flg == 'class'){
		title = '座席クラス';
		contents = '<span style="color:#f09; font-weight:bold;">■エコノミークラス</span><br />エコノミークラスとは、旅客機の客席の基礎となる座席区分のことで、もっとも安く座席数の多いクラスです。<br /><br /><span style="color:#f09; font-weight:bold;">■ビジネスクラス</span><br />ビジネスクラスとは、ファーストクラスとエコノミークラスの中間クラスのことでエコノミークラスよりも広く快適な座席や食事など、上質なサービスを受けることができます。<br /><br /><span style="color:#f09; font-weight:bold;">■ファーストクラス</span><br />ファーストクラスとは、旅客機の最上級クラスのことです。ビジネスクラスよりもさらに広く快適な座席や豪華な食事など最上級のサービスを受けることができます。';
	}else if(flg == 'mileage'){
		title = 'マイレージ加算';
		contents = 'このツアーを利用した際、マイレージが加算されるか否かということです。<br />（但し必ずしも100％加算されるとは限りません。）<br /><br />※マイレージとは、搭乗したフライトマイル数に応じて、無料航空券や上級座席への切替えなどの特典がもらえるサービスです。';
	}else if(flg == 'hotel'){
		title = '利用ホテル';
		contents = '<span style="color:#f09; font-weight:bold;">■指定</span><br />ホテル指定のコースです。<br /><br /><span style="color:#f09; font-weight:bold;">■いずれか</span><br />記載ホテルのいずれかのホテルにお泊りいただきます。<br /><br /><span style="color:#f09; font-weight:bold;">■同等クラス</span><br />掲載ホテルの同等クラスにお泊りいただきます。<br /><br /><span style="color:#f09; font-weight:bold;">■選択</span><br />掲載ホテルの中から、お泊りいただくホテルをお選びいただけます。';
	}else if(flg == 'min'){
		title = '最小催行人数';
		contents = '最少催行人数とは、あらかじめ定められた人数に参加者人数が満たない場合は、当社の都合で旅行を中止する事ができます。';
	}else{
		title = 'タイトル';
		contents = 'ヘルプの情報が表示されます。<br />以下、ダミーのテキストとなります。<br />◆利用予定航空会社<br />チャイナエアライン(CI)/ジャルウエイズ(JO)/全日本空輸(NH)/ノースウェスト航空(NW)/ユナイテッド航空(UA)<br />◆利用ホテル<br />ホテル名&nbsp;：&nbsp;ワイキキ・サンドビラ指定(滞在地 ホノルル)<br />部屋タイプ&nbsp;：&nbsp;ツイン又はダブル<br />部屋カテゴリ&nbsp;：&nbsp;ホテルルームスタンダード<br />利用形態&nbsp;：&nbsp;ホテル1室2名利用';
	}
	
	main += '<table width="250" cellpadding="3" cellspacing="0" border="0" style="border:1px solid #777; background-color:#fff; font-size:12px; line-height:18px;">';
	main += '<tr><td align="center"><div style="width:242px; background-color:#fce; font-weight:bold; padding:4px;">&nbsp;'+title+'</div></td></tr>';
	main += '<tr><td aling="left">'+contents+'</td></tr>';
	main += '</table>';
	return main;
}

window.document.onmousemove = setHelpPos;

function setHelpPos(evt){
	
	if(!document.getElementById('help') || document.getElementById('help').style.display == 'block'){
		return;
	}
	
	sc_top  = document.documentElement.scrollTop  || document.body.scrollTop;
	sc_left = document.documentElement.scrollLeft || document.body.scrollLeft;
	
	if( ua.indexOf("MSIE 5.5") >= 0 || ua.indexOf("MSIE 6") >= 0 || ua.indexOf("MSIE 7") >= 0 ){
		top  = sc_top  + event.clientY + 5;
		left = sc_left + event.clientX + 5;
	} else {
		top  = sc_top  + evt.clientY + 5;
		left = sc_left + evt.clientX + 5;
	}

	document.getElementById('help').style.top  = top+'px';
	document.getElementById('help').style.left = left+'px';
//	window.parent.document.getElementById('help_iframe').style.top  = top;
//	window.parent.document.getElementById('help_iframe').style.left = left;
}