pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

support radio buttons

Browse Source
This commit is contained in:
Wim Brand
2020-08-18 13:04:26 +02:00
parent 339be5e755
commit c4fe2bf6d2
6 changed files with 150 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
res/include/script/admin.js
View File

@@ -1,10 +1,10 @@
let graphViews = drawGraph(document.getElementById("views_chart"), "Views", "number");
let graphBandwidth = drawGraph(document.getElementById("bandwidth_chart"), "Bandwidth", "bytes");
let graphTimeout = null;
function loadGraph(minutes, interval, live){
if (graphTimeout !== null) { clearTimeout(graphTimeout) }
if (live) {
graphTimeout = setTimeout(() => {updateGraphs(minutes, interval, true)}, 10000)
graphTimeout = setTimeout(() => {loadGraph(minutes, interval, true)}, 10000)
}
let today = new Date()
@@ -48,14 +48,129 @@ function loadGraph(minutes, interval, live){
})
}
let graphTimeout = null;
function updateGraphs(minutes, interval, live) {
loadGraph(10080, 60, false);
loadGraph(graphViews, "views", minutes, interval);
loadGraph(graphBandwidth, "bandwidth", minutes, interval);
function loadGraphDate(start, end, interval){
fetch(
apiEndpoint+"/admin/files/timeseries" +
"?start="+start.toISOString() +
"&end="+end.toISOString() +
"&interval="+interval
).then(resp => {
if (!resp.ok) { return Promise.reject("Error: "+resp.status);}
return resp.json();
}).then(resp => {
resp.views.timestamps.forEach((val, idx) => {
let date = new Date(val);
let dateStr = date.getUTCFullYear() +
"-"+("00"+(date.getUTCMonth()+1)).slice(-2) +
"-"+("00"+date.getUTCDate()).slice(-2) +
" "+("00"+date.getUTCHours()).slice(-2) +
":"+("00"+date.getUTCMinutes()).slice(-2);
resp.views.timestamps[idx] = " "+dateStr+" "; // Poor man's padding
});
graphViews.data.labels = resp.views.timestamps;
graphViews.data.datasets[0].data = resp.views.amounts;
graphBandwidth.data.labels = resp.views.timestamps;
graphBandwidth.data.datasets[0].data = resp.bandwidth.amounts;
graphViews.update()
graphBandwidth.update();
document.getElementById("time_start").innerText = resp.views.timestamps[0];
document.getElementById("time_end").innerText = resp.views.timestamps.slice(-1)[0];
let total = 0
resp.bandwidth.amounts.forEach(e => { total += e; });
document.getElementById("total_bandwidth").innerText = formatDataVolume(total, 3);
total = 0
resp.views.amounts.forEach(e => { total += e; });
document.getElementById("total_views").innerText = formatThousands(total);
}).catch(e => {
alert("Error requesting time series: "+e);
})
}
loadGraph(1440, 10, true);
let tsSpan;
let tsStart;
function loadTimespan(span, base) {
base.setUTCHours(0, 0, 0, 0);
if (span === "day") {
let start = new Date(base);
let end = new Date(base);
end.setUTCHours(23, 59, 59, 999);
tsStart = start;
loadGraphDate(start, end, 1);
} else if (span === "week") {
let monday = new Date(Date.UTC(
base.getUTCFullYear(), base.getUTCMonth(), base.getUTCDate() - base.getUTCDay() + 1
));
let sunday = new Date(Date.UTC(
base.getUTCFullYear(), base.getUTCMonth(), base.getUTCDate() - base.getUTCDay() + 7,
23, 59, 59
));
tsStart = monday;
loadGraphDate(monday, sunday, 60);
} else if (span === "month") {
let start = new Date(Date.UTC(base.getUTCFullYear(), base.getUTCMonth(), 1));
let end = new Date(Date.UTC(base.getUTCFullYear(), base.getUTCMonth()+1, 0, 23, 59, 59));
tsStart = start;
loadGraphDate(start, end, 60);
} else if (span === "quarter") {
let start = new Date(Date.UTC(base.getUTCFullYear(), 3.0 * Math.floor(base.getUTCMonth()/3.0), 1));
let end = new Date(Date.UTC(base.getUTCFullYear(), 3.0 * Math.ceil(base.getUTCMonth()/3.0), 0, 23, 59, 59));
tsStart = start;
loadGraphDate(start, end, 1440);
} else if (span === "year") {
let start = new Date(Date.UTC(base.getUTCFullYear(), 0, 1));
let end = new Date(Date.UTC(base.getUTCFullYear()+1, 0, 0, 23, 59, 59));
tsStart = start;
loadGraphDate(start, end, 1440);
} else {
console.error("Invalid timespan", ts);
}
tsSpan = span;
}
function navigateTimespan(forward) {
let offYear = 0, offMonth = 0, offDay = 0;
switch (tsSpan) {
case "day":
offDay = 1;
break;
case "week":
offDay = 7;
break;
case "month":
offMonth = 1;
break;
case "quarter":
offMonth = 3;
break;
case "year":
offYear = 1;
break;
}
if (!forward) {
offDay = -offDay;
offMonth = -offMonth;
offYear = -offYear;
}
loadTimespan(
tsSpan,
new Date(Date.UTC(
tsStart.getUTCFullYear()+offYear,
tsStart.getUTCMonth()+offMonth,
tsStart.getUTCDay()+offDay,
))
)
}
// Load performance statistics

2
res/template/account/user_home.html
View File

@@ -48,7 +48,7 @@
</p>
</div>
<div class="highlight_dark">
<button onclick="updateGraphs(360, 1, true);">Live</button>
<button onclick="updateGraphs(720, 1, true);">Live</button>
<button onclick="updateGraphs(1440, 10, true);">Day</button>
<button onclick="updateGraphs(10080, 60, false);">Week</button>
<button onclick="updateGraphs(20160, 60, false);">Two Weeks</button>

10
res/template/admin.html
View File

@@ -15,7 +15,7 @@
<h3>Bandwidth and views</h3>
</div>
<div class="highlight_dark">
<button onclick="loadGraph(360, 1, true);">Live</button>
<button onclick="loadGraph(720, 1, true);">Live</button>
<button onclick="loadGraph(1440, 10, true);">Day</button>
<button onclick="loadGraph(10080, 60, false);">Week</button>
<button onclick="loadGraph(20160, 60, false);">Two Weeks</button>
@@ -23,6 +23,14 @@
<button onclick="loadGraph(131400, 1440, false);">Quarter</button>
<button onclick="loadGraph(262800, 1440, false);">Half-year</button>
<button onclick="loadGraph(525600, 1440, false);">Year</button>
<!--<br/>
<button onclick="navigateTimespan(false);">🠈</button>
<button onclick="loadTimespan('day', new Date());">Day</button>
<button onclick="loadTimespan('week', new Date());">Week</button>
<button onclick="loadTimespan('month', new Date());">Month</button>
<button onclick="loadTimespan('quarter', new Date());">Quarter</button>
<button onclick="loadTimespan('year', new Date());">Year</button>
<button onclick="navigateTimespan(true);">🠊</button>-->
</div>
<div id="chart_container" class="chart-container" style="position: relative; width: 100%; height: 200px; padding-top: 6px;">
<canvas id="bandwidth_chart"></canvas>

10
res/template/fragments/form.html
View File

@@ -49,6 +49,16 @@
{{else if eq $field.Type "captcha"}}
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<div class="g-recaptcha" data-theme="dark" data-sitekey="{{$field.CaptchaSiteKey}}"></div>
{{else if eq $field.Type "radio"}}
{{ range $val := $field.RadioValues}}
<input
id="input_{{$field.Name}}_choice_{{$val}}"
name="{{$field.Name}}"
value="{{$val}}"
type="radio"
{{if eq $val $field.DefaultValue}}checked="checked"{{end}}/>
<label for="input_{{$field.Name}}_choice_{{$val}}">{{$val}}</label><br/>
{{ end }}
{{end}}
</td>
{{end}}

6
webcontroller/admin_panel.go
View File

@@ -109,12 +109,12 @@ func (wc *WebController) adminAbuseForm(td *TemplateData, r *http.Request) (f Fo
Name: "type",
Label: "Type",
DefaultValue: "unknown",
Description: "Can be 'unknown', 'copyright', 'terrorism' or 'child_abuse'",
Type: FieldTypeText,
Type: FieldTypeRadio,
RadioValues: []string{"unknown", "copyright", "terrorism", "child_abuse"},
}, {
Name: "reporter",
Label: "Reporter",
DefaultValue: "pixeldrain",
DefaultValue: "Anonymous tip",
Type: FieldTypeText,
},
},

6
webcontroller/forms.go
View File

@@ -60,6 +60,9 @@ type Field struct {
// Only used when Type == FieldTypeCaptcha
CaptchaSiteKey string
// Only used when Type == FieldTypeRadio
RadioValues []string
}
// ExtraActions contains extra actions to performs when rendering the form
@@ -84,6 +87,7 @@ const (
FieldTypeNumber FieldType = "number"
FieldTypeUsername FieldType = "username"
FieldTypeEmail FieldType = "email"
FieldTypeRadio FieldType = "radio"
FieldTypeCurrentPassword FieldType = "current-password"
FieldTypeNewPassword FieldType = "new-password"
FieldTypeCaptcha FieldType = "captcha"
@@ -103,7 +107,7 @@ func (f *Form) ReadInput(r *http.Request) (success bool) {
// Remove carriage returns
field.EnteredValue = strings.ReplaceAll(r.FormValue(field.Name), "\r", "")
if field.DefaultValue == "" {
if field.EnteredValue != "" {
field.DefaultValue = field.EnteredValue
}