// tfmenu.js  ver 1.0
// http://www.kakura.jp/pg/tfmenu/
//
// Daisuke Kakura <info@kakura.jp> "2006-11-06 Mon 18:13:35 Sao Paulo, Brazil"
// Some Rights Reserved under Creative Commons License.
// http://creativecommons.org/licenses/by/2.1/jp/

var expand_speed = 150;	 
var updown_speed =  5;	 
var steps		  =  30;	 
var jump			  =	1;	 
var sticky		  =	1;	 

// メニュー HTML (下記の説明参照)
var menu_html =

"<div id='tfm-body'>" +
"<div id='item1'     ><img src='../img/center/menu/menu_top.gif' width='235' height='20'>" +

"</div>" +
"<div id='item2'    class='tf2'><a href='../english/r_d_center2.html#1'><img src='../english/img/second/menu_process.gif' alt='Process Development of Chiral compounds' border='0'></a>" +

"</div>" +
"<div id='item3'     class='tf1'><a href='../english/r_d_center2.html#11'>Technology</a>" +

"</div>" +
"<div id='item4'     class='tf1'><a href='../english/r_d_center2.html#111'>　Asymmetric chemical catalysts</a>" +

"</div>" +
"<div id='item5'     class='tf1'><a href='../english/r_d_center2.html#112'>　　Maruoka Catalyst&reg;(Asymmetric phase transfer cat.)</a>" +

"</div>" +
"<div id='item6'     class='tf1'><a href='../english/r_d_center2.html#113'>　　Shibazaki Catalyst（ALB）</a>" +

"</div>" +
"<div id='item7'     class='tf1'><a href='../english/r_d_center2.html#114'>　Bio Catalyst（Enzyme, Fermentation by microorganism）</a>" +

"</div>" +
"<div id='item8'     class='tf1'><a href='../english/r_d_center2.html#115'>　Optical resolution</a>" +

"</div>" +
"<div id='item9'     class='tf1'><a href='../english/r_d_center2.html#116'>　Chiral pool</a>" +

"</div>" +
"<div id='item10'     class='tf1'><a href='../english/r_d_center2.html#12'>Products</a>" +

"</div>" +
"<div id='item11'     class='tf1'><a href='../english/r_d_center2.html#121'　>Unnatural Amino Acid</a>" +

"</div>" +
"<div id='item12'     class='tf1'><a href='../english/r_d_center2.html#122'>　Chiral Carbonic Acid</a>" +

"</div>" +
"<div id='item13'     class='tf1'><a href='../english/r_d_center2.html#123'>　Chiral Alcohol</a>" +

"</div>" +
"<div id='item14'     class='tf1'><a href='../english/r_d_center2.html#124'>　Chiral Amine</a>" +

"</div>" +
"<div id='item15'     class='tf2'><img src='../img/center/menu/border.gif' width='215' height='3' border='0'><a href='../pdf/unaa_lib14e.pdf' target='_blank'><img src='../english/img/second/menu_library.gif' alt='Nagase's Library of Unnatural Amino Acids' name='Image52' border='0'>" +

"</div>" +
"<div id='item16'     class='tf2'><img src='../img/center/menu/border.gif' width='215' height='3' border='0'><a href='../english/pdf/02.pdf' target='_blank'><img src='../english/img/second/menu_nagase_provides.gif' alt='Nagase Provides Unnatural Amino Acids Using Maruoka Asymmetric Catalyst Technology' name='Image354' border='0'></a>" +

"</div>" +
"<div id='item17'     class='tf2'><img src='../img/center/menu/border.gif' width='215' height='3' border='0'><a href='../english/r_d_center2.html#3'><img src='../english/img/second/menu_drug.gif' alt='Drug discovery tools' name='Image54' border='0'></a>" +

"</div>" +
"<div id='item18'     class='tf2'><img src='../img/center/menu/border.gif' width='215' height='3' border='0'><a href='../english/r_d_center2.html#4'><img src='../english/img/second/menu_analysis.gif' alt='Analysis and test services of imported drugs and intermediates' name='Image55' border='0'></a>" +

"</div>" +
"<div id='item19'     class='tf2'><img src='../img/center/menu/border.gif' width='215' height='3' border='0'><a href='../english/r_d_center.html'><img src='../english/img/second/menu_r_d_center.gif' alt='Nagase R&amp;D Center' name='Image56' border='0'></a><img src='../img/center/menu/border.gif' width='215' height='3' border='0'>" +

"</div>" +
"<div id='item20'     class='tf1'><img src='../img/common/sp.gif' width='10' height='10'>" +

"</div>" +
"<div id='item21'     class='tf1'><a href='mailto:pharma@nagase.co.jp'><img src='../english/img/second/contact.gif' width='153' height='38' border='0' alt='contact'></a>" +

"</div>" +
"<div id='item22'     class='tf1'><img src='../img/common/sp.gif' width='3' height='3'>" +

"</div>" +
"<div id='item23'     class='tf1'><a href='#112'><img src='../english/img/second/bana_maruoka.gif' width='150' height='40' border='0' alt='Maruoka Cat(TM)'></a>" +

"</div>" +
"<div id='item24'     ><img src='../img/center/menu/menu_bottom.gif' width='235' height='13'>" +

"</div>" +

"</div>" ;  // end of #tfm-body


// 設定可能な変数 ここまで  -------------------------------------------------------------


// 説明  --------------------------------------------------------------------------------
/*
// ++++++++++  tfmenu.js で使用する id と class 名、および上下関係

#tfmenu                        メニュー全体
#tfmenu #tfm-head              メニュー上部
#tfmenu #tfm-body              メニュー本文 上記の menu_html はここに入る
#tfmenu #tfm-body .tf1         メニュー親項目
#tfmenu #tfm-body .tf1active   開いているメニュー親項目
#tfmenu #tfm-body .tf1 .tf2    メニュー子項目
#tfmenu #tfm-foot              メニュー下部

menu_html の内容は tfmenu.js (このファイル) を直接書き換えてください。
これにより、ひとつのファイルを書き換えるだけで、すべてのページに反映さ
れるようになります。

// ++++++++++  メニュー移動時に #tfmenu に付加される class 名

.tfm-up                        上昇中
.tfm-down                      下降中
.tfm-stop                      停止中

移動中の状態を class で指定することにより、状態に合わせてデザインを変
更できます。

// ++++++++++  メニュー HTML の書き方

#tfm-body 内のメニュー項目は、<div> で作ります。子項目の .tf2 は、親項
目である .tf1 の内側に配置してください。tfm-body の終了タグを忘れない
ように。

例:

"<div id='tfm-head'></div>" +
"<div id='tfm-body'>" +
"<div class='tf1'>親項目 1" +
"   <div class='tf2'>子項目 1.1</div>" +
"   <div class='tf2'>子項目 1.2</div>" +
"   <div class='tf2'>子項目 1.3</div>" +
"</div>" +
"<div class='tf1'>親項目 2" +
"   <div class='tf2'>子項目 2.1</div>" +
"   <div class='tf2'>子項目 2.2</div>" +
"   <div class='tf2'>子項目 2.3</div>" +
"</div>" +
"</div>" +  // end of #tfm-body
"<div id='tfm-foot'></div>";


// ++++++++++  HTML にメニューを配置する方法

<head> タグの中に下記の一行を追加。

<script type="text/javascript" src="tfmenu.js"></script>

<body> タグの中、メニューを配置したい場所に下記の一行を追加。

<div id="tfmenu"></div>

予め特定のメニュー項目を開いておきたい場合は、menu_html 内の親項目に
id を付けて、その id を上記の一行に name として指定する。

例:

menu_html の内容

"<div id='tfm-head'></div>" +
"<div id='tfm-body'>" +
"<div id='oya1' class='tf1'>親項目 1" +
"   <div class='tf2'>子項目 1.1</div>" +
"   <div class='tf2'>子項目 1.2</div>" +
"   <div class='tf2'>子項目 1.3</div>" +
"</div>" +
"</div>" +  // end of #tfm-body
"<div id='tfm-foot'></div>";

name="item3" を追加。

<div id="tfmenu" name="item3"></div>

*/

// ここから下は変更しないでください------------------------------------------------------

var curr_y;
var istimerc_on = 0;
var istimere_on = 0;
var limit_y;
var menu_pos = new Object();
var status_p;
var tfm_body;
var tfmenu;

function expandMenu(e) {
	var close_only = 0;
	var col_elem;
	var exp_elem;
	var ic;
	var ie;
	var isopen = 0;
	var target_elem;
	var target_node;
	var timerc;
	var timere;

	var collapseItem = function() {
		if(col_elem[ic]) {
			setVisibility(col_elem[ic], "hidden");
			ic++;
		} else {
			clearInterval(timerc);
			istimerc_on = 0;
		}
	}
	var expandItem = function() {
		if(!istimerc_on) {
			if(exp_elem[ie]) {
				setVisibility(exp_elem[ie], "visible");
				ie++;
			} else {
				clearInterval(timere);
				istimere_on = 0;
			}
		}
	}

	if(e.target) {
		target_node = e.target;
	} else if (e.srcElement) {
		target_node = e.srcElement;
	}
	// for Safari.
	if (target_node.nodeType == 3) {
		target_node = target_node.parentNode;
	}
	target_elem = target_node.getElementsByTagName("div");
	// if a gap between items (background tfm_body) was clicked, ignore.
	if(target_node.id == "tfm-body") {
		return;
	}
	// if clicked top item was already open, just close it.
	if(target_elem[0]) {
		if(target_elem[0].style.visibility == "visible") {
			close_only = 1;
		}
	}
	// collapse menu.
	if(!istimerc_on && !istimere_on) {
		for(var i = 0; i < tfm_body.length && !isopen; ++i) { // search the first visible chiled item.
			col_elem = tfm_body[i].getElementsByTagName("div");
			for(var ii = 0; ii < col_elem.length; ++ii) {
				if(col_elem[ii].style.visibility == "visible") {
					isopen = 1;
					break;
				}
			}
		}
		if(isopen) {
			ic				= 0;
			istimerc_on = 1;
			timerc		= setInterval(collapseItem, expand_speed);
		}
	}
	// expand active menu items.
	if(!istimere_on && !close_only) {
		exp_elem		= target_elem;
		ie				= 0;
		istimere_on = 1;
		timere		= setInterval(expandItem, expand_speed);
	}
}

function setVisibility(e, value) {
	e.style.visibility = value;
	if(value == "hidden") {
		e.style.lineHeight	  = "0px";
		e.parentNode.className = "tf1";
	} else {
		e.style.lineHeight	  = "100%";
		e.parentNode.className = "tf1active";
	}
}

function setTopPos() {
	var target_y	 = document.body.scrollTop;
//	var suffix_y;
	var dance_steps = steps;
	var distance;
	var status;

	distance	= Math.abs(target_y - curr_y);

	// if menu box was too far from active area, then speed up.
	if(jump && tfmenu.offsetHeight * 2 < distance) {
		dance_steps = steps * 10;
	}
	// slow down if it's getting closer.
	if(distance < 25) {
		dance_steps = 1;
	}
	// do not exceed bottom of parent element.
	if(limit_y <= target_y) {
		target_y	= limit_y;
		curr_y	= limit_y;
	}
	// going up or donw?
	if(curr_y > target_y) {
		curr_y -= dance_steps; // ascending
		status = "tfm-up";
	} else if(curr_y < target_y) {
		curr_y += dance_steps; // descending
		status = "tfm-down";
	} else {
		status = "tfm-stop";
	}
	if(distance != 0) {
		tfmenu.style.top = curr_y + "px";
	}
	// change status (class name)
	if(status_p != status) {
		status_p = status;
		tfmenu.className = status;
	}
}

function setListeners(e) {
	var i;
	var ii;
	tfmenu			  = document.getElementById("tfmenu");
	tfmenu.innerHTML = menu_html;
	tfm_body			  = document.getElementById("tfm-body")
	addListener(tfm_body, 'mousedown', expandMenu, false);
	tfm_body			  = tfm_body.childNodes;

	for(i = 0; i < tfm_body.length; ++i) {
		// if name property was set, make that node (id) to visible.
		var items = tfm_body[i].getElementsByTagName("div");
		var visib = "hidden";
		if(tfmenu.name == tfm_body[i].id) {
			visib = "visible";
		}
		for(ii = 0; ii < items.length; ++ii) {
			setVisibility(items[ii], visib);
		}
	}
	if(sticky) {
		curr_y					 = document.body.scrollTop;
		tfmenu.style.position = "absolute";
		tfmenu.style.top		 = curr_y + "px";
		tfmenu.style.left		 = 0 + "px";
		setInterval("setTopPos()", updown_speed);
	}
	// bug: if there is no parent element, limit_y will be screen height which is too short.
	limit_y = tfmenu.parentNode.offsetHeight - tfmenu.offsetHeight;
}

function addListener(elem, eventType, func, cap) {
	if(elem.addEventListener) {
		elem.addEventListener(eventType, func, cap);
	} else if(elem.attachEvent) {
		elem.attachEvent('on' + eventType, func);
	} else {
		window.alert("Sorry... Please use Internet Explorer or Firefox.");
		return false;
	}
}

addListener(window, 'load', setListeners, false);

// eof