<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
        <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
		<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js'></script>
		<script type="text/javascript" src="/media/js/jquery/jquery.event.drag-2.2.js"></script>
		<script type="text/javascript" src="/media/js/jquery/jquery.event.drag.live-2.2.js"></script>
		<script type="text/javascript" src="/media/js/jquery/jquery.event.drop-2.2.js"></script>
		<script type="text/javascript" src="/media/js/jquery/jquery.event.drop.live-2.2.js"></script>
		<script type="text/javascript" src="/media/js/w3d.common.js"></script>
		<script type="text/javascript" src="/media/js/css_browser_selector.js"></script>
		<script type="text/javascript" src="/media/js/w3d.manager.product.js"></script>
		<link rel='stylesheet' href='/media/css/pages/manager.css' />
	</head>
	<body>
		<div class='managerWrapper'>
			<div class='managerTab'>
				<ul class='tabList'>
					<li class='menu selected'>製品</li>
					<a href='/manager/fabric'>
						<li class='menu'>織物</li>
					</a>
					<a href='/manager/user'>
						<li class='menu'>ユーザー</li>
					</a>
					<a href='/manager/clientgroup'>
						<li class='menu'>お客様 Group</li>
					</a>
					<a href='/manager/simulation'>
						<li class='menu'>Simulation</li>
					</a>
					<li class='loginInfo'>
						<span>{{ user.username }}</span>
						<a href='/' class='viewer'>Viewer</a>
						<a href='/logout' class='logout'>Logout</a>
					</li>
				</ul>
			</div>
			<div class='managerContent' id='product_page'>
				<div class='top'>
					<div class='categorySelector' level='1'>
						<label class='top bold'>カテゴリ (Lev.1)</label>
						<select class='listBox' size='2'>
						</select>
						<div class='upDown'>
							<div class='manager_button categoryUpDown orderUp'></div>
							<div class='manager_button categoryUpDown orderDown'></div>
						</div>
						<input type='text' class='categoryName' autocomplete='off'/>
						<div class='category_functions'>
							<div class='manager_button categoryFunc create'>作る</div>
							<div class='manager_button categoryFunc modify'>修正する</div>
							<div class='manager_button categoryFunc delete right_end'>削除</div>
						</div>
					</div>
					<div class='categorySelector' level='2'>
						<label class='top bold'>カテゴリ (Lev.2)</label>
						<select class='listBox' size='2'>
						</select>
						<div class='upDown'>
							<div class='manager_button categoryUpDown orderUp'></div>
							<div class='manager_button categoryUpDown orderDown'></div>
						</div>
						<input type='text' class='categoryName'/>
						<div class='category_functions'>
							<div class='manager_button categoryFunc create'>作る</div>
							<div class='manager_button categoryFunc modify'>修正する</div>
							<div class='manager_button categoryFunc delete right_end'>削除</div>
						</div>
					</div>
					<div class='categorySelector' level='3'>
						<label class='top bold'>カテゴリ (Lev.3)</label>
						<select class='listBox' size='2'>
						</select>
						<div class='upDown'>
							<div class='manager_button categoryUpDown orderUp'></div>
							<div class='manager_button categoryUpDown orderDown'></div>
						</div>
						<input type='text' class='categoryName'/>
						<div class='category_functions'>
							<div class='manager_button categoryFunc create'>作る</div>
							<div class='manager_button categoryFunc modify'>修正する</div>
							<div class='manager_button categoryFunc delete right_end'>削除</div>
						</div>
					</div>
				</div>
				<div class='bottom'>
					<div class='bottomLeft'>
						<label class='top'>製品 リスト</label>
						<div id='productGrid'>
							<!--
							<div class='productItem'>1</div>
							<div class='productItem'>2</div>
							<div class='productItem'>3</div>
							-->
							<div class='productItem null'></div>
						</div>
						<div class='product_functions'>
							<!--<div class='manager_button' id='select_mode_btn'>선택</div>-->
							<div class='manager_button right_end' id='delete_product_btn'>削除</div>
						</div>
					</div>
					<div class='bottomRight'>
						<label class='top'>製品 情報</label>
						<div class='productInfo'>
							<div class='info_upper'>
								<div id='productImageViewer'></div>
								<div class='info_access'>
									<label>アクセス</label>
									<div class='access_checks'>
										<div class="div_allow_to to_all">
											<input type='radio' name='allow_to' id='rd_allow_to_all' value='to_all' checked='checked'/>
											<label for="rd_allow_to_all">すべて</label>
										</div>
										<div class="div_allow_to to_limited">
											<input type='radio' name='allow_to' id='rd_allow_to_limited' value='to_limited'/>
											<label for="rd_allow_to_limited">特定 group...</label>
										</div>
										<div class='box'>
											{% for clientGroup in clientGroupList %}
												<div class="client_group">
													<input type="checkbox" value="{{ clientGroup.id }}" id="access_cb_{{ clientGroup.id }}" title="{{ clientGroup.name }}"/>
													<label for="access_cb_{{ clientGroup.id }}" title="{{ clientGroup.name }}">{{ clientGroup.name }}</label>
												</div>
											{% empty %}
												<div>There is no Client Groups.</div>
											{% endfor %}
										</div>
									</div>
								</div>
							</div>
							<div class='detail_input'>
								<div class='line'>
									<input type='text' class='text' id='inp_productName'/>
									<label for='inp_productName' class='right'>名前</label>
								</div>
								<div class='line'>
									<input type='text' class='text' id='inp_productNo'/>
									<label for='inp_productNo' class='right'>Style No.</label>
								</div>
								<div class='line contains_textarea'>
									<textarea id='inp_productPath' rows='4'></textarea>
									<label for='inp_productPath' class='right'>Url</label>
								</div>
								<div class='line'>
									<div id='typeRadios'>
										<input type='radio' class='radio' name='type' id='rdo_photo' value='1'/>
										<label for='rdo_photo'>Picture</label>
										<input type='radio' class='radio' name='type' id='rdo_image' value='2'/>
										<label for='rdo_image'>Image</label>
									</div>
									<label for='typeRadios' class='right'>Type</label>
								</div>
								<div class='line'>
									<input type='checkbox' class='checkbox' name='valid' id='chk_valid' value='true'/>									
									<label for='chk_valid' class='right'>公開する</label>									
								</div>													
							</div>
						</div>
						<div class='product_functions'>
							<div class='manager_button right_end' id='save_product_btn'>修正する</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script type='text/javascript'>
			$(function() {
				w3d.manager.product.initManageProduct();
			});
		</script>
	</body>
</html>