var baseurl = "http://www.utabara.com/";
var menuPreloaded = false;

// Preload menu images
function PreloadMenu()
{
	var d = document;
	// Image filenames
	var OffImg = new Array( "img/menu01.gif", "img/menu02.gif", "img/menu03.gif", "img/menu04.gif", "img/menu05.gif", "img/menu06.gif", "img/menu07.gif" );
	var OnImg = new Array( "img/menu01_up.gif", "img/menu02_up.gif", "img/menu03_up.gif", "img/menu04_up.gif", "img/menu05_up.gif", "img/menu06_up.gif", "img/menu07_up.gif");
	// Create array objects
	d.MenuOnArray = new Array();
	d.MenuOffArray = new Array();
	d.MenuIdArray = new Array( "Menu1", "Menu2", "Menu3", "Menu4", "Menu5", "Menu6", "Menu7");
	// Create image objects and preload files.
	for( i=0; i<7; i++ ) {
		d.MenuOnArray[i] = new Image;
		d.MenuOnArray[i].src = OnImg[i];
		d.MenuOffArray[i] = new Image;
		d.MenuOffArray[i].src = OffImg[i];
	}
	menuPreloaded = true;
}

// Insert menu 
function InsertMenu()
{
	var d = document;
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='index.html' onMouseOver='MenuOn( 0 );' onMouseOut='MenuOff( 0 );'><img src='img/menu01.gif' width='194' height='22' border='0' id='Menu1'></a></td></tr>" );
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='demo/index.html' onMouseOver='MenuOn( 1 );' onMouseOut='MenuOff( 1 );'><img src='img/menu02.gif' width='194' height='22' border='0' id='Menu2'></a></td></tr>" );
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='kaeuta/index.html' onMouseOver='MenuOn( 2 );' onMouseOut='MenuOff( 2 );'><img src='img/menu03.gif' width='194' height='22' border='0' id='Menu3'></a></td></tr>" );
	//d.write( "<tr><td colspan='2' height='24' align='center'><a href='card/index.html' onMouseOver='MenuOn( 3 );' onMouseOut='MenuOff( 3 );'><img src='img/menu04.gif' width='194' height='22' border='0' id='Menu4'></a></td></tr>" );
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='club/index.html' onMouseOver='MenuOn( 4 );' onMouseOut='MenuOff( 4 );'><img src='img/menu05.gif' width='194' height='22' border='0' id='Menu5'></a></td></tr>" );
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='singer/index.html' onMouseOver='MenuOn( 5 );' onMouseOut='MenuOff( 5 );'><img src='img/menu06.gif' width='194' height='22' border='0' id='Menu6'></a></td></tr>" );
	d.write( "<tr><td colspan='2' height='24' align='center'><a href='product/index.html' onMouseOver='MenuOn( 6 );' onMouseOut='MenuOff( 6 );'><img src='img/menu07.gif' width='194' height='22' border='0' id='Menu7'></a></td></tr>" );	
	d.write( "<tr height='3'><td></td></tr>" );
}

// Turn on menu
// menu_id = Menu number (0-5)
function MenuOn( menu_id )
{
	if ( menuPreloaded ) {
		var d = document;
		var x = d.getElementById( d.MenuIdArray[menu_id] );
		if ( x ) x.src = d.MenuOnArray[menu_id].src;
	}
}

// Turn off menu
// menu_id = Menu number (0-5)
function MenuOff( menu_id )
{
	if ( menuPreloaded ) {
		var d = document;
		var x = d.getElementById( d.MenuIdArray[menu_id] );
		if ( x ) x.src = d.MenuOffArray[menu_id].src;
	}
}

// Insert Flash
function InsertFlash( fname, w, h )
{
	var d = document;
	d.write( "<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0' width='" + w + "' height='" + h + "' align='absmiddle'>" );
	d.write( "<param name='movie' value='" + fname + "'>" );
	d.write( "<param name='quality' value='high'>" );
	d.write( "<embed src='" + fname + "' quality='high' pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash' width='" + w + "' height='" + h + "'></embed></object>" );
}

// Insert a file as an IFRAME
function InsertFile( fname, w, h )
{
	var d = document;
	d.write( "<iframe src='" + fname + "' scrolling='auto' frameborder='0' border='0'" );
	if ( w != null ) d.write( " width='" + w + "'" );
	if ( h != null ) d.write( " height='" + h + "'" );
	d.write( "></iframe>" );
}

// Output whole footer (height=55)
function InsertFooter()
{
	var d = document;
	//d.write( "<tr height='145' valign='bottom'>" );
	d.write( "<tr height='55' valign='bottom'>" );
	d.write( "<td align='center'>" );
	//d.write( "<img src='img/footer.gif' width='800' height='145' border='0' usemap='#InquiryMap'>" );
	//d.write( "<img src='img/footer1.gif' width='800' height='55' border='0' usemap='#InquiryMap'>" );
	d.write( "<img src='img/footer2.gif' width='800' height='55' border='0' usemap='#InquiryMap'>" );
	//d.write( "<map name='InquiryMap'><area shape='rect' coords='590,15,690,38' href='/toiawase.html' target='_top'><area shape='rect' coords='699,21,744,38' href='http://www.ntt-at.co.jp/' target='_blank'><area shape='rect' coords='635,40,730,54' href='http://www.ntt-at.co.jp/guide/privacy.html' target='_blank'></map>" );
	d.write( "<map name='InquiryMap'><area shape='rect' coords='590,15,690,38' href='/toiawase.html' target='_top'><area shape='rect' coords='699,21,744,38' href='http://www.ntt-at.co.jp/' target='_blank'></map>" );
	d.write( "</td>" );
	d.write( "</tr>" );
}

// Output whole footer (height=145)
function InsertFooter2()
{
	var i;
	for( i=0; i<4; i++ ) InsertFooterLine( i );
}

// Output footer line
// pos = Footer line no (0-3)
function InsertFooterLine( pos )
{
	var d = document;
	if ( pos == 0 ) {
		// 1st line: height=25
		d.write( "<tr height='25'><td><table width='800' height='25' border='0' cellspacing='0' cellpadding='0'>" );
		d.write( "<tr><td width='170' align='left' valign='bottom'><img src='img/b10.gif' width='170' height='25'></td><td width='*'></td></tr>" );
		d.write( "</table></td></tr>" );
	} else if ( pos == 1 ) {
		// 2nd line: height=62
		d.write( "<tr height='62'><td><table width='800' height='62' border='0' cellspacing='0' cellpadding='0' bgcolor='#FE9135'>" );
		d.write( "<tr>" );
		d.write( "<td width='121'><img src='img/b05.gif' width='121' height='62'></td>" );
		d.write( "<td width='323'><img src='img/b06.gif' width='323' height='62'></td>" );
		d.write( "<td width='144'><img src='img/b07.gif' width='144' height='62'></td>" );
		d.write( "<td width='146'><img src='img/b08.gif' width='146' height='62'></td>" );
		d.write( "<td width='66'><img src='img/b09.gif' width='66' height='62'></td>" );
		d.write( "</tr>" );
		d.write( "</table></td></tr>" );
	} else if ( pos == 2 ) {
		// 3rd line: height=49
		d.write( "<tr height='49'><td><table width='800' height='49' border='0' cellspacing='0' cellpadding='0' bgcolor='#FE9135'>" );
		d.write( "<tr>" );
		d.write( "<td width='121'><img src='img/b01.gif' width='121' height='49'></td>" );
		d.write( "<td width='323' valign='top'><img src='img/b02.gif' width='323' height='32'></td>" );
		d.write( "<td width='144'></td>" );
		d.write( "<td colspan='2' width='212'>" );
		d.write( "<img src='img/b0304.gif' width='212' height='49' border='0' usemap='#InquiryMap'>" );
		d.write( "<map name='InquiryMap'><area shape='rect' coords='0,10,103,49' href='toiawase.html' target='_top'><area shape='rect' coords='104,10,160,49' href='http://www.ntt-at.co.jp/' target='_blank'></map>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table></td></tr>" );
	} else if ( pos == 3 ) {
		// 4th line: height=9
		d.write( "<tr height='9'><td><table width='800' height='9' border='0' cellspacing='0' cellpadding='0' bgcolor='#FE9135'>" );
		d.write( "<tr>" );
		d.write( "<td width='121'></td>" );
		d.write( "<td width='*' align='left' valign='top'><img src='img/copy.gif' width='432' height='9'></td>" );
		d.write( "</tr>" );
		d.write( "</table></td></tr>" );
	}
}

// Open a singer window
// fname = Filename
// w = Window width
// h = Window height
function OpenSingerWindow( fname, w, h )
{
	var wndWidth = w + 20;
	var wndHeight = h + 20;
	var newWnd = window.open( baseurl + fname, "SingerWindow", "width=" + wndWidth + ",height=" + wndHeight + ",resizable=no" );
	if ( newWnd ) {
		newWnd.focus();
	}
}

// View Q&A text
// pageno = Q&A page number (0-1)
// * innerHTML of qatext is updated.
function ShowQAText( pageno )
{
	var htmltext = "";
	if ( pageno == 0 ) {
		htmltext = "<iframe src='club/horn.html' scrolling='auto' frameborder='0' border='0' width='564' height='230'></iframe>";
	} else if ( pageno == 1 ) {
		htmltext = "<iframe src='club/utabara.html' scrolling='auto' frameborder='0' border='0' width='564' height='230'></iframe>";
	}
	if ( htmltext != "" ) document.all.qatext.innerHTML = htmltext;
}

// Open a new window for a flash file.
// fname = Filename
// w = Window width
// h = Window height
function OpenFlashWindow( fname, w, h )
{
	var wnd = window.open( fname, "FlashWindow", "width=" + w + ",height=" + h );
	if ( wnd ) wnd.focus();
}

// Insert a link to flash installer
function InsertFlashInstaller()
{
	var d = document;
	d.write( "<a href='http://www.adobe.com/go/getflashplayer' target='_blank'>" );
	d.write( "<img src='" + baseurl + "kaeuta/img/160x41_Get_Flash_Player.jpg' width='160' height='41' border='0'>" );
	d.write( "</a>" );
}

var FloatingLayerMarginX = 0;
var FloatingLayerMarginY = 0;

// Start timer
// margin_x = Horizontal margin in the right side of floating layer
// margin_y = Vertial margin at the bottom of floating layer
// * OnTimer() is called in every 200ms.
function StartTimer( margin_x, margin_y )
{
	FloatingLayerMarginX = margin_x;
	FloatingLayerMarginY = margin_y;
	window.setInterval( "OnTimer();", 200 );
}

// Timer function
function OnTimer()
{
	var b = document.body;
	var l = FloatingLayer;
	var x, y;
	x = b.clientWidth - l.width - FloatingLayerMarginX + b.scrollLeft;
	y = b.clientHeight - l.height - FloatingLayerMarginY + b.scrollTop;
	l.style.pixelLeft = x;
	l.style.pixelTop = y;
}

// Open kaeuta list window
function OpenKaeutaList()
{
	var newWnd = window.open( baseurl + "cgi-bin/KaeutaList.cgi", "KaeutaList", "width=672,height=565,scrollbars=yes,resizable=no,status=no,menubar=0,titlebar=no" );
	if ( newWnd ) newWnd.focus();
}

// Insert column line for demo
function InsertDemoHeader()
{
	var d = document;
	d.write( "<tr height='200'><td width='800'>" );
	d.write( "<table width='800' height='200' border='0' cellspacing='0' cellpadding='0'><tr height='200'>" );
	InsertHeaderColumn( 0 );
	InsertHeaderColumn( 4 );
	InsertHeaderColumn( 1 );
	d.write( "</tr></table>" );
	d.write( "</td></tr>" );
}

// Insert column line for kaeuta
function InsertKaeutaHeader()
{
	var d = document;
	d.write( "<tr height='200'><td width='800'>" );
	d.write( "<table width='800' height='200' border='0' cellspacing='0' cellpadding='0'><tr height='200'>" );
	InsertHeaderColumn( 0 );
	InsertHeaderColumn( 2 );
	InsertHeaderColumn( 1 );
	d.write( "</tr></table>" );
	d.write( "</td></tr>" );
}

// Insert column line for card
function InsertCardHeader()
{
	var d = document;
	d.write( "<tr height='200'><td width='800'>" );
	d.write( "<table width='800' height='200' border='0' cellspacing='0' cellpadding='0'><tr height='200'>" );
	InsertHeaderColumn( 0 );
	InsertHeaderColumn( 3 );
	InsertHeaderColumn( 1 );
	d.write( "</tr></table>" );
	d.write( "</td></tr>" );
}

// Insert column line for club
function InsertClubHeader()
{
	var d = document;
	d.write( "<tr height='200'><td width='800'>" );
	d.write( "<table width='800' height='200' border='0' cellspacing='0' cellpadding='0'><tr height='200'>" );
	InsertHeaderColumn( 0 );
	InsertHeaderColumn( 5 );
	InsertHeaderColumn( 1 );
	d.write( "</tr></table>" );
	d.write( "</td></tr>" );
}

// Insert a header column
// pos = Column position (0-4)
function InsertHeaderColumn( pos )
{
	var d = document;
	if ( pos == 0 ) {
		// Left part
		d.write( "<td width='200' valign='top'><img src='img/logo.gif' width='190' height='178'></td>" );
	} else if ( pos == 1 ) {
		// Right part
		d.write( "<td width='200' valign='top'>" );
		d.write( "<table border='0' width='200' height='200' cellpadding='0' cellspacing='0' class='smallfont'>" );
		d.write( "<tr height='36'><td align='right' valign='bottom'><a href='rule.html'>利用規約</a>&nbsp;&nbsp;</td></tr>" );
		d.write( "<script language='JavaScript'>InsertMenu();</script>" );
		d.write( "</table>" );
		d.write( "</td>" );
	} else if ( pos == 2 ) {
		// Middle part of kaeuta
		d.write( "<td width='400' valign='top'>" );
		d.write( "<table width='400' height='200' border='0' cellpadding='0' cellspacing='0' class='smallfont'>" );
		d.write( "<tr height='60' valign='center'><td><img src='kaeuta/img/title.gif' width='218' height='36'></td></tr>" );
		d.write( "<tr height='60' valign='center'>" );
		d.write( "<td>" );
		d.write( "<font color='#666666'>" );
		d.write( "「<strong><font color='#67C820'>替え歌GoGo!</font></strong>」は、皆様に楽しみながら「<font color='#67C820'><strong>替え歌</strong></font>」を作って遊んで<br>" );
		d.write( "いただくためのコーナーです。あっと言う間に替え歌が作れますので、<br>" );
		d.write( "ぜひトライしてみてください！</font>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "<tr height='40' valign='center'>" );
		d.write( "<td>" );
		d.write( "<a href=\"JavaScript:OpenFlashWindow( '" + baseurl + "kaeuta/src/utabara_17.swf', 400, 300 );\"><img src='kaeuta/img/flash_title.gif' width='33' height='33' border='0' align='absmiddle'></a>" );
		d.write( "&nbsp;&nbsp;" );
		d.write( "<span class='mediumfont'><font color='#FF3300'><strong>遊び方をFlashで見る！</strong></font></span>" );
		d.write( "&nbsp;&nbsp;" );
		d.write( "<script language='JavaScript'>InsertFlashInstaller();</script>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "<tr height='40'>" );
		d.write( "<td align='center'>" );
		d.write( "<font color='#485CEB'>このページではFlash Playerが必要です。<br>上のロゴをクリックし、ダウンロードしてください。</font>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table>" );
		d.write( "</td>" );
	} else if ( pos == 3 ) {
		// Middle part of card
		d.write( "<td width='400' valign='top'>" );
		d.write( "<table width='400' height='200' border='0' cellpadding='0' cellspacing='0' class='smallfont'>" );
		d.write( "<tr height='60' valign='center'><td><img src='card/img/title.gif' width='218' height='36'></td></tr>" );
		d.write( "<tr height='140' valign='center'>" );
		d.write( "<td>" );
		d.write( "<font color='#666666'>「<strong><font color='#339900'>カードを送ろう!</font></strong>」は、グリーティングカードを作り、<br>" );
		d.write( "そのURLを相手にお知らせすることによって、<br>" );
		d.write( "あなたの想いを相手の方に伝えるためのコーナーです。<br>" );
		d.write( "<br>" );
		d.write( "グリーティングカードは、<font color='#FF6600'><strong>Flashアニメーション</strong></font>とワンダーホルンで作成した<br>" );
		d.write( "<font color='#FF6600'><strong>歌声合成データ</strong></font>を組み合わせて作成します。<br>" );
		d.write( "使い方は非常に簡単ですので、ぜひお試しください。</font>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table>" );
		d.write( "</td>" );
	} else if ( pos == 4 ) {
		// Middle part of demo
		d.write( "<td width='400' valign='top'>" );
		d.write( "<table width='400' height='200' border='0' cellpadding='0' cellspacing='0' class='smallfont'>" );
		d.write( "<tr height='60' valign='center'><td><img src='demo/img/title.gif' width='228' height='36'></td></tr>" );
		d.write( "<tr height='140' valign='center'>" );
		d.write( "<td>" );
		d.write( "<font color='#666666'>「<strong><font color='#339900'>聴いてみよう!</font></strong>」へようこそ！<br>" );
		d.write( "ここは、<font color='#FF6600'><strong>ワンダーホルン</strong></font>で作成した歌声を聴いていただくコーナーです。<br>" );
		d.write( "<br>" );
		d.write( "コンピューターによって作り出された歌声がどんなものなのか、<br>" );
		d.write( "ぜひ聴いてみてください。" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table>" );
		d.write( "</td>" );
	} else if ( pos == 5 ) {
		d.write( "<td width='400' align='center'>" );
		d.write( "<table width='400' height='200' border='0' cellpadding='0' cellspacing='0' class='smallfont'>" );
		d.write( "<tr height='60' valign='center'><td><img src='club/img/title.gif' width='228' height='36'></td></tr>" );
		d.write( "<tr height='40' valign='center'>" );
		d.write( "<td>" );
		d.write( "<font color='#666666'>「<font color='#339900'><strong>うたばらクラブ</strong></font>」へようこそ！<br>" );
		d.write( "ここではワンダーホルンの技術を簡単に紹介したり、皆様からのご質問にお答えします。</font>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "<tr height='100' valign='center'>" );
		d.write( "<td align='center'>" );
		d.write( "<table width='300' height='50' border='1' cellpadding='2' cellspacing='3' bordercolor='#FE9134' class='smallfont'>" );
		d.write( "<tr height='50'>" );
		d.write( "<td align='center'>" );
		d.write( "<a href='club/qa.html'><img src='club/img/q&a.gif' width='65' height='34' border='0' align='absmiddle'></a>" );
		d.write( "&nbsp;&nbsp;&nbsp;<font color='#0000FF'>よくある質問と回答です。</font>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table>" );
		d.write( "</td>" );
		d.write( "</tr>" );
		d.write( "</table>" );
		d.write( "</td>" );
	}
}

// More news
// news_id = News ID number (0=news list)
function MoreNews( top_id, news_id, list_flag )
{
	var param = "?id=" + news_id
	if ( top_id > 0 ) param += "&top=" + top_id
	if ( list_flag == 0 ) param += "&list=0"
	var newWnd = window.open( baseurl + "cgi-bin/NewsList.cgi" + param, "UtabaraNews", "width=520,height=500,resizable=yes" );
	if ( newWnd ) newWnd.focus();
}

// Open Q&A window
// cat_id = Category ID
// top_id = Q&A item ID(TOP)
// qa_id = Q&A item ID
// list_flag = 0:Do not show the list / else:Show the list
function QAWindow( cat_id, top_id, qa_id, list_flag )
{
	var param = "?cat=" + cat_id
	if ( top_id > 0 ) param += "&top=" + top_id
	if ( qa_id > 0 ) param += "&id=" + qa_id
	if ( list_flag == 0 ) param += "&list=0"
	var newWnd = window.open( baseurl + "cgi-bin/QAList.cgi" + param, "UtabaraQA", "width=550,height=400,scrollbars=yes,resizable=0,status=no,menubar=0,titlebar=no" );
	if ( newWnd ) newWnd.focus();
}

// Play kaeuta with lyrics window
function KaeutaPlay( name, pubid )
{
	var newWnd = window.open( baseurl + "cgi-bin/KaeutaPlay.cgi?name=" + name + "&pubid=" + pubid, "KaeutaPlay", "width=430,height=250" );
	location.href = baseurl + "kaeuta/pub/" + name + ".wav";
	if ( newWnd ) newWnd.focus();
}
