Skip to content

Commit

Permalink
feat: add file info dropdown menu. closes #11
Browse files Browse the repository at this point in the history
  • Loading branch information
@adrianschubek
adrianschubek committed Jun 20, 2024
1 parent d45c196 commit 87a0e0b
Showing 1 changed file with 23 additions and 11 deletions.
34 changes: 23 additions & 11 deletions src/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -436,7 +436,7 @@ function downloadBatch(array $urls) {
}
} /* FIXME breakes dropstart */
$[end]$
.dropdown-toggle {
.drop-toggle {
padding: 0 8px 0 8px;
border-radius: 5px;
}
Expand Down Expand Up @@ -634,6 +634,7 @@ function toggletheme() {
$[if `process.env.DOWNLOAD_COUNTER === "true"`]$<a href="" class="col col-auto text-end d-none d-md-inline-block" id="dl">Downloads<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrows-sort"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l4 -4l4 4m-4 -4v14" /><path d="M21 15l-4 4l-4 -4m4 4v-14" /></svg></a>$[end]$
<a href="" class="col col-2 text-end d-none d-md-inline-block" id="size">Size<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrows-sort"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l4 -4l4 4m-4 -4v14" /><path d="M21 15l-4 4l-4 -4m4 4v-14" /></svg></a>
<a href="" class="col col-2 text-end d-none d-md-inline-block" id="mod">Modified<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrows-sort"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M3 9l4 -4l4 4m-4 -4v14" /><path d="M21 15l-4 4l-4 -4m4 4v-14" /></svg></a>
<div class="col col-auto text-end d-none d-md-inline-block" id="mod">Actions</div>
</div>
</div>
<div class="rounded container card border-2 px-3" style="border-top: none !important;border-top-right-radius: 0 !important;border-top-left-radius: 0 !important;" id="filetree">
Expand Down Expand Up @@ -721,17 +722,17 @@ function toggletheme() {
</div>
<div class="col col-auto stopprop">
<div class="btn-group dropdown dropstart">
<button class="btn btn-secondary dropdown-toggle btn-small" type="button" data-bs-toggle="dropdown" aria-expanded="false"></button>
<button class="btn drop-toggle btn-small" type="button" data-bs-toggle="dropdown" aria-expanded="false"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-info-circle"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2c5.523 0 10 4.477 10 10a10 10 0 0 1 -19.995 .324l-.005 -.324l.004 -.28c.148 -5.393 4.566 -9.72 9.996 -9.72zm0 9h-1l-.117 .007a1 1 0 0 0 0 1.986l.117 .007v3l.007 .117a1 1 0 0 0 .876 .876l.117 .007h1l.117 -.007a1 1 0 0 0 .876 -.876l.007 -.117l-.007 -.117a1 1 0 0 0 -.764 -.857l-.112 -.02l-.117 -.006v-3l-.007 -.117a1 1 0 0 0 -.876 -.876l-.117 -.007zm.01 -3l-.127 .007a1 1 0 0 0 0 1.986l.117 .007l.127 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z" /></svg></button>
<ul class="dropdown-menu">
<!-- <li><a class="dropdown-item stopprop" onclick="actionDownload()">Download</a></li> -->
<li><span class="dropdown-item stopprop">Download</span></li>
<li><span class="dropdown-item stopprop">API</span></li>
<hr/>
<li><span class="dropdown-item stopprop" onclick="alert(1)">Copy Hash</span></li>
<li><span class="dropdown-item stopprop">Copy Filename</span></li>
<li><span class="dropdown-item stopprop">Copy Downloads</span></li>
<li><span class="dropdown-item stopprop">Copy URL</span></li>
<li><span class="dropdown-item stopprop">Copy Date</span></li>
<!-- <li><span class="dropdown-item stopprop">Download</span></li> -->
<li><span class="dropdown-item stopprop" onclick="window.open('${{`process.env.BASE_PATH ?? ''`}}$<?= $file->url ?>?<?= $file->is_dir ? "ls" : "info"?>')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-external-link"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 6h-6a2 2 0 0 0 -2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-6" /><path d="M11 13l9 -9" /><path d="M15 4h5v5" /></svg>API</span></li>
<hr style="margin:0;margin-top: 2px;margin-bottom: 2px;"/>
<li><span class="dropdown-item stopprop <?= $file->is_dir ? "disabled" : ""?>" onclick="getHashViaApi('${{`process.env.BASE_PATH ?? ''`}}$<?= $file->url ?>?info')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-copy"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" /><path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" /></svg> Hash</span></li>
<li><span class="dropdown-item stopprop" onclick="navigator.clipboard.writeText('<?= $file->name ?>')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-copy"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" /><path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" /></svg> Filename</span></li>
<li><span class="dropdown-item stopprop" onclick="navigator.clipboard.writeText('<?= $file->dl_count ?>')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-copy"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" /><path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" /></svg> Downloads</span></li>
<li><span class="dropdown-item stopprop" onclick="navigator.clipboard.writeText('${{`process.env.BASE_PATH ?? ''`}}$<?= $file->url ?>')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-copy"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" /><path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" /></svg> URL</span></li>
<li><span class="dropdown-item stopprop" onclick="navigator.clipboard.writeText('<?= $file->modified_date ?>')"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-copy"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 7m0 2.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667z" /><path d="M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1" /></svg> Date</span></li>
</ul>
</div>
</div>
Expand Down Expand Up @@ -826,6 +827,17 @@ function getRelativeTimeString(date, lang = navigator.language) {
}
$[end]$
$[if `process.env.HASH === "true"`]$
// via api bc otherwise we need to include the hash in the tree itself which is costly
const getHashViaApi = async (url) => {
await fetch(url)
.then(response => response.json())
.then(data => {
navigator.clipboard.writeText(data.hash_${{`process.env.HASH_ALGO`}}$);
});
}
$[end]$
// Batch download
$[if `process.env.BATCH_DOWNLOAD === "true"`]$
const download = async (all) => {
Expand Down Expand Up @@ -1006,7 +1018,7 @@ function getRelativeTimeString(date, lang = navigator.language) {
});
});
document.querySelectorAll(".dropdown-toggle").forEach((el) => {
document.querySelectorAll(".drop-toggle").forEach((el) => {
el.addEventListener("hover", (e) => {
console.log("hover");
// close all other dropdowns
Expand Down

0 comments on commit 87a0e0b

Please sign in to comment.