{{ define "content" }}{{ $path := .Path }}

<div class="full scroll">
  <header>
    <div class="container">
      <h1>{{ $path }}</h1>
    </div>
  </header>

  <main class="browse">
    <div class="actions">
      <div class="container">
        {{if .CanGoUp}}<a data-pjax href=".." class="up" title="Up one level"><i class="fa fa-arrow-left fa-lg"></i></a>{{end}}
        <div class="go-right">
          <input type="file" value="Upload" multiple>
          <button id="upload">Upload <i class="fa fa-cloud-upload"></i></button>
          <button class="default new">New <i class="fa fa-plus"></i></button>
          <div id="new-file">
            Write the name of the new file. If you want to use an archetype, add ':archetype' in the end, replacing 'archetype' by its name.
            <input id="new-file-name" type="text">
          </div>
        </div>
      </div>
    </div>

    <div class="container">
      <table>
        <tr>
          <th class="left">
            {{if and (eq .Sort "name") (ne .Order "desc")}}
            <a data-pjax href="?sort=name&order=desc">Name <i class="fa fa-arrow-up"></i></a> {{else if and (eq .Sort "name") (ne .Order "asc")}}
            <a data-pjax href="?sort=name&order=asc">Name <i class="fa fa-arrow-down"></i></a> {{else}}
            <a data-pjax href="?sort=name&order=asc">Name</a> {{end}}
          </th>
          <th class="right hideable">
            {{if and (eq .Sort "size") (ne .Order "desc")}}
            <a data-pjax href="?sort=size&order=desc">Size <i class="fa fa-arrow-up"></i></a> {{else if and (eq .Sort "size") (ne .Order "asc")}}
            <a data-pjax href="?sort=size&order=asc">Size <i class="fa fa-arrow-down"></i></a> {{else}}
            <a data-pjax href="?sort=size&order=asc">Size</a> {{end}}
          </th>
          <th class="hideable right">
            {{if and (eq .Sort "time") (ne .Order "desc")}}
            <a href="?sort=time&order=desc">Modified <i class="fa fa-arrow-up"></i></a> {{else if and (eq .Sort "time") (ne .Order "asc")}}
            <a href="?sort=time&order=asc">Modified <i class="fa fa-arrow-down"></i></a> {{else}}
            <a href="?sort=time&order=asc">Modified</a> {{end}}
          </th>
          <th class="right"></th>
        </tr>
        {{range .Items}}
        <tr>
          <td>
            {{if .IsDir}}
            <i class="fa fa-folder"></i> <a data-pjax href="{{.URL}}">{{.Name}}</a> {{else}} {{ if CanBeEdited .URL }}
            <i class="fa fa-file"></i> <a data-pjax class="file" href="/admin/edit{{ $path }}{{.URL}}">{{.Name}}</a> {{ else }}
            <i class="fa fa-file"></i> {{.Name}} {{ end }} {{ end }}
          </td>
          <td class="right hideable">{{.HumanSize}}</td>
          <td class="right hideable">{{.HumanModTime "01/02/2006 3:04:05 PM -0700"}}</td>
          <td class="right"><button data-file="/admin/browse{{ $path }}{{.URL}}" data-message="File deleted." class="delete"><i class="fa fa-times"></i></button></td>
        </tr>
        {{end}}
      </table>
    </div>
  </main>
</div>
{{ end }}