<!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/fileuploader.js"></script>
    <script type="text/javascript" src="/media/js/w3d.manager.fabric.js"></script>
    <link rel='stylesheet' href='/media/css/pages/manager.css' />
    <link href="/media/css/pages/select2.min.css" rel="stylesheet" />
    <script src="/media/js/select2.min.js"></script>
</head>

<body>
    <div class='managerWrapper'>
        <div class='managerTab'>
            <ul class='tabList'>
                <a href='/manager/product'>
                    <li class='menu'>製品</li>
                </a>
                <li class='menu selected'>織物</li>
                <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 fabric' id='fabric_page'>
            <div class='selectors'>


                <div id='category1' class='categorySelector'>
                    <label class='top bold'>カテゴリ(level1)</label>
                    <select class='listBox' size='2'>
                        <!--
							<option value='Stripe-Check' selected='selected'>Stripe-Check</option>
							<option value='Dot-solid'>Dot-solid</option>
							<option value='Character'>Character</option>
							<option value='Text-Logo'>Text-Logo</option>
							<option value='Etc'>Etc</option>
							<option value='Flower'>Flower</option>
							<option value='tricot'>tricot</option>
							-->
                    </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 id='category2' class='categorySelector_middle'>
                    <label class='top bold'>カテゴリ(level2)</label>
                    <select class='listBox' size='2'>
                        <!--
							<option value='Stripe-Check' selected='selected'>Stripe-Check</option>
							<option value='Dot-solid'>Dot-solid</option>
							<option value='Character'>Character</option>
							<option value='Text-Logo'>Text-Logo</option>
							<option value='Etc'>Etc</option>
							<option value='Flower'>Flower</option>
							<option value='tricot'>tricot</option>
							-->
                    </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'>削除</div>
                        <div class='manager_button categoryFunc copy right_end'>Copy</div>
                    </div>
                </div>



                <div id='category3' class='categorySelector_middle'>
                    <label class='top bold'>カテゴリ(level3)</label>
                    <select class='listBox' size='2'>
                        <!--
							<option value='Stripe-Check' selected='selected'>Stripe-Check</option>
							<option value='Dot-solid'>Dot-solid</option>
							<option value='Character'>Character</option>
							<option value='Text-Logo'>Text-Logo</option>
							<option value='Etc'>Etc</option>
							<option value='Flower'>Flower</option>
							<option value='tricot'>tricot</option>
							-->
                    </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'>削除</div>
                        <div class='manager_button categoryFunc copy right_end'>Copy</div>
                    </div>
                </div>
                <div class='fabricSelector'>
                    <label class='top bold'>織物 リスト</label>
                    <div id='fabricGrid'>
                        <!--
							<div class='fabricItem'>1</div>
							<div class='fabricItem'>2</div>
							<div class='fabricItem'>3</div>
							<div class='fabricItem'>4</div>
							<div class='fabricItem null'></div>
							-->
                    </div>
                    <div class='fabric_functions'>
                        <!--<div id='manager_button select_mode_btn'>선택</div>-->
                        <div class='manager_button right_end' id='delete_fabric_btn'>削除</div>
                    </div>
                </div>
            </div>
            <div class='fabricInformation'>
                <label class='top bold'>織物 情報</label>
                <div id='fabricViewer'>
                    <div class='fabricImages'>
                        <div class='mainImage'>
                            <div class='mainImageViewer'>
                            </div>
                            <div class='image_functions onerepeat'>
                                <div class='manager_button right_end' id='change_oneRepeat_btn' title='One repeat Image'>One repeat Image</div>
                            </div>
                        </div>
                        <div class='detailImages'>
                            <div class='detailImageViewer'>
                                <div class='detailImageWrapper'>
                                    <!--
									<div class='detailImage_element first'></div>
									-->
                                </div>
                            </div>
                            <div class='image_functions detail'>
                                <div class='qqUploader'></div>
                                <div class='manager_button right_end' id='add_detail_btn' title='Detail Image'>詳細 Image</div>
                            </div>
                        </div>
                    </div>
                    <div class='bottomLeft'>
                        <div class='info_detail'>
                            <label class='top'>生地情報</label>
                            <div class='detail_input'>
                                <div class='line'>
                                    <label for='inp_fabricName'>品番</label>
                                    <input type='text' id='inp_fabricName' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricCode'>シリーズ</label>
                                    <input type='text' id='inp_fabricCode' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricWeight'>生地巾</label>
                                    <input type='text' id='inp_fabricWeight' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricWidth'>組成</label>
                                    <input type='text' id='inp_fabricWidth' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricComposition'>柄リピート</label>
                                    <input type='text' id='inp_fabricComposition' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricPrice'>裾仕様</label>
                                    <input type='text' id='inp_fabricPrice' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricSize'>形状記憶加工</label>
                                    <input type='text' id='inp_fabricSize' />
                                </div>
                                <div class='line'>
                                    <label for='inp_fabricValid'>公開する</label>
                                    <input type='checkbox' name='fabicValid' id='inp_fabricValid' value='true'>
                                </div>
                            </div>
                        </div>
                        <div class='info_memo'>
                            <label class='top'>メモ</label>
                            <div class='memo_input'>
                                <textarea id='inp_fabricMemo' rows='10'></textarea>
                            </div>
                        </div>
                        <div class='info_laundrytags'>
                            <label class='top'>洗濯表示</label>
                            <div class='laundryTag'>
                                <div class='tagDiv tag1'>
                                    <input type='checkbox' class='checkbox init-select' id='laundry_tag1' />
                                    <!--<div class='taglabel'>Single</div>-->
                                </div>
                                <div class='tagDiv tag2'>
                                    <input type='checkbox' class='checkbox init-select' id='laundry_tag2' />
                                    <!--<div class='taglabel'>Dry</div>-->
                                </div>
                                <div class='tagDiv tag3'>
                                    <input type='checkbox' class='checkbox init-select' id='laundry_tag3' />
                                    <!--<div class='taglabel'>Shade</div>-->
                                </div>
                                <div class='tagDiv tag4'>
                                    <input type='checkbox' class='checkbox init-select' id='laundry_tag4' />
                                    <!--<div class='taglabel'>Water</div>-->
                                </div>
                                <div class='tagDiv tag5'>
                                    <input type='checkbox' class='checkbox init-select' id='laundry_tag5' />
                                    <!--<div class='taglabel'>Hand</div>-->
                                </div>
                                <div class='tagDiv tag6'>
                                    <input type='checkbox' class='checkbox' id='laundry_tag6' />
                                    <!--<div class='taglabel'>Hand</div>-->
                                </div>
                                <div class='tagDiv tag7 tag-last'>
                                    <input type='checkbox' class='checkbox' id='laundry_tag7' />
                                    <!--<div class='taglabel'>Iron</div>-->
                                </div>
                                <!--<div class='tagDiv tag7'>
										<input type='checkbox' class='checkbox' id='laundry_tag7'/>
										<div class='taglabel'>Twist</div>
									</div>-->
                            </div>
                        </div>
                        <div class='info_access'>
                            <label class='top'>アクセス</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 class="clear"></div>
                        <form class="info-others">
                            <button id="checkSelect" type="button"></button>
                            <span class="title">Fabric Other Information</span>
                            <div class="clear"></div>
                            <br>
                            <div class="content">
                                <span class="title">Function</span>
                                <select class="select2" multiple="multiple" name="fabric_function" id="inputSearchFunction">
                                    <option value="0">遮光1~3級</option>
                                    <option value="1">完全遮光</option>
                                    <option value="2">遮熱</option>
                                    <option value="3">防炎</option>
                                    <option value="4">UVカット</option>
                                    <option value="5">ミラー</option>
                                    <option value="6">遮像</option>
                                    <option value="7">シームレス</option>
                                </select>
                            </div>
                            <div class="content">
                                <span class="title">Image</span>
                                <select class="select2" multiple="multiple" name="fabric_image" id="inputSearchImage">
                                    <option value="0">シンプル</option>
                                    <option value="1">ナチュラル</option>
                                    <option value="2">エレガンス</option>
                                    <option value="3">クラシック</option>
                                    <option value="4">カジュアル</option>
                                    <option value="5">モダン</option>
                                    <option value="6">キッズ</option>
                                    <option value="7">ノルディック</option>
                                </select>
                            </div>
                            <div class="content">
                                <span class="title">Color</span>
                                <select class="select2" multiple="multiple" name="fabric_color" id="inputSearchColor">
                                    <option value="0">ホワイト系</option>
                                    <option value="1">ベージュ系</option>
                                    <option value="2">ブルー系</option>
                                    <option value="3">グリーン系</option>
                                    <option value="4">イエロー系</option>
                                    <option value="5">レッド系</option>
                                    <option value="6">グレー系</option>
                                    <option value="7">ブラウン系</option>
                                </select>
                            </div>
                    </div>
                </div>
            </div>
            <div class="clear"></div>
            <div class='fabric_functions' style="text-align:right; padding-right:10px; padding-top:5px;">
                <div class='manager_button' id='new_fabric_btn'>新規作成</div>
                <div class='manager_button' id='save_fabric_btn'>修正</div>
                <div class='manager_button right_end' id='saveAs_fabric_btn'>保存</div>
            </div>
        </div>
    </div>
    </div>
    <div id="loading_mask"></div>
    <script type='text/javascript'>
        $(function () {
            w3d.manager.fabric.initManageFabric();
        });
    </script>
    <script type="text/javascript">
        $('.select2').select2({
            maximumSelectionLength: 6
        });
        $('#checkSelect').click(function () {
            var a = $('.info-others').serialize();
            alert(a);
        });
    </script>
</body>

</html>