{{ define "index" }}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head" . }}
<title>{{ .Path }}</title>
<script>
function fileExt(url) {
let i = url.toString().toLowerCase().lastIndexOf(".");
if (i === -1) {
return "";
}
return url.toString().toLowerCase().substring(url.toString().lastIndexOf("."));
}
const imgExts = [".jpg", ".jpeg", ".png", ".gif", ".webp", ".mp4"];
var dirPath = "{{ .Path }}";
if (!dirPath.endsWith("/")) {
dirPath += "/";
}
function IconCheck(elem) {
let icon = elem.querySelector(".icon");
let url = elem.querySelector(".file-name").innerText;
let ext = fileExt(url);
if (imgExts.includes(ext)) {
let mod = elem.querySelector(".mod-time").value.replaceAll(" ", "_").replaceAll(":", "_");
url = dirPath + url;
icon.innerHTML = "<img src='"+url+".png?icon=" + url + "&mod="+ mod +"' alt='a'/>";
}
}
function ZeroPad(num, size) {
num = num.toString();
for (let l = num.length;l < size;l++)num = "0" + num.toString();
return num;
}
function reverseList(list){
let c = list.childElementCount;
for (i = 1; i < c;i++){
list.insertBefore(list.children[i],list.firstChild);
}
Reversed = true;
}
function AlphabetSort(list) {
let i, switching, b, shouldSwitch;
switching = true;
while (switching) {
switching = false;
b = list.children;
for (i = 0; i < (b.length - 1); i++) {
shouldSwitch = false;
if (b[i].id.toLowerCase() > b[i + 1].id.toLowerCase()) {
shouldSwitch = true;
break;
}
}
if (shouldSwitch) {
b[i].parentNode.insertBefore(b[i + 1], b[i]);
switching = true;
}
}
Reversed = false;
currentSort = "AlphabetSort";
}
function ModSizeSort(list,size=false){
let classs = ".mod-time";
if (size===true)classs=".size";
let arr =new Array(...list.children);
arr.sort((b,a)=>(a.querySelector(classs).value)-(b.querySelector(classs).value));
arr.forEach(e=>e.parentNode.appendChild(e));
Reversed = false;
}
function ModSort(list){
ModSizeSort(list,false);
currentSort = "ModSort";
}
function SizeSort(list){
ModSizeSort(list,true);
currentSort = "SizeSort";
}
var currentSort = "ModSort";
var Reversed = false;
function Id2Fn(id){
let fn = {
AlphabetSort: AlphabetSort,
ModSort: ModSort,
SizeSort: SizeSort,
}[id];
if (currentSort === id && !Reversed) {
return function (list){fn(list);reverseList(list);}
}
else {
return function (list){fn(list);};
}
}
function SortWith(elem) {
let fn = Id2Fn(elem.id);
document.querySelectorAll(".dirs,.files").forEach(e =>fn(e));
if (Reversed) elem.parentElement.classList.add("rev");
else elem.parentElement.classList.remove("rev");
document.querySelectorAll(".CurSort").forEach(e => e.classList.remove("CurSort"));
elem.classList.add("CurSort");
localStorage.setItem("sort", currentSort);
localStorage.setItem("reversed", Reversed.toString());
}
document.addEventListener("DOMContentLoaded", function() {
document.querySelectorAll(".files > .filelabel").forEach(filelement =>IconCheck(filelement));
document.querySelectorAll(".timestr").forEach(elem => {
// let t= new Date(Date.parse("15 Mar 2025 15:23 +0000"))
let t =new Date(Date.parse(elem.title));
if (elem.innerText[0] >= '0' && elem.innerText[0] <= '9') {
elem.innerText = t.getFullYear()+"-"+ZeroPad((t.getMonth()+1),2)+"-"+ZeroPad(t.getDate(),2);
} else {
elem.innerText = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"][t.getDay()] + ", " + ZeroPad(t.getHours(),2) + ":" + ZeroPad(t.getMinutes(),2);
}
});
currentSort = localStorage.getItem("sort");
if (currentSort === null) {
currentSort = "ModSort";
}
Reversed = localStorage.getItem("reversed") !== "true";
if (currentSort==="ModSort"&&Reversed)return;
SortWith(document.getElementById(currentSort));
});
</script>
</head>
<body>
{{ if .Path }}
<header>
{{ if eq .Path "/" }}
{{ else }}
<a href=".." class="button">
<span class="icon"><</span><span>Back</span>
</a>
{{ end }}
<h1>Index of: {{ .Path }}</h1>
</header>
<div class="filelabel">
<span class="icon">l</span>
<span id="AlphabetSort" onclick="SortWith(this)" class="sorter">Name</span>
<span id="SizeSort" onclick="SortWith(this)" class="right sorter">Size</span>
<span id="ModSort" onclick="SortWith(this)" class="right CurSort sorter">Time Modified</span>
</div>
<br>
<div class="trees dirs">
{{ range .Dirs }}
{{ template "filelabel" . }}
{{ end }}
</div>
<div class="trees files">
{{ range .Items }}
{{ template "filelabel" . }}
{{ end }}
</div>
{{ else }}
{{ if .Error }}
<h1>{{ .Error }}</h1>
{{ else }}
{{ if .Upload }}
<h1>Upload</h1>
<form class="trees" enctype="multipart/form-data" action="{{ .Upload }}" method="post">
<div class="filelabel"><span>Path:</span><input type="text" name="path" /></div>
<div class="filelabel"><span>File:</span><input type="file" name="myFile" /></div>
<div class="filelabel"><span>Username:</span><input type="text" name="username" /></div>
<div class="filelabel"><span>Password:</span><input type="password" name="password" /></div>
<div class="filelabel"><span>OTP:</span><input type="text" name="otp" /></div>
<div class="filelabel"><span></span><input type="submit" value="Upload" /></div>
</form>
{{ end }}
{{ end }}
{{ end }}
</body>
</html>
{{ end }}