template cleanup
This commit is contained in:
+10
-4
@@ -244,7 +244,7 @@ func ExtractVMPath(c *gin.Context) (VMPath, error) {
|
|||||||
return vm_path, nil
|
return vm_path, nil
|
||||||
}
|
}
|
||||||
|
|
||||||
func FormatNumber(val int64, base int64) (float64, string) {
|
func FormatNumber(val int64, base int64) (string, string) {
|
||||||
valf := float64(val)
|
valf := float64(val)
|
||||||
basef := float64(base)
|
basef := float64(base)
|
||||||
steps := 0
|
steps := 0
|
||||||
@@ -255,13 +255,19 @@ func FormatNumber(val int64, base int64) (float64, string) {
|
|||||||
|
|
||||||
switch base {
|
switch base {
|
||||||
case 1000:
|
case 1000:
|
||||||
|
s := fmt.Sprintf("%.4f", valf)
|
||||||
|
s = strings.TrimRight(s, "0")
|
||||||
|
s = strings.TrimRight(s, ".")
|
||||||
prefixes := []string{"", "K", "M", "G", "T"}
|
prefixes := []string{"", "K", "M", "G", "T"}
|
||||||
return valf, prefixes[steps]
|
return s, prefixes[steps]
|
||||||
case 1024:
|
case 1024:
|
||||||
|
s := fmt.Sprintf("%.4f", valf)
|
||||||
|
s = strings.TrimRight(s, "0")
|
||||||
|
s = strings.TrimRight(s, ".")
|
||||||
prefixes := []string{"", "Ki", "Mi", "Gi", "Ti"}
|
prefixes := []string{"", "Ki", "Mi", "Gi", "Ti"}
|
||||||
return valf, prefixes[steps]
|
return s, prefixes[steps]
|
||||||
default:
|
default:
|
||||||
return 0, ""
|
return "0", ""
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -77,7 +77,7 @@ type ResourceChart struct {
|
|||||||
Name string
|
Name string
|
||||||
Used int64
|
Used int64
|
||||||
Max int64
|
Max int64
|
||||||
Avail float64
|
Avail string
|
||||||
Prefix string
|
Prefix string
|
||||||
Unit string
|
Unit string
|
||||||
ColorHex string
|
ColorHex string
|
||||||
@@ -149,13 +149,14 @@ func HandleGETAccount(c *gin.Context) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
for _, r := range t.Total {
|
for _, r := range t.Total {
|
||||||
|
avail := fmt.Sprintf("%d", r.Avail)
|
||||||
l.Resources = append(l.Resources, ResourceChart{
|
l.Resources = append(l.Resources, ResourceChart{
|
||||||
Type: t.Type,
|
Type: t.Type,
|
||||||
Display: t.Display,
|
Display: t.Display,
|
||||||
Name: r.Name,
|
Name: r.Name,
|
||||||
Used: r.Used,
|
Used: r.Used,
|
||||||
Max: r.Max,
|
Max: r.Max,
|
||||||
Avail: float64(r.Avail), // usually an int
|
Avail: avail, // usually an int
|
||||||
Unit: "",
|
Unit: "",
|
||||||
ColorHex: InterpolateColorHSV(Green, Red, float64(r.Used)/float64(r.Max)).ToHTML(),
|
ColorHex: InterpolateColorHSV(Green, Red, float64(r.Used)/float64(r.Max)).ToHTML(),
|
||||||
})
|
})
|
||||||
|
|||||||
+2
-2
@@ -80,7 +80,7 @@ label[for="navtoggle"], #navtoggle {
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (width >= 600px){
|
@media screen and (width >= 601px){
|
||||||
header {
|
header {
|
||||||
grid-template-columns: auto 1fr;
|
grid-template-columns: auto 1fr;
|
||||||
}
|
}
|
||||||
@@ -106,7 +106,7 @@ label[for="navtoggle"], #navtoggle {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (width <= 600px){
|
@media screen and (width <= 601px){
|
||||||
header {
|
header {
|
||||||
grid-template-columns: 1fr auto;
|
grid-template-columns: 1fr auto;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -34,9 +34,7 @@
|
|||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main>
|
<main>
|
||||||
<h2>Account</h2>
|
<h2>Account</h2>
|
||||||
<section class="w3-card w3-padding">
|
<section class="w3-card w3-padding">
|
||||||
|
|||||||
@@ -9,9 +9,7 @@
|
|||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main>
|
<main>
|
||||||
<h2><a href="index">Instances</a> / {{.config.Name}} / Backups</h2>
|
<h2><a href="index">Instances</a> / {{.config.Name}} / Backups</h2>
|
||||||
<section class="w3-card w3-padding">
|
<section class="w3-card w3-padding">
|
||||||
|
|||||||
@@ -19,9 +19,7 @@
|
|||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main>
|
<main>
|
||||||
<section>
|
<section>
|
||||||
<h2><a href="index">Instances</a> / {{.config.Name}} / Config</h2>
|
<h2><a href="index">Instances</a> / {{.config.Name}} / Config</h2>
|
||||||
|
|||||||
+1
-3
@@ -65,9 +65,7 @@
|
|||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main>
|
<main>
|
||||||
<section>
|
<section>
|
||||||
<h2>Instances</h2>
|
<h2>Instances</h2>
|
||||||
|
|||||||
+1
-3
@@ -7,9 +7,7 @@
|
|||||||
<link rel="modulepreload" href="scripts/dialog.js">
|
<link rel="modulepreload" href="scripts/dialog.js">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main class="flex" style="justify-content: center; align-items: center;">
|
<main class="flex" style="justify-content: center; align-items: center;">
|
||||||
<div class="w3-container w3-card w3-margin w3-padding" style="height: fit-content;">
|
<div class="w3-container w3-card w3-margin w3-padding" style="height: fit-content;">
|
||||||
<h2 class="w3-center">{{.global.Organization}} Login</h2>
|
<h2 class="w3-center">{{.global.Organization}} Login</h2>
|
||||||
|
|||||||
@@ -26,9 +26,7 @@
|
|||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
{{template "header" .}}
|
||||||
{{template "header" .}}
|
|
||||||
</header>
|
|
||||||
<main>
|
<main>
|
||||||
<h2>Settings</h2>
|
<h2>Settings</h2>
|
||||||
<form id="settings">
|
<form id="settings">
|
||||||
@@ -42,6 +40,8 @@
|
|||||||
<p>App will periodically check for updates and synchronize only if needed. Medium resource usage.</p>
|
<p>App will periodically check for updates and synchronize only if needed. Medium resource usage.</p>
|
||||||
<label><input class="w3-radio" type="radio" id="sync-interrupt" name="sync-scheme" value="interrupt" required>Sync When Needed</label>
|
<label><input class="w3-radio" type="radio" id="sync-interrupt" name="sync-scheme" value="interrupt" required>Sync When Needed</label>
|
||||||
<p>App will react to changes and synchronize when changes are made. Low resource usage.</p>
|
<p>App will react to changes and synchronize when changes are made. Low resource usage.</p>
|
||||||
|
<label><input class="w3-radio" type="radio" id="sync-never" name="sync-scheme" value="never" required>Never Sync</label>
|
||||||
|
<p>App will never automatically sync. Reload the page to sync the latest cluster state.</p>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset>
|
<fieldset>
|
||||||
<legend>App Sync Frequency</legend>
|
<legend>App Sync Frequency</legend>
|
||||||
|
|||||||
@@ -2,8 +2,10 @@ import { getSyncSettings, requestAPI } from "./utils.js";
|
|||||||
|
|
||||||
export async function setupClientSync (callback) {
|
export async function setupClientSync (callback) {
|
||||||
const { scheme, rate } = getSyncSettings();
|
const { scheme, rate } = getSyncSettings();
|
||||||
|
if (scheme === "never") {
|
||||||
if (scheme === "always") {
|
return
|
||||||
|
}
|
||||||
|
else if (scheme === "always") {
|
||||||
window.setInterval(callback, rate * 1000);
|
window.setInterval(callback, rate * 1000);
|
||||||
}
|
}
|
||||||
else if (scheme === "hash") {
|
else if (scheme === "hash") {
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ window.addEventListener("DOMContentLoaded", init);
|
|||||||
|
|
||||||
function init () {
|
function init () {
|
||||||
setAppearance();
|
setAppearance();
|
||||||
|
|
||||||
const { scheme, rate } = getSyncSettings();
|
const { scheme, rate } = getSyncSettings();
|
||||||
if (scheme) {
|
if (scheme) {
|
||||||
document.querySelector(`#sync-${scheme}`).checked = true;
|
document.querySelector(`#sync-${scheme}`).checked = true;
|
||||||
|
|||||||
+17
-13
@@ -1,3 +1,4 @@
|
|||||||
|
{{/* <head> common across all pages*/}}
|
||||||
{{define "head"}}
|
{{define "head"}}
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
@@ -14,18 +15,21 @@
|
|||||||
<link rel="stylesheet" href="css/form.css">
|
<link rel="stylesheet" href="css/form.css">
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
||||||
|
{{/* <header> common across all pages*/}}
|
||||||
{{define "header"}}
|
{{define "header"}}
|
||||||
<h1>{{.global.Organization}}</h1>
|
<header>
|
||||||
<label for="navtoggle">☰</label>
|
<h1>{{.global.Organization}}</h1>
|
||||||
<input type="checkbox" id="navtoggle">
|
<label for="navtoggle">☰</label>
|
||||||
<nav id="navigation">
|
<input type="checkbox" id="navtoggle">
|
||||||
{{if eq .page "login"}}
|
<nav id="navigation">
|
||||||
<a href="login" aria-current="page">Login</a>
|
{{if eq .page "login"}}
|
||||||
{{else}}
|
<a href="login" aria-current="page">Login</a>
|
||||||
<a href="index" {{if eq .page "index"}} aria-current="page" {{end}}>Instances</a>
|
{{else}}
|
||||||
<a href="account" {{if eq .page "account"}} aria-current="page" {{end}}>Account</a>
|
<a href="index" {{if eq .page "index"}} aria-current="page" {{end}}>Instances</a>
|
||||||
<a href="settings" {{if eq .page "settings"}} aria-current="page" {{end}}>Settings</a>
|
<a href="account" {{if eq .page "account"}} aria-current="page" {{end}}>Account</a>
|
||||||
<a href="login">Logout</a>
|
<a href="settings" {{if eq .page "settings"}} aria-current="page" {{end}}>Settings</a>
|
||||||
{{end}}
|
<a href="login">Logout</a>
|
||||||
</nav>
|
{{end}}
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
{{end}}
|
{{end}}
|
||||||
@@ -43,7 +43,7 @@
|
|||||||
.hide-large {display: none !important;}
|
.hide-large {display: none !important;}
|
||||||
.hide-medium {display:none !important}
|
.hide-medium {display:none !important}
|
||||||
}
|
}
|
||||||
@media screen and (width <=601px) {
|
@media screen and (width <=601px) and (width >=440px){
|
||||||
.hide-large {display: none !important;}
|
.hide-large {display: none !important;}
|
||||||
.hide-medium {display:none !important}
|
.hide-medium {display:none !important}
|
||||||
.hide-small {display:none !important}
|
.hide-small {display:none !important}
|
||||||
|
|||||||
@@ -37,7 +37,7 @@
|
|||||||
<progress value="{{.Used}}" max="{{.Max}}" id="resource"></progress>
|
<progress value="{{.Used}}" max="{{.Max}}" id="resource"></progress>
|
||||||
<label id="caption" for="resource">
|
<label id="caption" for="resource">
|
||||||
<span>{{.Name}}</span>
|
<span>{{.Name}}</span>
|
||||||
<span>{{printf "%g" .Avail}} {{.Prefix}}{{.Unit}} Avaliable</span>
|
<span>{{.Avail}} {{.Prefix}}{{.Unit}} Avaliable</span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,11 +1,27 @@
|
|||||||
|
{{/*
|
||||||
|
Select: generic data driven <select> element template
|
||||||
|
.ID = (string) select element id & name attribute
|
||||||
|
.Required = (bool) select element required attribute
|
||||||
|
.Options = ([]Options) array of Options
|
||||||
|
*/}}
|
||||||
{{define "select"}}
|
{{define "select"}}
|
||||||
<select class="w3-select w3-border" id="{{.ID}}" name="{{.ID}}" {{if .Required}}required{{end}}>
|
<select class="w3-select w3-border" id="{{.ID}}" name="{{.ID}}" {{if .Required}}required{{end}}>
|
||||||
{{range .Options}}
|
{{range .Options}}
|
||||||
|
{{template "option" .}}
|
||||||
|
{{end}}
|
||||||
|
</select>
|
||||||
|
{{end}}
|
||||||
|
|
||||||
|
{{/*
|
||||||
|
Options: generic data driven <option> element template
|
||||||
|
.Selected = (bool) option element selected attribute
|
||||||
|
.Value = (string) option element value attribute
|
||||||
|
.Display = (string) option element innerText
|
||||||
|
*/}}
|
||||||
|
{{define "option"}}
|
||||||
{{if .Selected}}
|
{{if .Selected}}
|
||||||
<option value="{{.Value}}" selected>{{.Display}}</option>
|
<option value="{{.Value}}" selected>{{.Display}}</option>
|
||||||
{{else}}
|
{{else}}
|
||||||
<option value="{{.Value}}">{{.Display}}</option>
|
<option value="{{.Value}}">{{.Display}}</option>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{end}}
|
{{end}}
|
||||||
</select>
|
|
||||||
{{end}}
|
|
||||||
Reference in New Issue
Block a user