
// cookie by とほほ
times = getCookie("Times"); // 訪問回数
if (times == "") {
    times = 0;
}
times++;
setCookie("Times", times);


last_date = getCookie("Last"); // 前回訪問日
dd = new Date();
ye = dd.getYear();      if (ye < 1900) ye += 1900;
mo = dd.getMonth() + 1; if (mo < 10) mo = "0" + mo;
da = dd.getDate();      if (da < 10) da = "0" + da;
ho = dd.getHours();     if (ho < 10) ho = "0" + ho;
mi = dd.getMinutes();   if (mi < 10) mi = "0" + mi;
se = dd.getSeconds();   if (se < 10) se = "0" + se;
date = ye + "/" + mo + "/" + da + " " + ho + ":" + mi + ":" + se;
setCookie("Last", date);


var guide_mode = true;
if (getCookie("guide")=='off') {
	guide_mode = false;
}



if (guide_mode) {
	Layers.add(0,100,350,80,0.85,document.createTextNode(' '));
	Layers.add(0,170,350,80,0.85,document.createTextNode(' '));
	Layers.add(0,240,350,85,0.85,document.createTextNode(' '));
	Layers.add(0,320,350,120,0.85,document.createTextNode(' '));
	Layers.add(0,425,350,100,0.85,document.createTextNode(' '));
	Layers.add(0,525,350,60,0.85,document.createTextNode(' '));
	Layers.add(0,580,350,70,0.85,document.createTextNode(' '));
	Layers.add(350,100,660,700,0.85,document.createTextNode(' '));
	Layers.add(0,650,350,150,0.85,document.createTextNode(' '));
}

var route_kun = document.createElement('img');
var guide=document.createElement('div');

function guideAction9000() {
		guide_mode=false;
		Layers.disappear(0);
		Layers.disappear(1);
		Layers.disappear(2);
		Layers.disappear(3);
		Layers.disappear(4);
		Layers.disappear(5);
		Layers.disappear(6);
		Layers.disappear(7);
		Layers.disappear(8);
		route_kun.style.display="none";
		guide.style.display="none";
}

function guideAction100() {
	route_kun.src='./images/route_kun.png';
	route_kun.style.position = "absolute";
	route_kun.style.top= "200px";
	route_kun.style.left= "200px";
	route_kun.ondblclick
	= function() {
		guide.innerHTML='バイバーイ！！';
		setTimeout(guideAction9000, 2000)
	}
	route_kun.id= "route_kun";

	document.body.appendChild(route_kun);

	guide.id='guide';
	guide.style.position = 'absolute';
	guide.style.top="200px";
	guide.style.left="250px";
	guide.style.width="400px";


	if (last_date) {
		today = new Date;
		past_days = Math.floor((today.getTime() - Date.parse(last_date))/1000/60/60/24);
		guide.style.width="300px";
		if (past_days>7) {
			msg  ='お久しぶりです！『ルート君』です。<br /><br />';
		} else {
			msg  ='こんにちは！『ルート君』です。<br /><br />';
		}
		msg += 'ガイドを続ける場合には<br /><center><a href="javascript:guideAction200();">ここ</a></center>をクリックしてね。';
		msg += '<br /><br />ガイドが要らなくなったら、いつでも僕をダブルクリックしてね。';
		msg += '<br /><br />ガイドが不必要な場合は<br /><center><a href="javascript:guideAction101();">ここ</a></center>をクリックしてね。';
		guide.innerHTML=msg;
	} else {
		guide.innerHTML='ROUTE MAPサービスへようこそ！<br /><br />僕は、このサービスの案内人『ルート君』です。<br />よろしくね。<br /><br />それじゃあ、早速、ROUTEMAPを作成してみよう。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction200()">次へ</a></u></center>';
	}

	document.body.appendChild(guide);

}

function guideAction101() {
	setCookie("guide", 'off');
	route_kun.ondblclick();
}

function guideAction200() {
	Layers.disappear(0);
	guide.innerHTML='まずは、ここで、開始地点を検索するんだ。<br /><br />住所を入れて、検索ボタンをクリックしてね。<br /><br />開始地点は住所以外にも「横浜駅」のようなランドマークでもOK！';
	guide.style.width="200px";
	guide.style.top="180px";
	guide.style.left="85px";
	route_kun.style.top="180px";
	route_kun.style.left="50px";
}

function guideAction300() {
	Layers.disappear(7);
	guide.innerHTML='周辺の地図とポイントが表示されたよね。<br /><br />案内開始地点が、アイコンで示されているポイントと違う場合は、地図上をクリックして、案内開始地点を変更してね。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction400()">次へ</a></u></center>';
}

function guideAction400() {
	guideAction450();
	/*
	guide.innerHTML='また、地図をマウスで掴んだまま、マウスを動かしてみよう。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction450()">次へ</a></u></center>';
	*/
}

function guideAction450() {
	route_kun.style.left="320px";
	route_kun.style.top="160px";
	guide.innerHTML='地図の縮尺を変えるには、地図左上の＋と－を使うんだ。<br />＋が拡大、－が縮小だよ。<br><br>ちょっとクリックしてみて。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction480()">次へ</a></u></center>';
	guide.style.left="80px";
	guide.style.top ="150px";
}


function guideAction480() {
	guide.innerHTML='このようにして、案内開始地点が設定できたら、次に進もう。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction500()">次へ</a></u></center>';
}

function guideAction500() {
	Layers.disappear(1);
	route_kun.style.left="10px";
	route_kun.style.top="250px";
	guide.style.left="50px";
	guide.style.top ="250px";
	guide.innerHTML='次は地図の大きさの選択だ。好きなサイズを選んでね。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction600()">次へ</a></u></center>';
}

function guideAction600() {
	Layers.disappear(2);
	route_kun.style.left="10px";
	route_kun.style.top="350px";
	guide.style.left="50px";
	guide.style.top ="350px";
	guide.innerHTML='地図に表示されるオプションが選択できるよ。<br /><br/>表示したい項目のチェックボックスをチェックしてね。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction800()">次へ</a></u></center>';
}

function guideAction700() {
	Layers.disappear(4);
	route_kun.style.left="10px";
	route_kun.style.top="550px";
	guide.style.left="50px";
	guide.style.top ="550px";
	guide.innerHTML='地図上に表示する目的地アイコンを変更できるよ。<br /><br />好きなアイコンをクリックしてね。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction1000()">次へ</a></u></center>';
}

function guideAction800() {
	Layers.disappear(3);
	route_kun.style.left="10px";
	route_kun.style.top="450px";
	guide.style.left="50px";
	guide.style.top ="450px";
	guide.innerHTML='さあ、道順をつくろう。<br />まず、作成開始ボタンをクリック';
}

function guideAction810() {
	route_kun.style.left="320px";
	route_kun.style.top="550px";
	guide.style.left="80px";
	guide.style.top ="550px";
	guide.innerHTML='地図の枠が青くなったね。これが、作成モードの証なんだ。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction830()">次へ</a></u></center>';
}

function guideAction820() {
	guide.innerHTML='案内の開始地点（最寄駅など）をクリックしてね。<br /><br />地図に表示されていない時は、地図を掴んで、動かして表示させてね！';
}

function guideAction830() {
	guide.innerHTML='次に道順に沿って、地図上をクリックしていくんだ。';
}

function guideAction835() {
	route_kun.style.left="10px";
	route_kun.style.top="450px";
	guide.style.left="50px";
	guide.style.top ="450px";
	guide.innerHTML='目的地まで線が引けたら、「作成終了」ボタンを押そう。';
}

function guideAction840() {
	guide.innerHTML='どう？うまく引けたかな？<br />慣れないとなかなか難しいよね？<br />でも、大丈夫。安心して。ROUTEMAPサービスにはROUTEの編集機能があるんだ。<br>「道順の編集」ボタンをクリックしてみよう';
}

function guideAction900() {
	route_kun.style.left="320px";
	guide.style.left="80px";
	guide.innerHTML='地図の枠が緑になったね。これが、編集モードの証なんだ。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction910()">次へ</a></u></center>';
}

function guideAction910() {
	guide.innerHTML='開始点と目的地の他に、ポイントが黒で表示されたね。<br />このポイントはマウスで掴んで移動できるよ。<br /><br />また、ポイントを結んでいる線上でクリックしてみよう。新しくポイントが追加できるよ。<br />逆にポイントを削除するには、ポイントをダブルクリックするんだ。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction920()">次へ</a></u></center>';
}

function guideAction920() {
	route_kun.style.left="10px";
	guide.style.left="50px";
	guide.innerHTML='編集が終了したら、「編集終了」を押して完了。<br /><br />';
}

function guideAction1000() {
	Layers.disappear(5);
	route_kun.style.top="590px";
	route_kun.style.left="10px";
	guide.style.top="590px";
	guide.innerHTML='道順の途中途中の説明を追加しよう。<br /><br />「説明を追加」ボタンを押してね。';
}

function guideAction1010() {
	route_kun.style.left="320px";
	guide.style.left="80px";
	guide.innerHTML='地図の枠が黄色くなって、説明追加モードになっていることを示しているよ。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction1020()">次へ</a></u></center>';
}

function guideAction1020() {
	guide.innerHTML='ポイントをクリックして説明を追加しよう。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction1030()">次へ</a></u></center>';
}

function guideAction1030() {
	route_kun.style.left="10px";
	guide.innerHTML='説明の追加が終了したら、ここをクリック<br /><br />';
}

function guideAction1100() {
	Layers.disappear(6);
	route_kun.style.top="600px";
	route_kun.style.left="300px";
	guide.style.top="600px";
	guide.style.left="350px";
	guide.innerHTML='最後にタイトルを入力しよう。<br /><br /><center><u><a href="javascript:void(0)" onclick="guideAction1200()">次へ</a></u></center>';
}

function guideAction1200() {
	Layers.disappear(8);
	route_kun.style.top="630px";
	guide.style.top="630px";
	guide.innerHTML='作ったROUTE MAPを保存しよう。<br /><br />保存の前にプレビューで確認してみようか。<br /><br />「プレビュー」をクリックしてね。';
}

function guideAction2000() {
	guide.innerHTML='これで、全ての説明が終了です。ROUTE MAPサービスでどんどん遊んでね。<br /><br />僕をダブルクリックしてね。<br /><br />';
}

if (guide_mode) guideAction100();


