Add UI for viewing storage space limit
This commit is contained in:
@@ -58,7 +58,12 @@ function loadDirectBW() {
|
|||||||
return resp.json();
|
return resp.json();
|
||||||
}).then(resp => {
|
}).then(resp => {
|
||||||
let total = resp.amounts.reduce((accum, val) => accum += val, 0);
|
let total = resp.amounts.reduce((accum, val) => accum += val, 0);
|
||||||
document.getElementById("direct_bandwidth_month").innerText = formatDataVolume(total, 4)
|
document.getElementById("direct_bandwidth_progress").style.width = (total / window.user.subscription.direct_linking_bandwidth) * 100 + "%"
|
||||||
|
document.getElementById("direct_bandwidth_text").innerText = formatDataVolume(total, 3) + " out of " + formatDataVolume(window.user.subscription.direct_linking_bandwidth, 3)
|
||||||
|
|
||||||
|
document.getElementById("storage_progress").style.width = (window.user.storage_space_used / window.user.subscription.storage_space) * 100 + "%"
|
||||||
|
document.getElementById("storage_text").innerText = formatDataVolume(window.user.storage_space_used, 3) + " out of " + formatDataVolume(window.user.subscription.storage_space, 3)
|
||||||
|
|
||||||
}).catch(e => {
|
}).catch(e => {
|
||||||
console.error("Error requesting time series: " + e);
|
console.error("Error requesting time series: " + e);
|
||||||
})
|
})
|
||||||
|
@@ -3,7 +3,24 @@
|
|||||||
<head>
|
<head>
|
||||||
{{template "meta_tags" .User.Username}}
|
{{template "meta_tags" .User.Username}}
|
||||||
{{template "user_style" .}}
|
{{template "user_style" .}}
|
||||||
<script>var apiEndpoint = '{{.APIEndpoint}}';</script>
|
<script>
|
||||||
|
var apiEndpoint = '{{.APIEndpoint}}';
|
||||||
|
window.user = {{.User}};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.progress_bar_outer {
|
||||||
|
background-color: var(--layer_1_color);
|
||||||
|
width: 100%;
|
||||||
|
height: 3px;
|
||||||
|
}
|
||||||
|
.progress_bar_inner {
|
||||||
|
background-color: var(--highlight_color);
|
||||||
|
height: 100%;
|
||||||
|
width: 0;
|
||||||
|
transition: width 1s;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
@@ -23,29 +40,45 @@
|
|||||||
(<a href="https://www.patreon.com/join/pixeldrain/checkout?edit=1">Manage subscription</a>)
|
(<a href="https://www.patreon.com/join/pixeldrain/checkout?edit=1">Manage subscription</a>)
|
||||||
{{end}}
|
{{end}}
|
||||||
<ul>
|
<ul>
|
||||||
<li>Ads when viewing files: {{if .User.Subscription.DisableAdDisplay}}No{{else}}Yes{{end}}</li>
|
<li>Advertisements when viewing files: {{if .User.Subscription.DisableAdDisplay}}No{{else}}Yes{{end}}</li>
|
||||||
<li>Ads on your uploaded files: {{if .User.Subscription.DisableAdsOnFiles}}No{{else}}Yes{{end}}</li>
|
<li>Advertisements on your uploaded files: {{if .User.Subscription.DisableAdsOnFiles}}No{{else}}Yes{{end}}</li>
|
||||||
{{if gt .User.Subscription.FileExpiryDays 0}}
|
{{if gt .User.Subscription.FileExpiryDays 0}}
|
||||||
<li>Files expire after {{.User.Subscription.FileExpiryDays}} days</li>
|
<li>Files expire after {{.User.Subscription.FileExpiryDays}} days</li>
|
||||||
{{else}}
|
{{else}}
|
||||||
<li>Files never expire</li>
|
<li>Files never expire</li>
|
||||||
{{end}}
|
{{end}}
|
||||||
<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)
|
|
||||||
<br/>
|
|
||||||
<a href="/#direct_linking">More information about direct linking</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<a href="/user/settings" class="button button_highlight">Change account settings</a>
|
|
||||||
<br/><br/>
|
|
||||||
<a href="/user/export/files" class="button">Export uploaded files to CSV</a>
|
|
||||||
<a href="/user/export/lists" class="button">Export created lists to CSV</a>
|
|
||||||
|
|
||||||
|
<h3>Limits</h3>
|
||||||
|
Storage: <span id="storage_text"></span><br/>
|
||||||
|
<div class="progress_bar_outer">
|
||||||
|
<div id="storage_progress" class="progress_bar_inner" style="width: 0%;"></div>
|
||||||
|
</div>
|
||||||
|
<br/>
|
||||||
|
Direct link bandwidth: <span id="direct_bandwidth_text"></span>
|
||||||
|
(<a href="/#direct_linking">More information about direct linking</a>)
|
||||||
|
<div class="progress_bar_outer">
|
||||||
|
<div id="direct_bandwidth_progress" class="progress_bar_inner" style="width: 0%;"></div>
|
||||||
|
</div>
|
||||||
|
<br/>
|
||||||
|
|
||||||
|
<h3>Settings</h3>
|
||||||
|
<div style="text-align: center;">
|
||||||
|
<a href="/user/settings" class="button button_highlight">
|
||||||
|
<i class="icon">edit</i>
|
||||||
|
Change account settings
|
||||||
|
</a>
|
||||||
|
<a href="/user/export/files" class="button">
|
||||||
|
<i class="icon">list</i>
|
||||||
|
Export uploaded files to CSV
|
||||||
|
</a>
|
||||||
|
<a href="/user/export/lists" class="button">
|
||||||
|
<i class="icon">list</i>
|
||||||
|
Export created lists to CSV
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Statistics</h2>
|
<h2>Statistics</h2>
|
||||||
<p>
|
<p>
|
||||||
|
@@ -74,8 +74,8 @@
|
|||||||
window.api_endpoint = '{{.APIEndpoint}}';
|
window.api_endpoint = '{{.APIEndpoint}}';
|
||||||
window.user_subscription = {{.User.Subscription}};
|
window.user_subscription = {{.User.Subscription}};
|
||||||
</script>
|
</script>
|
||||||
<link rel='stylesheet' href='/res/svelte/home_page.css?v9'>
|
<link rel='stylesheet' href='/res/svelte/home_page.css?v1'>
|
||||||
<script defer src='/res/svelte/home_page.js?v9'></script>
|
<script defer src='/res/svelte/home_page.js?v1'></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{{template "page_top" .}}
|
{{template "page_top" .}}
|
||||||
@@ -187,6 +187,17 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="feat_label">
|
||||||
|
Storage space
|
||||||
|
</div>
|
||||||
|
<div class="feat_normal">
|
||||||
|
500 gigabytes
|
||||||
|
</div>
|
||||||
|
<div class="feat_pro">
|
||||||
|
<span class="text_highlight">1 terabyte</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="feat_label">
|
<div class="feat_label">
|
||||||
Online file previews
|
Online file previews
|
||||||
@@ -230,6 +241,7 @@
|
|||||||
<div class="feat_normal">
|
<div class="feat_normal">
|
||||||
<span class="text_highlight">20 GB</span> file size<br/>
|
<span class="text_highlight">20 GB</span> file size<br/>
|
||||||
<span class="text_highlight">2 TB</span> direct link bandwidth<br/>
|
<span class="text_highlight">2 TB</span> direct link bandwidth<br/>
|
||||||
|
<span class="text_highlight">2 TB</span> storage space<br/>
|
||||||
<span class="text_highlight">120 days</span> file expiry
|
<span class="text_highlight">120 days</span> file expiry
|
||||||
</div>
|
</div>
|
||||||
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_5_small.png');">
|
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_5_small.png');">
|
||||||
@@ -246,6 +258,7 @@
|
|||||||
<div class="feat_normal">
|
<div class="feat_normal">
|
||||||
<span class="text_highlight">20 GB</span> file size<br/>
|
<span class="text_highlight">20 GB</span> file size<br/>
|
||||||
<span class="text_highlight">4 TB</span> direct link bandwidth<br/>
|
<span class="text_highlight">4 TB</span> direct link bandwidth<br/>
|
||||||
|
<span class="text_highlight">4 TB</span> storage space<br/>
|
||||||
<span class="text_highlight">240 days</span> file expiry
|
<span class="text_highlight">240 days</span> file expiry
|
||||||
</div>
|
</div>
|
||||||
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_2_small.png');">
|
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_2_small.png');">
|
||||||
@@ -262,6 +275,7 @@
|
|||||||
<div class="feat_normal">
|
<div class="feat_normal">
|
||||||
<span class="text_highlight">20 GB</span> file size<br/>
|
<span class="text_highlight">20 GB</span> file size<br/>
|
||||||
<span class="text_highlight">8 TB</span> direct link bandwidth<br/>
|
<span class="text_highlight">8 TB</span> direct link bandwidth<br/>
|
||||||
|
<span class="text_highlight">8 TB</span> storage space<br/>
|
||||||
<span class="text_highlight">480 days</span> file expiry
|
<span class="text_highlight">480 days</span> file expiry
|
||||||
</div>
|
</div>
|
||||||
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_3_small.png');">
|
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_3_small.png');">
|
||||||
@@ -278,6 +292,7 @@
|
|||||||
<div class="feat_normal">
|
<div class="feat_normal">
|
||||||
<span class="text_highlight">20 GB</span> file size<br/>
|
<span class="text_highlight">20 GB</span> file size<br/>
|
||||||
<span class="text_highlight">16 TB</span> direct link bandwidth<br/>
|
<span class="text_highlight">16 TB</span> direct link bandwidth<br/>
|
||||||
|
<span class="text_highlight">16 TB</span> storage space<br/>
|
||||||
<span class="text_highlight">Files never expre</span>
|
<span class="text_highlight">Files never expre</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_4_small.png');">
|
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_4_small.png');">
|
||||||
@@ -294,6 +309,7 @@
|
|||||||
<div class="feat_normal">
|
<div class="feat_normal">
|
||||||
<span class="text_highlight">20 GB</span> file size<br/>
|
<span class="text_highlight">20 GB</span> file size<br/>
|
||||||
<span class="text_highlight">32 TB</span> direct link bandwidth<br/>
|
<span class="text_highlight">32 TB</span> direct link bandwidth<br/>
|
||||||
|
<span class="text_highlight">32 TB</span> storage space<br/>
|
||||||
<span class="text_highlight">Files never expre</span>
|
<span class="text_highlight">Files never expre</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_6_small.png');">
|
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_6_small.png');">
|
||||||
|
@@ -81,7 +81,7 @@ const get_reports = async () => {
|
|||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
let start = new Date()
|
let start = new Date()
|
||||||
start.setDate(start.getDate() - 14)
|
start.setDate(start.getDate() - 28)
|
||||||
let end = new Date()
|
let end = new Date()
|
||||||
|
|
||||||
startPicker.valueAsNumber = start.getTime()
|
startPicker.valueAsNumber = start.getTime()
|
||||||
|
@@ -118,7 +118,10 @@ export const start = () => {
|
|||||||
resp = JSON.parse(xhr.response)
|
resp = JSON.parse(xhr.response)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (resp.value == "file_too_large" || resp.value == "ip_banned" || tries === 3) {
|
if (resp.value == "file_too_large"
|
||||||
|
|| resp.value == "ip_banned"
|
||||||
|
|| resp.value == "user_out_of_space"
|
||||||
|
|| tries === 3) {
|
||||||
// Permanent failure
|
// Permanent failure
|
||||||
on_failure(resp.value, resp.message)
|
on_failure(resp.value, resp.message)
|
||||||
} else {
|
} else {
|
||||||
|
@@ -135,6 +135,7 @@ func (tm *TemplateManager) ParseTemplates(silent bool) {
|
|||||||
"pageNr": tm.pageNr,
|
"pageNr": tm.pageNr,
|
||||||
"add": tm.add,
|
"add": tm.add,
|
||||||
"sub": tm.sub,
|
"sub": tm.sub,
|
||||||
|
"mul": tm.mul,
|
||||||
"div": tm.div,
|
"div": tm.div,
|
||||||
"formatData": tm.formatData,
|
"formatData": tm.formatData,
|
||||||
"formatSC": tm.formatSC,
|
"formatSC": tm.formatSC,
|
||||||
@@ -245,9 +246,10 @@ func (tm *TemplateManager) pageNr(s string) (nr int) {
|
|||||||
}
|
}
|
||||||
return nr
|
return nr
|
||||||
}
|
}
|
||||||
func (tm *TemplateManager) add(a, b interface{}) int { return detectInt(a) + detectInt(b) }
|
func (tm *TemplateManager) add(a, b interface{}) float64 { return toFloat(a) + toFloat(b) }
|
||||||
func (tm *TemplateManager) sub(a, b interface{}) int { return detectInt(a) - detectInt(b) }
|
func (tm *TemplateManager) sub(a, b interface{}) float64 { return toFloat(a) - toFloat(b) }
|
||||||
func (tm *TemplateManager) div(a, b float64) float64 { return a / b }
|
func (tm *TemplateManager) mul(a, b interface{}) float64 { return toFloat(a) * toFloat(b) }
|
||||||
|
func (tm *TemplateManager) div(a, b interface{}) float64 { return toFloat(a) / toFloat(b) }
|
||||||
|
|
||||||
func (tm *TemplateManager) formatData(i interface{}) string {
|
func (tm *TemplateManager) formatData(i interface{}) string {
|
||||||
return util.FormatData(int64(detectInt(i)))
|
return util.FormatData(int64(detectInt(i)))
|
||||||
@@ -311,3 +313,33 @@ func detectInt(i interface{}) int {
|
|||||||
}
|
}
|
||||||
panic(fmt.Sprintf("%v is not an int", i))
|
panic(fmt.Sprintf("%v is not an int", i))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func toFloat(i interface{}) float64 {
|
||||||
|
switch v := i.(type) {
|
||||||
|
case int:
|
||||||
|
return float64(v)
|
||||||
|
case int8:
|
||||||
|
return float64(v)
|
||||||
|
case int16:
|
||||||
|
return float64(v)
|
||||||
|
case int32:
|
||||||
|
return float64(v)
|
||||||
|
case int64:
|
||||||
|
return float64(v)
|
||||||
|
case uint:
|
||||||
|
return float64(v)
|
||||||
|
case uint8:
|
||||||
|
return float64(v)
|
||||||
|
case uint16:
|
||||||
|
return float64(v)
|
||||||
|
case uint32:
|
||||||
|
return float64(v)
|
||||||
|
case uint64:
|
||||||
|
return float64(v)
|
||||||
|
case float32:
|
||||||
|
return float64(v)
|
||||||
|
case float64:
|
||||||
|
return float64(v)
|
||||||
|
}
|
||||||
|
panic(fmt.Sprintf("%v is not a number", i))
|
||||||
|
}
|
||||||
|
Reference in New Issue
Block a user