mirror of
https://github.com/sigoden/dufs.git
synced 2026-04-09 09:09:03 +03:00
feat: add basic auth and readonly mode
This commit is contained in:
@@ -10,12 +10,6 @@
|
||||
<body>
|
||||
<div class="head">
|
||||
<div class="breadcrumb"></div>
|
||||
<div class="action" title="Upload file">
|
||||
<label for="file">
|
||||
<svg viewBox="0 0 384.97 384.97" width="14" height="14"><path d="M372.939,264.641c-6.641,0-12.03,5.39-12.03,12.03v84.212H24.061v-84.212c0-6.641-5.39-12.03-12.03-12.03 S0,270.031,0,276.671v96.242c0,6.641,5.39,12.03,12.03,12.03h360.909c6.641,0,12.03-5.39,12.03-12.03v-96.242 C384.97,270.019,379.58,264.641,372.939,264.641z"></path><path d="M117.067,103.507l63.46-62.558v235.71c0,6.641,5.438,12.03,12.151,12.03c6.713,0,12.151-5.39,12.151-12.03V40.95 l63.46,62.558c4.74,4.704,12.439,4.704,17.179,0c4.74-4.704,4.752-12.319,0-17.011l-84.2-82.997 c-4.692-4.656-12.584-4.608-17.191,0L99.888,86.496c-4.752,4.704-4.74,12.319,0,17.011 C104.628,108.211,112.327,108.211,117.067,103.507z"></path></svg>
|
||||
</label>
|
||||
<input type="file" id="file" name="file" multiple>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="uploaders">
|
||||
@@ -34,11 +28,12 @@
|
||||
</div>
|
||||
<script>
|
||||
|
||||
const $head = document.querySelector(".head");
|
||||
const $tbody = document.querySelector(".main tbody");
|
||||
const $breadcrumb = document.querySelector(".breadcrumb");
|
||||
const $fileInput = document.getElementById("file");
|
||||
const $uploaders = document.querySelector(".uploaders");
|
||||
const { breadcrumb, paths } = __DATA__;
|
||||
const $uploadControl = document.querySelector(".upload-control");
|
||||
const { breadcrumb, paths, readonly } = __DATA__;
|
||||
let uploaderIdx = 0;
|
||||
|
||||
class Uploader {
|
||||
@@ -121,6 +116,17 @@
|
||||
`)
|
||||
}
|
||||
|
||||
function addUploadControl() {
|
||||
$head.insertAdjacentHTML("beforeend", `
|
||||
<div class="upload-control" title="Upload file">
|
||||
<label for="file">
|
||||
<svg viewBox="0 0 384.97 384.97" width="14" height="14"><path d="M372.939,264.641c-6.641,0-12.03,5.39-12.03,12.03v84.212H24.061v-84.212c0-6.641-5.39-12.03-12.03-12.03 S0,270.031,0,276.671v96.242c0,6.641,5.39,12.03,12.03,12.03h360.909c6.641,0,12.03-5.39,12.03-12.03v-96.242 C384.97,270.019,379.58,264.641,372.939,264.641z"></path><path d="M117.067,103.507l63.46-62.558v235.71c0,6.641,5.438,12.03,12.151,12.03c6.713,0,12.151-5.39,12.151-12.03V40.95 l63.46,62.558c4.74,4.704,12.439,4.704,17.179,0c4.74-4.704,4.752-12.319,0-17.011l-84.2-82.997 c-4.692-4.656-12.584-4.608-17.191,0L99.888,86.496c-4.752,4.704-4.74,12.319,0,17.011 C104.628,108.211,112.327,108.211,117.067,103.507z"></path></svg>
|
||||
</label>
|
||||
<input type="file" id="file" name="file" multiple>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
|
||||
function getSvg(path_type) {
|
||||
switch (path_type) {
|
||||
case "Dir":
|
||||
@@ -161,14 +167,17 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
addBreadcrumb(breadcrumb);
|
||||
paths.forEach(file => addFile(file));
|
||||
$fileInput.addEventListener("change", e => {
|
||||
const files = e.target.files;
|
||||
for (const file of files) {
|
||||
uploaderIdx += 1;
|
||||
const uploader = new Uploader(uploaderIdx, file);
|
||||
uploader.upload();
|
||||
}
|
||||
});
|
||||
if (readonly) {
|
||||
addUploadControl();
|
||||
document.getElementById("file").addEventListener("change", e => {
|
||||
const files = e.target.files;
|
||||
for (const file of files) {
|
||||
uploaderIdx += 1;
|
||||
const uploader = new Uploader(uploaderIdx, file);
|
||||
uploader.upload();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user