Add downloads info tooltip in details window

This commit is contained in:
2022-11-01 10:54:55 +01:00
parent c166148db3
commit 666291a1d6

View File

@@ -93,6 +93,8 @@ let update_chart = (timespan, interval) => {
}) })
} }
let download_info = false
onMount(() => { onMount(() => {
chart.data().datasets = [ chart.data().datasets = [
{ {
@@ -151,20 +153,31 @@ onMount(() => {
{(file.bandwidth_used_paid/file.size).toFixed(1)}x file size {(file.bandwidth_used_paid/file.size).toFixed(1)}x file size
</td> </td>
</tr> </tr>
<tr style="border-bottom: none"> <tr>
<td>Unique downloads</td> <td>
Unique downloads
<button class="button round"
class:button_highlight={download_info}
style="margin: 0;"
on:click={() => download_info = !download_info}
>
<i class="icon">help</i>
</button>
</td>
<td>{formatThousands(file.downloads)}</td> <td>{formatThousands(file.downloads)}</td>
</tr> </tr>
<tr> {#if download_info}
<td colspan="2"> <tr>
The unique download counter only counts downloads once per IP <td colspan="2">
address. So this number shows how many individual people have The unique download counter only counts downloads once per IP
attempted to download the file. The download counter on the address. So this number shows how many individual people have
toolbar on the other hand shows how many real downloads the file attempted to download the file. The download counter on the
has had. Real downloads are counted by dividing the total toolbar on the other hand shows how many real downloads the file
bandwidth usage by the size of the file. has had. Real downloads are counted by dividing the total
</td> bandwidth usage by the size of the file.
</tr> </td>
</tr>
{/if}
<tr> <tr>
<td>Upload Date</td> <td>Upload Date</td>
<td>{formatDate(file.date_upload, true, true, true)}</td> <td>{formatDate(file.date_upload, true, true, true)}</td>
@@ -199,12 +212,6 @@ onMount(() => {
Charts rendered by the amazing <a href="https://www.chartjs.org/" target="_blank">Chart.js</a>. Charts rendered by the amazing <a href="https://www.chartjs.org/" target="_blank">Chart.js</a>.
</p> </p>
<h3>About</h3>
<p>
Pixeldrain is a file sharing platform.
<a href="/" target="_blank">Visit the home page for more information.</a>
</p>
<h3>Keyboard Controls</h3> <h3>Keyboard Controls</h3>
<table style="max-width: 100%;"> <table style="max-width: 100%;">
<tr><td colspan="2">File Shortcuts</td></tr> <tr><td colspan="2">File Shortcuts</td></tr>