blob: 0e32e3786ceceaf16fd59c31bf15db1ecf5ab4c5 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
<!DOCTYPE html>
<html>
<head>
<title>Index of</title>
<style>
h1 {
border-bottom: 1px solid black;
}
.listing {
margin: 0.5em;
display: table;
}
.listing .header,
.listing .entry {
display: table-row;
}
.listing .header {
font-weight: bold;
}
.listing .header span,
.listing .entry span {
display: table-cell;
padding-right: 1em;
}
.entry span:nth-child(1) {
min-width: 20em;
}
.entry span.size,
.entry span.last-modified {
white-space: nowrap;
}
.parent_link > a:before {
content: "📁 ";
}
.parent_link {
display: none;
}
.entry.directory > .name:before {
content: "📁 ";
}
.entry.file > .name:before {
content: "📄 ";
}
.entry.symlink > .name:before {
content: "🔗 ";
}
</style>
<script>
function setData(directoryName, parentLink, rows) {
document.title += directoryName;
document.querySelector("h1").innerHTML += " " + directoryName;
if (parentLink != "") {
document.querySelector(".parent_link > a").href = parentLink;
document.querySelector(".parent_link").style.display = "initial";
}
rows.sort((rowA, rowB) => rowA[1].localeCompare(rowB[1]));
let listing = document.querySelector(".listing");
let rowTemplate = document.getElementById("rowTemplate");
for (row of rows) {
let rowElement = rowTemplate.content.cloneNode(true);
rowElement.querySelector(".entry").classList.add(row[0]);
rowElement.querySelector(".name > .link").innerText = row[1];
rowElement.querySelector(".name > .link").href = row[2];
rowElement.querySelector(".size").innerText = row[3];
rowElement.querySelector(".last-modified").innerText = row[4];
listing.appendChild(rowElement);
}
}
</script>
</head>
<body>
<h1>Index of</h1>
<div class="parent_link"><a href="">Up to parent directory</a></div>
<div class="listing">
<div class="header">
<span class="name">Name</span>
<span class="size">Size</span>
<span class="last-modified">Last Modified</span>
</div>
</div>
<template id="rowTemplate">
<div class="entry">
<span class="name"><a class="link"></a></span>
<span class="size"></span>
<span class="last-modified"></span>
</div>
</template>
</body>
</html>
|
