{{/*
This file is part of SystemTestPortal.
Copyright (C) 2017  Institute of Software Technology, University of Stuttgart

SystemTestPortal is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

SystemTestPortal is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with SystemTestPortal.  If not, see <http://www.gnu.org/licenses/>.
*/}}

{{define "tab-content"}}
<div class="modal fade" id="helpModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Test Case List</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <table class="help-table">
                    <tr>
                        <td colspan="2">
                            <ul>
                                <li>Choose test cases to display them in detail.</li>
                                {{ if .LoggedIn }}<li>Add a new test case (see button below).</li>{{ end }}
                            </ul>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2"><h5>Buttons</h5></td>
                    </tr>
                    <tr>
                        <td>
                            <button class="order-3 btn btn-primary align-middle">
                                + <span class="d-none d-sm-inline">New Test Case</span>
                            </button>
                        </td>
                        <td>Add a new test case.</td>
                    </tr>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<div class="tab-card card" id="tabTestCases">
    <form id="testCaseForm">
        <nav class="navbar navbar-light action-bar p-3">
            <label class="sr-only">Search</label>
            <div class="input-group flex-nowrap">
                <input type="search" name="s" class="order-1 search-field form-control float-left"
                       placeholder="Search..." data-toggle="tooltip" data-placement="bottom"
                       title="" data-original-title="This feature will be available in a future version">
                {{ if .LoggedIn }}
                <button class="order-3 btn btn-primary align-middle ml-4 float-right" id="buttonNewTestCase">
                    + <span class="d-none d-sm-inline">New Test Case</span>
                </button>
                {{ else }}
                <button class="order-3 btn btn-primary align-middle ml-4 float-right not-allowed disabled" type="button"
                        id="buttonNewTestCaseDisabled" data-toggle="tooltip" data-placement="bottom" title="Login to create a new test case">
                    + <span class="d-none d-sm-inline">New Test Case</span>
                </button>
                {{ end }}
                <span class="order-2 input-group-btn">
                    <button class="search-submit btn btn-outline-success disabled" disabled data-toggle="tooltip" data-placement="bottom"
                            title="" data-original-title="This feature will be available in a future version">
                        <i class="fa fa-search" aria-hidden="true"></i>
                        <span class="d-none d-sm-inline"> Search</span>
                    </button>
                </span>
            </div>
        </nav>
        <div class="row tab-side-bar-row">
            <div class="col-md-9 p-3">
                <h4 class="mb-3">Test Cases</h4>
                <ul class="list-group">
                {{ range .TestCases }}
                    <li class="list-group-item testCaseLine" id="{{ .ID }}">
                    {{ .Name }}
                    </li>
                {{else}}
                    <p class="text-center empty-project-list">
                        <span class="text-muted text-center">
                            There are no test cases yet. {{ if .LoggedIn }}Do you want to create a new test case? {{ end }}
                        </span>
                        <br/><br/>
                        {{ if .LoggedIn }}
                        <button class="btn btn-primary align-middle" id="buttonFirstTestCase">
                            + New Test Case
                        </button>
                        {{ end }}
                    </p>
                {{end}}
                </ul>
            </div>
            <div class="col-md-3 p-3 tab-side-bar">
                <h4>
                    Labels
                    {{ if .LoggedIn }}
                    <button class="btn btn-outline-primary btn-sm align-middle ml-auto disabled"
                            id="buttonNewLabel" disabled data-toggle="tooltip" data-placement="bottom"
                            title="" data-original-title="This feature will be available in a future version">
                        + <span class="d-none d-lg-inline">New Label</span>
                    </button>
                    {{ end }}
                </h4>
                <ul class="list-group">
                    <span class="text-muted">No Labels</span>
                </ul>
            </div>
        </div>
    </form>
    <script src="/static/js/testcases.js"></script>

</div>
{{end}}


