{{define "NavCard"}}
{{with .}}
<div class="card-header">
    <div class="file d-flex flex-row align-items-center">
        <div>
            <nav style="--bs-breadcrumb-divider: '>'" aria-label="breadcrumb">
                <ol class="breadcrumb m-2 mx-0">
                    {{template "HeadTreeFiles" .HeadTrees}}
                </ol>
            </nav>
        </div>
        <div class="ms-auto">
            {{ $length := len .ReturnButton }}
            <button class="btn btn-sm pb-2 px-2 rounded" {{if eq $length 0}}type="button" disabled style="border: 0"{{else}}hx-post="{{ basePath "/api/v1/Explorer" }}" hx-trigger="click" hx-ext="json-enc" hx-target="#NavigationFiles" hx-vals='{{ .ReturnButton }}'{{end}}>
                <svg width="16" height="16" fill="currentColor" class="bi bi-arrow-90deg-left" viewBox="0 0 16 16">
                    <path fill-rule="evenodd" d="M1.146 4.854a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 4H12.5A2.5 2.5 0 0 1 15 6.5v8a.5.5 0 0 1-1 0v-8A1.5 1.5 0 0 0 12.5 5H2.707l3.147 3.146a.5.5 0 1 1-.708.708z"/>
                  </svg>
            </button>
        </div>
    </div>
</div>
{{if .ContainFile}}
<form action="{{ basePath "/api/v1/Downloads" }}" method="post">
    <div class="card-header">
        <div class="file d-flex flex-row align-items-center">
            <div class="form-check form-check-reverse ms-auto pe-1">
                <input class="form-check-input me-1" type="checkbox" value="" id="reverseCheck1" onClick="toggle(this);">
                <label class="form-check-label me-3" for="reverseCheck1">Select All</label>
            </div>
            <button class="btn btn-sm pb-2 px-2 ms-3 rounded" type="submit">
                <svg width="16" height="20" fill="currentColor" class="bi bi-download" viewBox="0 0 16 16" style="padding-bottom: 3px;">
                    <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5"></path>
                    <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708z"></path>
                </svg>
            </button>
        </div>
    </div>
{{end}}
    <div class="card-body p-0">
        {{template "BodyFiles" .BodyFiles}}
    </div>
{{if .ContainFile}}
</form>
<script>
    function toggle(source) {
        var checkboxes = document.querySelectorAll('input[type="checkbox"]');
        for (var i = 0; i < checkboxes.length; i++) {
            if (checkboxes[i] != source)
                checkboxes[i].checked = source.checked;
        }
    }
</script>
{{end}}
{{end}}
{{end}}