Add direct linking to user home

This commit is contained in:
2021-08-10 19:17:54 +02:00
parent d76b26b6d0
commit a7bf875dcc
3 changed files with 100 additions and 34 deletions

View File

@@ -1,24 +1,24 @@
function loadGraph(graph, stat, minutes, interval){ function loadGraph(graph, stat, minutes, interval) {
let today = new Date() let today = new Date()
let start = new Date() let start = new Date()
start.setMinutes(start.getMinutes()-minutes) start.setMinutes(start.getMinutes() - minutes)
fetch( fetch(
apiEndpoint+"/user/time_series/" + stat + apiEndpoint + "/user/time_series/" + stat +
"?start="+start.toISOString() + "?start=" + start.toISOString() +
"&end="+today.toISOString() + "&end=" + today.toISOString() +
"&interval="+interval "&interval=" + interval
).then(resp => { ).then(resp => {
if (!resp.ok) { return Promise.reject("Error: "+resp.status);} if (!resp.ok) { return Promise.reject("Error: " + resp.status); }
return resp.json(); return resp.json();
}).then(resp => { }).then(resp => {
resp.timestamps.forEach((val, idx) => { resp.timestamps.forEach((val, idx) => {
let date = new Date(val); let date = new Date(val);
let dateStr = ("00"+(date.getMonth()+1)).slice(-2); let dateStr = ("00" + (date.getMonth() + 1)).slice(-2);
dateStr += "-"+("00"+date.getDate()).slice(-2); dateStr += "-" + ("00" + date.getDate()).slice(-2);
dateStr += " "+("00"+date.getHours()).slice(-2); dateStr += " " + ("00" + date.getHours()).slice(-2);
dateStr += ":"+("00"+date.getMinutes()).slice(-2); dateStr += ":" + ("00" + date.getMinutes()).slice(-2);
resp.timestamps[idx] = " "+dateStr+" "; // Poor man's padding resp.timestamps[idx] = " " + dateStr + " "; // Poor man's padding
}); });
graph.data.labels = resp.timestamps; graph.data.labels = resp.timestamps;
graph.data.datasets[0].data = resp.amounts; graph.data.datasets[0].data = resp.amounts;
@@ -35,27 +35,53 @@ function loadGraph(graph, stat, minutes, interval){
document.getElementById("total_downloads").innerText = formatThousands(total); document.getElementById("total_downloads").innerText = formatThousands(total);
} else if (stat == "bandwidth") { } else if (stat == "bandwidth") {
document.getElementById("total_bandwidth").innerText = formatDataVolume(total, 3); document.getElementById("total_bandwidth").innerText = formatDataVolume(total, 3);
} else if (stat == "direct_bandwidth") {
document.getElementById("total_direct_bandwidth").innerText = formatDataVolume(total, 3);
} }
}).catch(e => { }).catch(e => {
console.error("Error requesting time series: "+e); console.error("Error requesting time series: " + e);
})
}
function loadDirectBW() {
let today = new Date()
let start = new Date()
start.setDate(start.getDate() - 30)
fetch(
apiEndpoint + "/user/time_series/direct_bandwidth" +
"?start=" + start.toISOString() +
"&end=" + today.toISOString() +
"&interval=60"
).then(resp => {
if (!resp.ok) { return Promise.reject("Error: " + resp.status); }
return resp.json();
}).then(resp => {
let total = resp.amounts.reduce((accum, val) => accum += val, 0);
document.getElementById("direct_bandwidth_month").innerText = formatDataVolume(total, 4)
}).catch(e => {
console.error("Error requesting time series: " + e);
}) })
} }
let graphViews = drawGraph(document.getElementById("views_chart"), "Views", "number"); let graphViews = drawGraph(document.getElementById("views_chart"), "Views", "number");
let graphDownloads = drawGraph(document.getElementById("downloads_chart"), "Downloads", "number"); let graphDownloads = drawGraph(document.getElementById("downloads_chart"), "Downloads", "number");
let graphBandwidth = drawGraph(document.getElementById("bandwidth_chart"), "Bandwidth", "bytes"); let graphBandwidth = drawGraph(document.getElementById("bandwidth_chart"), "Bandwidth", "bytes");
let graphDirectBandwidth = drawGraph(document.getElementById("direct_bandwidth_chart"), "Direct Bandwidth", "bytes");
let graphTimeout = null; let graphTimeout = null;
function updateGraphs(minutes, interval, live) { function updateGraphs(minutes, interval, live) {
if (graphTimeout !== null) { clearTimeout(graphTimeout) } if (graphTimeout !== null) { clearTimeout(graphTimeout) }
if (live) { if (live) {
graphTimeout = setTimeout(() => {updateGraphs(minutes, interval, true)}, 10000) graphTimeout = setTimeout(() => { updateGraphs(minutes, interval, true) }, 10000)
} }
loadGraph(graphViews, "views", minutes, interval); loadGraph(graphViews, "views", minutes, interval);
loadGraph(graphDownloads, "downloads", minutes, interval); loadGraph(graphDownloads, "downloads", minutes, interval);
loadGraph(graphBandwidth, "bandwidth", minutes, interval); loadGraph(graphBandwidth, "bandwidth", minutes, interval);
loadGraph(graphDirectBandwidth, "direct_bandwidth", minutes, interval);
loadDirectBW()
} }
// Default // Default
updateGraphs(10080, 60, false); updateGraphs(1440, 1, true);

View File

@@ -31,6 +31,11 @@
<li>Files never expire</li> <li>Files never expire</li>
{{end}} {{end}}
<li>File size limit: {{formatData .User.Subscription.FileSizeLimit}}</li> <li>File size limit: {{formatData .User.Subscription.FileSizeLimit}}</li>
<li>
Direct linking bandwidth:
{{formatData .User.Subscription.DirectLinkingBandwidth}}
(<span id="direct_bandwidth_month">0 B</span> used in the last 30 days)
</li>
</ul> </ul>
</li> </li>
</ul> </ul>
@@ -44,14 +49,13 @@
<p> <p>
Here you can see how often your files are viewed, downloaded Here you can see how often your files are viewed, downloaded
and how much bandwidth they consume. The buttons at the top and how much bandwidth they consume. The buttons at the top
can be pressed to adjust the timeframe. If you choose 'Live' can be pressed to adjust the timeframe. If you choose 'Day'
or 'Day' the statistics will be updated periodically. No the statistics will be updated periodically. No need to
need to refresh the page. refresh the page.
</p> </p>
</div> </div>
<div class="highlight_dark"> <div class="highlight_dark">
<button onclick="updateGraphs(720, 1, true);">Live</button> <button onclick="updateGraphs(1440, 1, true);">Day</button>
<button onclick="updateGraphs(1440, 10, true);">Day</button>
<button onclick="updateGraphs(10080, 60, false);">Week</button> <button onclick="updateGraphs(10080, 60, false);">Week</button>
<button onclick="updateGraphs(20160, 60, false);">Two Weeks</button> <button onclick="updateGraphs(20160, 60, false);">Two Weeks</button>
<button onclick="updateGraphs(43200, 1440, false);">Month</button> <button onclick="updateGraphs(43200, 1440, false);">Month</button>
@@ -59,23 +63,63 @@
<button onclick="updateGraphs(262800, 1440, false);">Half-year</button> <button onclick="updateGraphs(262800, 1440, false);">Half-year</button>
<button onclick="updateGraphs(525600, 1440, false);">Year</button> <button onclick="updateGraphs(525600, 1440, false);">Year</button>
</div> </div>
<h3>Views</h3> <div class="limit_width">
<h3>Views</h3>
<p>
A view is counted when someone visits the download page of one
of your files. Views are unique per user per file.
</p>
</div>
<div class="chart-container" style="position: relative; width: 100%; height: 140px;"> <div class="chart-container" style="position: relative; width: 100%; height: 140px;">
<canvas id="views_chart"></canvas> <canvas id="views_chart"></canvas>
</div> </div>
<h3>Downloads</h3> <div class="limit_width">
<h3>Downloads</h3>
<p>
Downloads are counted when a user clicks the download button
on one of your files. It does not matter whether the
download is completed or not, only the start of the download
is counted.
</p>
</div>
<div class="chart-container" style="position: relative; width: 100%; height: 140px;"> <div class="chart-container" style="position: relative; width: 100%; height: 140px;">
<canvas id="downloads_chart"></canvas> <canvas id="downloads_chart"></canvas>
</div> </div>
<h3>Bandwidth</h3> <div class="limit_width">
<h3>Bandwidth</h3>
<p>
This is how much bandwidth your files are using in total.
Bandwidth is used when a file is tranferred from a
pixeldrain server to a user who is downloading the file.
When a 5 MB file is downloaded 8 times it has used 40 MB of
bandwidth.
</p>
</div>
<div class="chart-container" style="position: relative; width: 100%; height: 140px;"> <div class="chart-container" style="position: relative; width: 100%; height: 140px;">
<canvas id="bandwidth_chart"></canvas> <canvas id="bandwidth_chart"></canvas>
</div> </div>
<div class="limit_width">
<h3>Direct link bandwidth</h3>
<p>
When a file is downloaded without going through pixeldrain's
download page it counts as a direct download. Because direct
downloads cost us bandwidth and don't generate any ad
revenue we have to limit them. When your direct link
bandwidth runs out people will be asked to do a test before
they can download your files. See our
<a href="/#pro">subscription options</a> to get more direct
linking bandwidth.
</p>
</div>
<div class="chart-container" style="position: relative; width: 100%; height: 140px;">
<canvas id="direct_bandwidth_chart"></canvas>
</div>
<div class="highlight_dark"> <div class="highlight_dark">
Total usage from <span id="time_start"></span> to <span id="time_end"></span><br/> Total usage from <span id="time_start"></span> to <span id="time_end"></span><br/>
<span id="total_views"></span> views, <span id="total_views"></span> views,
<span id="total_downloads"></span> downloads and <span id="total_downloads"></span> downloads,
<span id="total_bandwidth"></span> bandwidth <span id="total_bandwidth"></span> bandwidth and
<span id="total_direct_bandwidth"></span> direct link bandwidth
</div> </div>
</div> </div>

View File

@@ -78,23 +78,19 @@ func (vd *viewerData) adType(files []pixelapi.ListFile) {
// Intn returns a number up to n, but never n itself. So to get a random 0 // Intn returns a number up to n, but never n itself. So to get a random 0
// or 1 we need to give it n=2. We can use this function to make other // or 1 we need to give it n=2. We can use this function to make other
// splits like 1/3 1/4, etc // splits like 1/3 1/4, etc
switch i := rand.Intn(8); i { switch i := rand.Intn(4); i {
case 0: // 12.5% case 0: // 25%
vd.AdBannerType = brave vd.AdBannerType = brave
case 1, 2, 3, 4, 5, 6, 7: // 87.5% case 2, 3, 4: // 75%
vd.AdBannerType = aAds vd.AdBannerType = aAds
default: default:
panic(fmt.Errorf("random number generator returned unrecognised number: %d", i)) panic(fmt.Errorf("random number generator returned unrecognised number: %d", i))
} }
// If the file is larger than 10 MB we enable floating popups // If the file is larger than 5 MB we enable floating popups
if avgSize > 10e6 { if avgSize > 5e6 {
vd.AdFloaterType = propellerFloat vd.AdFloaterType = propellerFloat
} }
if avgSize > 250e6 {
vd.AdPopupType = clickAduPopup
}
} }
// ServeFileViewer controller for GET /u/:id // ServeFileViewer controller for GET /u/:id