{{ define "content" }}
{{ with .Data }}
<div class="listing">
    <div class="container" id="listing">
    {{- range .Items}}
        {{ if .UserAllowed }}
        <div ondragstart="itemDragStart(event)" 
        {{ if .IsDir}}ondragover="itemDragOver(event)" ondrop="itemDrop(event)"{{ end }} 
        draggable="true" 
        class="item" 
        onclick="selectItem(event)"
        ondblclick="openItem(event)"
        data-dir="{{ .IsDir }}" 
        data-url="{{ .URL }}"
        id="{{.URL}}">
            <div>
                {{- if .IsDir}}
                <i class="material-icons">folder</i>
                {{- else}}
                <i class="material-icons">insert_drive_file</i>
                {{- end}}
            </div>
            <div>
                <span class="name">{{.Name}}</span>
                {{- if .IsDir}}
                <p data-order="-1">&mdash;</p>
                {{- else}}
                <p data-order="{{.Size}}">{{.HumanSize}}</p>
                {{- end}}
                <p>
                <time datetime="{{.HumanModTime " 2006-01-02T15:04:05Z"}}">{{.HumanModTime "01/02/2006 03:04:05 PM -07:00"}}</time>
                </p>
            </div>
        </div>
        {{ end }}
    {{- end}}
    </div>
</div>

<input style="display:none" type="file" id="upload-input" onchange="handleFiles(this.files, '')" value="Upload" multiple>
{{ end }}

{{ if .User.AllowNew }}
<input id="newdir" type="text" placeholder="Name. End with a trailing slash to create a dir.">
<div class="floating">
    <div class="action" id="new">
        <i class="material-icons" title="New file or directory. End name with a trailing slash to create a directory.">add</i>
    </div>
</div>
{{ end }}
{{ end }}