<?php
	require("../__common__/__define_common.php");
	require("../__common__/include-common-all.php");
	require("__define_excel-graph.php");
	my_session_start();
	require("../account/__logincheck.php");
	require("__include-common-excel-graph.php");

	if ($_GET['g'].'' <> '') {
		$_SESSION['excel_graph_html5_graph'] = $_GET['g'];
	} elseif ($_SESSION['excel_graph_html5_graph'].'' == '') {
		$_SESSION['excel_graph_html5_graph'] = "vbar";
	}
	if ($_GET['bs'].'' <> '') {
		$_SESSION['excel_graph_html5_bar_shape'] = $_GET['bs'];
	} elseif ($_SESSION['excel_graph_html5_bar_shape'].'' == '') {
		$_SESSION['excel_graph_html5_bar_shape'] = "square";
	}
	if ($_GET['rs'].'' <> '') {
		$_SESSION['excel_graph_html5_radar_shape'] = $_GET['rs'];
	} elseif ($_SESSION['excel_graph_html5_radar_shape'].'' == '') {
		$_SESSION['excel_graph_html5_radar_shape'] = "polygon";
	}
	if ($_GET['w'].'' <> '') {
		$_SESSION['excel_graph_html5_width'] = $_GET['w'];
	} elseif ($_SESSION['excel_graph_html5_width'].'' == '') {
		$_SESSION['excel_graph_html5_width'] = GRAPH_WIDTH;
	}
	$_SESSION['excel_graph_html5_height'] = floor(intval($_SESSION['excel_graph_html5_width'])*3/4);
?>
<!--DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"-->
<html lang="ja">
<head>
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="author" content="ok.2nd">
<!--DOCTYPEを指定すると、IE6でレーダーチャートと折線グラフのグラフと背景が分離してしまう。-->
<style type="text/css">
<!--
* {margin: 0px; padding: 0px; }
form { margin: 0px; }
img { border: 0px; }
body {
	background-color: #ffffff;
	margin: 10px;
	padding: 0px;
	text-align: left;
}
body { font-size: 84%; color: #101020; }
body,td,a,p,.h {font-family:arial,sans-serif; }
h1 { font-size: 120%; }
a { text-decoration: underline; font-weight: normal; }
a:link { color: #0000ff; font-weight: normal; }
a:visited { color: #0000ff; font-weight: normal; }
a:hover { color: #ff0000; font-weight: normal; }
a:active { color: #ff0000; font-weight: normal; }
table#data_table {
	border: #c0c0c0 1px solid;
	background-color: #ffffff;
	margin: 10px 0 0 10px;
}
#data_table th {
	padding-right: 1px; padding-left: 1px; padding-bottom: 1px; padding-top: 1px; background-color: #c0c0ff;
}
#data_table td {
	padding-right: 1px; padding-left: 1px; padding-bottom: 1px; padding-top: 1px; background-color: #e9e9e9;
}
-->
</style>
<title>Excel to グラフ by HTML5</title>
<!--
■ Spreadsheet_Excel_Reader
	http://sourceforge.net/projects/phpexcelreader/
		http://www.ilovex.co.jp/Division/SRD/archives/2007/08/phpexcel_2.html
		http://q.hatena.ne.jp/1207023049
■ グラフ作成ライブラリ: HTML5
	http://www.html5.jp/library/index.html
■ IEでCanvasを利用するためのライブラリ:ExplorerCanvas
	http://excanvas.sourceforge.net/
		http://d.hatena.ne.jp/unageanu/20070921/1190377760
-->
<script type="text/javascript" src="scripts/html5jp/graph/<?= $_SESSION['excel_graph_html5_graph'] ?>.js"></script>
<!--[if IE]><script type="text/javascript" src="scripts/excanvas/excanvas-compressed.js"></script><![endif]-->
<script language="javascript" src="scripts/cookie.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
function onLoad() {
	graphHTML5();
}
function graphWidth(g_width) {
	window.location.href = "<?= $_SERVER['SCRIPT_NAME'] ?>?w=" + g_width;
}
function graphType(g_type) {
	window.location.href = "<?= $_SERVER['SCRIPT_NAME'] ?>?g=" + g_type;
}
function barShape(g_shape) {
	window.location.href = "<?= $_SERVER['SCRIPT_NAME'] ?>?bs=" + g_shape;
}
function radarShape(g_shape) {
	window.location.href = "<?= $_SERVER['SCRIPT_NAME'] ?>?rs=" + g_shape;
}
-->
</script>
</head>
<?php	if (($excel_file = post_check('filename')) == True) { ?>
<body onload="onLoad()">
<?php	} else { ?>
<body>
<?php	} ?>
<h1></h1>
<form name="form0" method="POST" action="<?= $_SERVER['SCRIPT_NAME'] ?>" enctype="multipart/form-data">
<table>
<tr>
	<td style="font-size: 84%" align=right>ファイル：</td>
	<td style="font-size: 84%">
		<input type="file" size=40 name="filename" style="button-font-size:small">&nbsp;&nbsp;
		<a href="excel-graph-bluff.php">「Excel to グラフ by Bluff」に切り替え</a>
	</td>
</tr>
<tr>
	<td style="font-size: 84%"><br></td>
	<td style="font-size: 84%">
		<input type="submit" name="upload" value="アップロード">
		<input type="submit" name="clear" value="クリア">
		<input type="submit" name="redraw" value="再描画">
	</td>
</tr>
<tr>
	<td style="font-size: 84%" align=right>グラフ横幅：</td>
	<td style="font-size: 84%">
		<select name="zoomsize" onChange="graphWidth(this.options[this.selectedIndex].value);">
		<?php 	for ($val=300; $val<=800; $val+=50) { ?>
			<option value="<?= $val ?>"<?= $val==$_SESSION['excel_graph_html5_width'] ? ' selected' : '' ?>><?= $val ?></option>
		<?php	} ?>
		</select>
	</td>
</tr>
<tr>
	<td style="font-size: 84%" align=right>グラフ種類：</td>
	<td style="font-size: 84%">
		<input type="button" value="棒グラフ" onClick="graphType('vbar')">
		<input type="button" value="レーダーチャート" onClick="graphType('radar')">
		<input type="button" value="折線グラフ" onClick="graphType('line')">
		<input type="button" value="円グラフ" onClick="graphType('circle')">
	</td>
</tr>
<?php	if ($_SESSION['excel_graph_html5_graph'] == 'vbar') { ?>
<tr>
	<td style="font-size: 84%" align=right>棒グラフ：</td>
	<td style="font-size: 84%">
		<input type="button" value="　角柱　" onClick="barShape('square')">
		<input type="button" value="　円中　" onClick="barShape('cylinder')">
		<input type="button" value="平坦（影あり）" onClick="barShape('flat')">
		<input type="button" value="平坦（影なし）" onClick="barShape('line')">
	</td>
</tr>
<?php	} elseif ($_SESSION['excel_graph_html5_graph'] == 'radar') { ?>
<tr>
	<td style="font-size: 84%" align=right>レーダーチャート：</td>
	<td style="font-size: 84%">
		<input type="button" value="　多角形　" onClick="radarShape('polygon')">
		<input type="button" value="　　円　　" onClick="radarShape('circle')">
	</td>
</tr>
<?php	} ?>
</table>
</form>
<?php
	if ($excel_file) {
		post_done_proc($excel_file);
	}
?>
<div id="footer">
<a href="http://www.html5.jp/library/index.html" target="_blank" style="color:#b0b0ff;">Powered by HTML5.JP</a><br />
<a href="http://sourceforge.net/projects/phpexcelreader" target="_blank" style="color:#b0b0ff;">Powered by Spreadsheet_Excel_Reader</a><br />
<a href="http://ok2nd.web.fc2.com/" target="_blank" style="color:#b0b0ff;">Powered by ok.2nd</a>
</div>
</body>
</html>
<?php
function post_done_proc($excel_file) {
	if ($excel_file == EXCEL_FILE_UPLOAD) {
		$attachFile = file_upload_to_name("filename", ATTACH_FILE_FOLDER, EXCEL_FILE_NAME);
		$readFile = ATTACH_FILE_FOLDER.$attachFile;
	} else {
		$readFile = ATTACH_FILE_FOLDER.EXCEL_FILE_NAME;
	}
	require 'phpExcelReader/Excel/Reader.php';
	$excel = new Spreadsheet_Excel_Reader();
	$excel->setUTFEncoder('mb');
	$excel->setOutputEncoding('UTF-8');
	$excel->read($readFile);

	if (list_table($excel, $items, $parms)) {
?>
<script type="text/javascript">
<!--
function graphHTML5() {
	var graph = new html5jp.graph.<?= $_SESSION['excel_graph_html5_graph'] ?>("graph_canvas");
	if( ! graph ) { return; }
	var items = [ <?= $items ?> ];
	var params = {
	<?= $parms ?>
<?php	if ($_SESSION['excel_graph_html5_graph'] == 'vbar') { ?>
	, gGradation: false
	, barShape: "<?= $_SESSION['excel_graph_html5_bar_shape'] ?>"
<?php	} elseif ($_SESSION['excel_graph_html5_graph'] == 'radar') { ?>
	, chartShape: "<?= $_SESSION['excel_graph_html5_radar_shape'] ?>"
<?php	} elseif ($_SESSION['excel_graph_html5_graph'] == 'circle') { ?>
	shadow: false
<?php	} ?>
	};
	graph.draw(items, params);
}
-->
</script>
	<div class="canvas"><canvas id="graph_canvas" width="<?= $_SESSION['excel_graph_html5_width'] ?>" height="<?= $_SESSION['excel_graph_html5_height'] ?>"></canvas></div>
<?php
	}
}
function list_table($excel, &$items, &$parms) {
	if ($_SESSION['excel_graph_html5_graph'] == 'circle') {
		return list_table_circle($excel, $items, $parms);
	}
	$numRows = $excel->sheets[0]["numRows"];
	$numCols = $excel->sheets[0]["numCols"];
	if ($numRows < 2 || $numCols < 2) return False;
		if ($_SESSION['excel_graph_html5_graph'] == 'vbar' or $_SESSION['excel_graph_html5_graph'] == 'line') {
			$parms = 'x: ["",';
		} elseif ($_SESSION['excel_graph_html5_graph'] == 'radar') {
			$parms = 'aCap: [';
		}
?>
<table id="data_table" cellspacing=1>
<caption><?= $excel->sheets[0]["sheetname"]?></caption>
	<thead>		<tr>
<?php
		for ($col = 1; $col <= $numCols; $col++) {
?>
			<th style="font-size: 84%"><?= $excel->sheets[0]["cells"][1][$col] ?></th>
			<?php
			if ($col >= 2) {
				if ($col >= 3) $parms .= ', ';
				$parms .= '"'.$excel->sheets[0]["cells"][1][$col].'"';
			}
			?>
<?php
		}
		$parms .= '] ';
?>
		</tr>
	</thead>
	<tbody>
<?php
	if ($_SESSION['excel_graph_html5_graph'] == 'vbar' or $_SESSION['excel_graph_html5_graph'] == 'line') {
		$parms .= ', y: [""]';
	} elseif ($_SESSION['excel_graph_html5_graph'] == 'radar') {
	}
	$items = '';
	for ($row = 2; $row <= $numRows; $row++) {
?>
		<tr>
			<th style="font-size: 84%" align=left><?= $excel->sheets[0]["cells"][$row][1] ?></th>
<?php
		if ($row > 2) $items .= ', ';
		$items .= '["' . $excel->sheets[0]["cells"][$row][1] . '", ';
		for ($col = 2; $col <= $numCols; $col++) {
?>
			<td style="font-size: 84%" align=right><?= $excel->sheets[0]["cells"][$row][$col] ?></td>
<?php
			if ($col > 2) $items .= ', ';
			$items .= $excel->sheets[0]["cells"][$row][$col];
		}
		$items .= ']';
?>
		</tr>
<?php
	}
?>
	</tbody>
</table>
<?php
	return True;
}
function list_table_circle($excel, &$items, &$parms) {
	$numRows = $excel->sheets[0]["numRows"];
	$numCols = $excel->sheets[0]["numCols"];
	if ($numRows < 2 || $numCols < 2) return False;
?>
<table id="data_table" cellspacing=1>
<caption><?= $excel->sheets[0]["sheetname"]?></caption>
	<thead>		<tr>
<?php
		for ($col = 1; $col <= $numCols; $col++) {
?>
			<th style="font-size: 84%"><?= $excel->sheets[0]["cells"][1][$col] ?></th>
<?php
		}
?>
		</tr>
	</thead>
	<tbody>
<?php
	$parms = '';
	$items = '';
	for ($row = 2; $row <= $numRows; $row++) {
?>
		<tr>
			<th style="font-size: 84%"><?= $excel->sheets[0]["cells"][$row][1] ?></th>
<?php
		if ($row > 2) $items .= ', ';
		$items .= '["' . $excel->sheets[0]["cells"][$row][1] . '", ';
		for ($col = 2; $col <= $numCols; $col++) {
?>
			<td style="font-size: 84%"><?= $excel->sheets[0]["cells"][$row][$col] ?></td>
<?php
			if ($col == 2) {
				$items .= $excel->sheets[0]["cells"][$row][$col];
			}
		}
		$items .= ']';
?>
		</tr>
<?php
	}
?>
	</tbody>
</table>
<?php
	return True;
}
?>
