<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
	<head>
		<meta http-equiv="content-type" content='text/html; charset="utf-8"' />
		<meta http-equiv="content-style-type" content="text/css" />
		<title><?php _e('Database'); ?>:<?php _e('Setup 3'); ?></title>
		<style type="text/css" media="screen">
/**************************/
BODY	{	/* ボディー */
	color: black;	margin: 0px 0px 20px 0px;	background-color: #444444;	text-align: center;
}
#header {	/* ヘッダー */
	width: 800px;	height: 134px;	color: white;	font-size:0.8em;	background-color: #444444;
	background-image: url(./developers/header.jpg);	background-repeat: no-repeat;
	margin: 0px auto;	padding:0px;
}
#header A:link	{ color: white; }
#header A:visited { color: white; }
#header A:active  { color: white; }
#header A:hover   { color: black; background-color: white; }

#content	{	/* コンテンツ */
	width: 798px;	color: white;	background-color: black;	text-align: left;	margin: 0px auto;
	padding: 0px;	border-left: 1px solid #072D87;	border-right: 1px solid #072D87;	font-size:0.8em;
}
#footer {	/* フッター */
	width: 800px;	height: 10px;	color: white;	background-color: #444444;
	background-image: url(./developers/bottom.gif);	background-repeat: no-repeat;
	text-align: left;	margin: 0px auto;	padding: 0px;
}
DIV.copyright {	/* 各ページ設定 */
	width: 300px;	height: 10px;	font-size: 11px;	margin: 0px auto;	padding-top: 0px;	padding-bottom: 2px;
}
/**************************/
UL.horizontal {	/* 横並びリスト */
	margin: 0;	padding: 0;	list-style: none;
}
UL.horizontal LI {
	float: left;	display: block;	margin: 0;	padding: 0;
}
TH.column {	/* テーブル */
	width: 160px;	background-color: #01133C;	padding: 3px;	text-align: right;	vertical-align:top;
}
TD.data {	/* テーブル */
	background-color: #01133C;	padding: 3px;	text-align: left;	vertical-align:top;
}
TD.button {	/* テーブル */
	background-color: #01133C;	padding: 3px;	text-align: center;
}
TD.head {	/* テーブル */
	font-size:1.2em;	font-weight: bold;	background-color: #01133C;	padding: 3px;	text-align: center;
}
DIV.title {	/* タイトル			   */
	width:740px;	color: #C9FEE6;	background-color: #002B39;	margin: 0px auto;	padding: 0;
	text-align: center;	font-weight: bold;	font-size: 1.1em;
}
.blank	{	/* 空白 */
	clear: both;	font-size:1px;	height: 1px;
}
.alert	{	/* 警告 */
	color: #FF9999;
}
IMG	{	border: none; }
A			{ text-decoration:none; }
A:link		{ color: #7777FF; }
A:visited	{ color: #FF77FF; }
A:active	{ color: white; }
A:hover		{ color: white; }


.progress_bg {
    position: relative;
    background: url(./developers/progressBarB.gif) 0 0px no-repeat;
    height: 20px;
    width: 310px;
}
.progress_bg div {
    position: absolute;
    cursor: default;
    top: 4px;
}
.progress {
    position: absolute;
    background: url(./developers/progressBarF.gif) 0 0px no-repeat;
    height: 20px;
    width: 0px;
}

		</style>
		<script type="text/javascript" src="./resource/yui/yahoo-dom-event/yahoo-dom-event.js"></script>
		<script type="text/javascript" src="./resource/yui/connection/connection-min.js"></script>
		<script type="text/javascript" src="./resource/yui/json/json-min.js"></script>
		<script type="text/javascript" src="./resource/yui/animation/animation-min.js"></script>
<script type="text/javascript">
function progressBar (id){
    this._id = id;
    this._percentage = 0;

    this.setPercentage = function (percentage) {
        this._percentage = percentage + this._percentage;
        var width = this._percentage * 3;

        var attributes = {
            width: { to: width }
        };
        var anim = new YAHOO.util.Anim(this._id, attributes, 2);
        anim.animate();
        YAHOO.util.Dom.get(this._id + '_per').innerHTML = this._percentage + '%'; 
    };
}

function trigger(action) {
    var callback =
    {
        success: function(o) {
            var result = YAHOO.lang.JSON.parse (o.responseText);
            var table = new progressBar(result.bar);

            if (result.complete){
                YAHOO.util.Dom.setStyle("wait", "display", "none");
                YAHOO.util.Dom.setStyle("nextlink", "display", "inline");
            } else {
                table.setPercentage(result.per);
                trigger2(result.next);
            }
        },
        failure: function(o) {
        },
        argument: []
    }

    YAHOO.util.Connect.asyncRequest('GET',  '<?php e($_SERVER['PHP_SELF']); ?>?page=database&action='+ action, callback);
}

function trigger2(action) {
    trigger(action)
}


YAHOO.util.Event.onDOMReady(function () {
    trigger('table');
});
</script>
	</head>
	<body>
		<!-- start:ヘッダー -->
		<div id="header">
			<div>&nbsp;</div>
			<ul class="horizontal" style="margin-left:560px; margin-top:100px;">
				<li><a href="<?php e($_SERVER['PHP_SELF']); ?>">Step1</a>&nbsp;&nbsp;</li>
				<li><a href="<?php e($_SERVER['PHP_SELF']); ?>">Step2</a>&nbsp;&nbsp;</li>
				<li><a href="<?php e($_SERVER['PHP_SELF']); ?>">Step3</a></li>
			</ul>
		</div><br />
		<!-- /finish:ヘッダー -->
		

		<!-- start:トップ -->
		<div id="top"><img alt="--" src="./developers/top.gif" width="800" height="10" /></div>
		<!-- /finish:トップ -->

		<!-- start:メインコンテンツ -->
		<div id="content">
			<div class="title"><img src="./developers/h_top.gif" width="740" height="10" /><?php _e('Data Setting.'); ?><img src="./developers/h_bottom.gif" width="740" height="10" /></div>
			<br />

				<table align="center" cellpadding="0" cellspacing="0" width="740"><tbody>
					<tr><td colspan="3"><img src="./developers/l_top.gif" width="740" height="10" /></td></tr>
					<tr>
						<th class="column" style="width:240px;"><?php _e('Create Table'); ?>：</th>
						<td class="data" style="width:320px;">
							<div class="progress_bg"><span id="table" class="progress"></span></div>
						</td>
						<td class="data" style="width:160px;">
							<span id="table_per"></span>
						</td>
					</tr>
					<tr>
						<th class="column" style="width:240px;"><?php _e('Insert Data'); ?>：</th>
						<td class="data" style="width:320px;">
							<div class="progress_bg"><span id="data" class="progress"></span></div>
						</td>
						<td class="data" style="width:160px;">
							<span id="data_per"></span>
						</td>
					</tr>
					<tr>
						<th class="column" style="width:240px;"><?php _e('Defalut Theme'); ?>：</th>
						<td class="data" style="width:320px;">
							<div class="progress_bg"><span id="theme" class="progress"></span></div>
						</td>
						<td class="data" style="width:160px;">
							<span id="theme_per"></span>
						</td>
					</tr>

					<tr><td colspan="3"><img src="<?php echo BASE_URL; ?>developers/l_bottom.gif" width="740" height="10" /></td></tr>
				</tbody></table><br />


				<table align="center" cellpadding="0" cellspacing="0" width="740"><tbody>
					<tr><td colspan="2"><img src="./developers/l_top.gif" width="740" height="10" /></td></tr>
					<tr><td colspan="2"  class="button">

						<div id="wait"><img src="./resource/img/common/wait.gif" width="18" height="18" align="absmiddle" /></div>

						<div id="nextlink" style="display:none;"><a href="<?php e($_SERVER['PHP_SELF']); ?>?page=admin">
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						<?php _e('Next'); ?>
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						<img src="./resource/img/icons/resultset_next.gif" width="16" height="16" align="absmiddle" />
						</a></div>
					</td></tr>
					<tr><td colspan="2"><img src="./developers/l_bottom.gif" width="740" height="10" /></td></tr>
				</tbody></table><br />

			<div class="copyright">Copyright (C) 2007 `Yujiro Takahashi' All Rights Reserved.</div>
			<div style="clear: both;"><img alt=" " src="<?php echo BASE_URL; ?>developers/blank.gif" width="600" height="1" /></div>
		</div>
		<!-- /finish:メインコンテンツ -->

		<!-- start:フッター -->
		<div id="footer"><br /></div>
		<!-- /finish:フッター -->
	</body>
</html>