<!DOCTYPE html>
<html>
    <head>
        {{ template "inc/head" . }}
        <link rel="stylesheet" type="text/css" href="/css/home.css">
    </head>
    <body>
    {{ template "inc/nav" . }}
    <div class="all">
        <!-- search -->
        <div class="form-inline mb20" role="form">
            <div class="form-group">
                <input type="text" class="form-control" id="query" value="{{$.Query}}">
            </div>
            <button onclick="query_item()" class="btn btn-default">
                <span class="glyphicon glyphicon-search"></span>
            </button>
            <input type="checkbox" name="mine" id="mine" {{if eq $.Mine 1}} checked="checked"{{end}}>
            <span>only me</span>
            <a href="/strategy/add" class="btn btn-default pull-right">
                <span class="glyphicon glyphicon-plus"></span>
                Add URL monitor
            </a>
        </div>

        <table class="table table-hover table-bordered table-striped">
            <thead>
            <tr>
                <th>ID</th>
                <th>Url</th>
                <th>Status Code</th>
                <th>Timeout</th>
                <th>Creator</th>
                <th>Recv Team</th>
                <th>Remark</th>
                <th>OP</th>
            </tr>
            </thead>
            <tbody>
                {{range .Strategies}}
                <tr>
                    <td id="item_id"> 
                        {{.Id}}
                    </td>
                    <td id="item_target">{{.Url}}</td>
                    <td id="expect_code">{{.ExpectCode}}</td>
                    <td id="timeout">{{.Timeout}}</td>
                    <td id="creator">{{.Creator}}</td>
                    <td id="team_name">
                        {{range TeamsOfStrategy .Teams}}
                                <code class="users green">{{.Name}}</code>
                        {{end}}
                    </td>
                    <td id="note">{{.Note}}</td>
                    <td id="edit">
                       <a class="edit-icon" data-toggle="tooltip" data-placement="top" title="Detail" href="/url?id={{.Id}}">
                            <span class="glyphicon glyphicon-list-alt"></span>
                        </a>
                        <span class="cut-line"></span>
                        <a class="edit-icon" data-toggle="tooltip" data-placement="top" title="Edit" href="/strategy/{{.Id}}/edit">
                            <span class="glyphicon glyphicon-edit"></span>
                        </a>
                        <span class="cut-line"></span>
                        <a class="edit-icon" data-toggle="tooltip" data-placement="top" title="Del" href="javascript:del_strategy('{{.Id}}');">
                            <span class="glyphicon glyphicon-remove"></span>
                        </a>
                    </td>
                </tr>
                {{end}}
            </tbody>
        </table>
        {{ template "inc/pager" . }}
  </div>

<script type="text/javascript">
    function query_item() {
        var query = $.trim($("#query").val());
        var mine = document.getElementById('mine').checked ? 1 : 0;
        window.location.href="/?q="+query+"&mine=" + mine;
    }

    $(function() {
        $("#query").keypress(function(e) {
            var key = e.which;
            if (key == 13) {
                query_item();
            }
        });
        $("#mine").click(query_item);
    });
</script>
{{ template "inc/footer" . }}
</body>
</html>