{{template "layout.html" .}}

{{define "title"}}{{ title .Name }}{{end}}

{{define "content"}}
<div class="page-header">
    <div class="page-tabs">
        <h3>{{ title .Name }}</h3>
        <p>{{ .Type_ }}</p>

        {{ $history := history .Id }}

        <nav>
            <div class="nav nav-tabs" id="nav-tab" role="tablist">
                {{ $active := " active"}}
                {{- if gt (len .Structures) 0 }}
                <a class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-structures" type="button" role="tab">Structures</a>
                {{ $active = ""}}{{- end}}
                {{- if gt (len .SiteProperties) 0 }}
                <a class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-site-properties" type="button"
                    role="tab">Properties</a>
                {{ $active = ""}}{{- end}}
                {{- if gt (len $history) 0 }}
                <a class="nav-link{{$active}}" data-bs-toggle="tab" data-bs-target="#nav-history" type="button" role="tab">History</a>
                {{ $active = ""}}{{- end}}
            </div>
        </nav>
        <div class="tab-content" id="nav-tabContent">
            {{ $active := " active"}}
            {{- if gt (len .Structures) 0 }}
            <div class="tab-pane{{$active}}" id="nav-structures" role="tabpanel">
                <table class="table table-hover table-sm table-borderless object-table">
                    <tr>
                        <th>Name</th>
                        <th width="100%">Type</th>
                    </tr>
                    {{- range .Structures }}
                    <tr>
                        <td>{{ structure $.Id .Id }}</td>
                        <td>{{ .Type }}{{if .Ruin}} (ruin){{end}}</td>
                    </tr>
                    {{- end}}
                </table>
            </div>
            {{ $active = ""}}{{- end}}
            {{- if gt (len .SiteProperties) 0 }}
            <div class="tab-pane{{$active}}" id="nav-site-properties" role="tabpanel">
                <table class="table table-hover table-sm table-borderless object-table">
                    <tr>
                        <th>Type</th>
                        <th width="100%">Name or Owner</th>
                    </tr>
                    {{- range .SiteProperties }}
                    <tr>
                        <td>{{ if ne .StructureId -1 }}{{ structure $.Id .StructureId }}{{else}}{{ .Type_ }}{{end}}</td>
                        <td>{{ if ne .OwnerHfid -1 }}{{ hf .OwnerHfid }}{{else}}no
                            owner{{ end }}</td>
                    </tr>
                    {{- end}}
                </table>
            </div>
            {{ $active = ""}}{{- end}}
            {{ $history := history .Id }}
            {{- if gt (len $history) 0 }}
            <div class="tab-pane{{$active}} pt-3" id="nav-history" role="tabpanel">
                {{ template "events.html" events $history }}
            </div>
            {{ $active = ""}}{{- end}}
        </div>
    </div>
    {{ if world.MapReady }}
    <div class="page-map">
        <div id="map" style="width: 300px; height: 300px"></div>
        <!-- <img class="site-map" src="$suburi/sitemap/$site.id" width="300" /> -->
        {{initMap}}
        {{ addSite .Id false }}
    </div>
    {{- end }}
</div>

<h5 class="mt-3">Events</h5>
{{ template "events.html" events . }}

<p>{{ json . }}</p>
{{- end }}