<!DOCTYPE html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>mycard rooms</title>
    <meta name="description" content="mycard在线大厅">
    <meta name="viewport" content="width=device-width">

    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->

    <link rel="stylesheet" href="/vendor/stylesheets/normalize.css">
    <link rel="stylesheet/less" type="text/css" href="/assets/stylesheets/rooms.less" media="all"/>
    <script type="text/javascript" src="/vendor/javascripts/less-1.3.1.min.js"></script>
    <script src="/vendor/javascripts/modernizr-2.6.2.min.js"></script>

    <link rel="stylesheet" href="/vendor/stylesheets/smoothness/jquery-ui-1.10.0.custom.css"/>
    <link rel="canonical" href="http://my-card.in/rooms">

    <!-- Google Analytics -->
    <script type="text/javascript">
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-29582484-1']);
        _gaq.push(['_trackPageview']);
        var pluginUrl = '//www.google-analytics.com/plugins/ga/inpage_linkid.js';
        _gaq.push(['_require', 'inpage_linkid', pluginUrl]);
        (function () {
            var ga = document.createElement('script');
            ga.type = 'text/javascript';
            ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(ga, s);
        })();
    </script>

    <script id="login_form_template" type="text/x-mustache-template">
        <form method="post" id="login-form" class="login-form" onsubmit="
        {{#displayUsername}}username.value = node.value + '@' + domain.value;{{/displayUsername}}
        Candy.Util.setCookie('jid', username.value, 365);
        Candy.Util.setCookie('username', node.value, 365);
        Candy.Util.setCookie('password', password.value, 365);
        after_login();">
            {{#displayUsername}}
            <label for="node">{{_labelUsername}}</label>
            <input type="text" id="node" name="node"/>
            <label for="domain">@</label>
            <select id="domain" name="domain">



                <option label="my-card.in" value="my-card.in" selected>my-card.in</option>


                <!-- <option value=""></option>

               <option label="gmail.com" value="gmail.com"/>-->
            </select>
            {{/displayUsername}}
            <input type="hidden" id="username" name="username" value="{{presetJid}}"/>
            {{#displayPassword}}<label for="password">{{_labelPassword}}</label><input type="password" id="password" name="password"/>{{/displayPassword}}
            <input type="submit" class="button" value="{{_loginSubmit}}"/>
        </form>
    </script>

    <script id="room_template" type="text/x-jquery-tmpl">
		<section class="room ${status}">
            <header class="room_top">
                <img src="/assets/images/rooms/{{if private}}private{{else}}${status}{{/if}}.png" alt="room" title="">
                <span>${name}</span>
            </header>
            <div class="room_body {{if mode == 2}}double{{else}}single{{/if}}">
                <div class="players">
                    {{if mode == 2}}{{each _.filter(users, function(user){return (user.player==0) || (user.player==1)})}}
                    <span>${name.split('$')[0]}</span>
                    {{/each}}{{else}}{{each _.filter(users, function(user){return user.player==0})}}
                    <span>${name.split('$')[0]}</span>
                    {{/each}}{{/if}}
                </div>
                <div class="vs">VS</div>
                <div class="players">
                    {{if mode == 2}}{{each _.filter(users, function(user){return (user.player==2) || (user.player==3)})}}
                    <span>${name.split('$')[0]}</span>
                    {{/each}}{{else}}{{each _.filter(users, function(user){return user.player==1})}}
                    <span>${name.split('$')[0]}</span>
                    {{/each}}{{/if}}
                </div>
            </div>
            <footer class="room_member">
                <p class="mode">模式: <span>{{if mode == 0}}单局{{else}}{{if mode == 1}}比赛{{else}}TAG{{/if}}{{/if}}</span></p>
                <!--{{if private}}<img src="/assets/images/lock.png" alt="私密房" class="private">{{/if}}-->
                <!--<img src="/assets/images/duel.png" alt="竞技场" class="arena">-->
            </footer>
        </section>
   </script>
    <script id="server_template" type="text/x-jquery-tmpl">
        <option value="${id}" selected>${name}</option>
    </script>


</head>
<body>
<!--[if lt IE 10]>
<link rel="stylesheet" href="/assets/stylesheets/browser.css">
<div id="bodyMask2"></div>
<div id="browser" class="layerDiv">
    <h2>噢，您是否知道您正在使用的浏览器无法支持我们的页面？</h2>

    <h3>很抱歉，由于采用了HTML5，当前浏览器无法完美呈现该页面。</h3>

    <div><span>如果你还不知道什么是HTML5标准，请看<a href="http://zh.wikipedia.org/wiki/HTML5" target="_blank">维基百科</a>。</span>建议您使用以下浏览器的最新版本：
    </div>
    <ul>
        <li><a target="_blank" href="http://www.google.cn/chrome/intl/zh-CN/landing_chrome.html" class="ico icoChrome"
               title="谷歌Chrome浏览器"></a></li>
        <li><a target="_blank" href="http://www.opera.com/" class="ico icoOpera" title="Opera浏览器"></a></li>
        <li><a target="_blank" href="http://www.firefox.com.cn/download/" class="ico icoFirefox" title="火狐浏览器"></a></li>
        <li>
            <a target="_blank" href="http://www.apple.com.cn/safari/download/" class="ico icoSafar" title="Safar浏览器"></a>
        </li>
    </ul>

    <div>或者，可以使用基本版本 <span><a href="https://github.com/zh99998/mycard/wiki/%E5%AF%B9%E6%88%98:%E7%9B%B4%E6%8E%A5%E8%BF%9E%E6%8E%A5#wiki-wrapper">使用教程</a>
    </span>
    </div>
    <iframe id="basic" src="/servers" frameBorder="0"></iframe>
</div>
<![endif]-->

<!-- Add your site or application content here -->
<header class="card_top">
    <div class="card_logo">
        <img src="/assets/images/rooms/logo.png" alt="mycard"/>
    </div>
    <div class="card_form">
        <select id="servers" multiple="multiple"></select>
        <input id="new_room_button" type="button" value="建立房间"/>

        <div id="announcements_wrapper">
            <ul id="announcements">
                <li id="status">Loading...</li>
            </ul>
        </div>
    </div>
    <div class="log_reg not_logged">
        <a href="http://my-card.in/register">注册</a>
        <span>&nbsp;&nbsp;|&nbsp;&nbsp;</span>
        <a id="login_button" class="logging_button">登录</a>
    </div>
    <div class="log_reg logged" hidden>
        <a id="current_username"></a>
        <span>&nbsp;&nbsp;|&nbsp;&nbsp;</span>
        <a id="logout_button" class="logging_button">退出</a>
    </div>
    <div class="ad_top">
        <script type="text/javascript">
            <!--
            google_ad_client = "ca-pub-1173264056684633";
            /* mycard网页大厅右上 */
            google_ad_slot = "2732134865";
            google_ad_width = 468;
            google_ad_height = 60;
            //-->
        </script>
        <script type="text/javascript"
        src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
    </div>
</header>
<div class="card_center">
    <section id="rooms">Loading...</section>
</div>
<aside class="online_list" hidden>
    <div class="online_title">聊天工具</div>
    <ul id="roster">
        <li>
            <span>这是还没写好的好友系统喵</span>
        </li>
        <li>
            <span>下面留的是管理员</span>
        </li>
        <li class="xmpp" data-jid="悼亡圣约@my-card.in" data-nick="悼亡圣约">
            <img src="https://lh3.googleusercontent.com/-deevaHxZKmU/AAAAAAAAAAI/AAAAAAAAA3w/fKdtZumwc0k/s120-c/photo.jpg" alt="悼亡圣约"/><span>悼亡圣约</span>
        </li>
    </ul>
</aside>
<footer id="candy" hidden></footer>

<div id="new_room_dialog" hidden>
    <form id="new_room">
        <div class="newRoomName">
            <label for="new_room_name">房间名称</label><input type="text" id="new_room_name" name="name"/>
            <label for="new_room_password">房间密码</label><input type="text" name="password" id="new_room_password" value=""/>

            <label for="server">服务器</label>
            <select id="server" name="server">
                <option value="0" selected>自定义</option>
            </select>
            <input type="checkbox" name="pvp" id="new_room_pvp"/><label for="new_room_pvp" class="new_room_pvp">竞技场</label>
            <div id="server_custom" hidden>
                <input type="text" id="server_ip" name="server_ip" value="127.0.0.1"/><label class="newRoomColon" for="server_port">:</label><input type="number" id="server_port" name="server_port" value="7911"/>
                <input type="checkbox" id="server_auth" name="server_auth"/><label class="newRoomApprove" for="server_auth">认证</label>
            </div>
        </div>

        <div class="newRoomMode">
            <label for="new_room_rule">卡片允许</label>
            <select id="new_room_rule" name="rule">
                <option value="0" selected>ＯＣＧ</option>
                <option value="1">ＴＣＧ</option>
                <option value="2">ＯＣＧ＆ＴＣＧ</option>
                <option value="3">专有卡禁止</option>
            </select>
            <label for="new_room_mode">决斗模式</label>
            <select id="new_room_mode" name="mode">
                <option value="0" selected>单局模式</option>
                <option value="1">比赛模式</option>
                <option value="2">ＴＡＧ</option>
            </select>
        </div>

        <div class="newRoomExtra">
            <h4>额外选项 (无特殊需求请勿更改)</h4>
            <label for="new_room_start_lp">初始LP</label>
            <input type="number" name="start_lp" id="new_room_start_lp" min="0" max="99999" value="8000"/>
            <label for="new_room_start_hand">初始手牌数</label>
            <input type="number" name="start_hand" id="new_room_start_hand" min="0" max="60" value="5"/>
            <label for="new_room_draw_count">每回合抽卡</label>
            <input type="number" name="draw_count" id="new_room_draw_count" min="0" max="60" value="1"/>
            <!--<div style="clear:both"></div>
            <input type="checkbox" name="enable_priority" id="new_room_enable_priority"><label for="new_room_enable_priority" class="new_room_enable_priority">允许启动效果优先权</label>
            <input type="checkbox" name="enable_no_check_deck" id="new_room_no_check_deck"><label for="new_room_no_check_deck" class="new_room_no_check_deck">不检查卡组</label>
            <input type="checkbox" name="enable_priority" id="new_room_no_shuffle_deck"><label for="new_room_pvp" class="new_room_pvp">开局不洗卡组</label>-->
        </div>


        <input class="newRoomSubmit" type="submit" value="确定"/>
        <button type="button" id="new_room_copy_room_url" title="Click to copy me.">复制房间地址</button>
        <button type="button" id="new_room_copy_room_url_with_password" title="Click to copy me." hidden>复制房间地址(带密码)</button>
    </form>
</div>
<div id="join_private_room_dialog" hidden>
    <form id="join_private_room">
        <label for="joinroom_password">房间密码</label>
        <input name="password" type="password" id="joinroom_password" value=""/>
        <input type="submit" value="确定"/>
    </form>
</div>

<!--<div id="login_dialog" hidden>
    <form id="login">
        <label for="login_node">用户</label><input name="node" type="text" id="login_node" tabindex="1" />@<select name="domain" id="login_domain" style="width:50px">
            <option value="my-card.in">my-card.in</option>
            <option value="gmail.com">gmail.com</option>
        </select><br />
        <label for="login_password">密码</label><input name="password" type="password" id="login_password" tabindex="2"/>
        <input type="submit" value="确定" tabindex="3"/>
    </form>
</div>-->

<script src="/vendor/javascripts/jquery-1.8.2.min.js"></script>
<script src="/vendor/javascripts/jquery.tmpl.min.js"></script>
<script src="/vendor/javascripts/jquery-ui-1.10.0.custom.min.js"></script>
<script src="/vendor/javascripts/jquery.cookie.js"></script>
<script src="/vendor/javascripts/jquery.select.js"></script>

<script src="/vendor/javascripts/jquery.multiselect.min.js"></script>
<link rel="stylesheet" type="text/css" href="/vendor/stylesheets/jquery.multiselect.css"/>

<script src="/vendor/javascripts/spine/spine.js"></script>
<script src="/vendor/javascripts/spine/ajax.js"></script>
<script src="/vendor/javascripts/spine/relation.js"></script>
<script src="/vendor/javascripts/underscore-min.js"></script>
<script src="/vendor/javascripts/stroll.min.js"></script>
<script src="/vendor/javascripts/jquery.zclip.min.js"></script>

<script src="/vendor/javascripts/humane.min.js"></script>
<link rel="stylesheet" type="text/css" href="/vendor/stylesheets/humane.css"/>

<script src="/vendor/javascripts/mycard.js"></script>

<link rel="stylesheet" type="text/css" href="/vendor/candy/res/default.css"/>
<script type="text/javascript" src="/vendor/candy/libs/libs.min.js"></script>
<script type="text/javascript" src="/vendor/candy/candy.min.js"></script>

<script type="text/javascript" src="/assets/javascripts/candy.fix.js"></script>

<script type="text/javascript" src="/vendor/candy/plugins/inline-images/candy.js"></script>
<link rel="stylesheet" type="text/css" href="/vendor/candy/plugins/inline-images/candy.css"/>

<script src="/assets/javascripts/rooms.js"></script>
</body>
</html>
