diff --git a/internal/gui/dashboard.go b/internal/gui/dashboard.go index c7fc5a5..c621b67 100644 --- a/internal/gui/dashboard.go +++ b/internal/gui/dashboard.go @@ -57,9 +57,9 @@ func (d *dashboard) value(name string, value int) g.Node { ) } -func (d *dashboard) content() g.Node { +func (d *dashboard) metrics() g.Node { return Div( - Class("dashboard"), + Class("metrics"), Div( Class("panel"), Div( @@ -89,6 +89,14 @@ func (d *dashboard) content() g.Node { ) } +func (d *dashboard) content() g.Node { + return Div( + ID("dashboard"), + Class("dashboard"), + d.metrics(), + ) +} + func (d *dashboard) build() g.Node { var err error @@ -100,6 +108,17 @@ func (d *dashboard) build() g.Node { return buildPage(d.app, "dashboard", d.content()) } +func (d *dashboard) update() g.Node { + var err error + + d.stats, err = d.storage.Stats() + if err != nil { + return g.Text("ERROR") //AFINIR + } + + return d.metrics() +} + /* ######################################################################################################## @(°_°)@ ####### */ diff --git a/internal/gui/devel.go b/internal/gui/devel.go index f566e31..727fcef 100644 --- a/internal/gui/devel.go +++ b/internal/gui/devel.go @@ -14,7 +14,7 @@ import ( ) func getStaticFS() (http.FileSystem, error) { - return http.FS(os.DirFS("static")), nil + return http.FS(os.DirFS("internal/gui/static")), nil } /* diff --git a/internal/gui/gui.go b/internal/gui/gui.go index e18bf7e..7479f8f 100644 --- a/internal/gui/gui.go +++ b/internal/gui/gui.go @@ -34,6 +34,12 @@ func Build(ccs *components.Components) error { Render(w) })) + router.Get("/dashboard/update", http.HandlerFunc(func(w http.ResponseWriter, _ *http.Request) { + _ = newDashboard(ccs). + update(). + Render(w) + })) + return nil } diff --git a/internal/gui/layout.go b/internal/gui/layout.go index b4fbb67..de20368 100644 --- a/internal/gui/layout.go +++ b/internal/gui/layout.go @@ -45,9 +45,14 @@ func buildPage(app components.Application, name string, content g.Node) g.Node { Meta(Charset("utf-8")), Meta(Name("viewport"), Content("width=device-width, initial-scale=1")), TitleEl(g.Textf("%s - %s", app.Name(), name)), + Link(Rel("icon"), Href("/static/favicon.ico")), Link(Rel("stylesheet"), Href(fmt.Sprintf("/static/css/%s.css", name)), Type("text/css")), ), Body( + P( + ID("error"), + Class("error"), + ), Header( container( Div( @@ -67,6 +72,8 @@ func buildPage(app components.Application, name string, content g.Node) g.Node { ), ), ), + Script(Src("/static/js/common.js")), + Script(Src(fmt.Sprintf("/static/js/%s.js", name))), ), ), ) diff --git a/internal/gui/static/css/common.css b/internal/gui/static/css/common.css index 8b6a53b..6262651 100644 --- a/internal/gui/static/css/common.css +++ b/internal/gui/static/css/common.css @@ -14,6 +14,12 @@ html, body { background-color: var(--bg-color); } +.error { + padding: 10px 20px; + background-color: var(--red); + display: none; +} + header { margin-top: 10px; } @@ -53,9 +59,6 @@ footer { color: var(--gray-600); } -footer > p { -} - /* ######################################################################################################## @(°_°)@ ####### */ diff --git a/internal/gui/static/css/dashboard.css b/internal/gui/static/css/dashboard.css index 3872e3b..35180b7 100644 --- a/internal/gui/static/css/dashboard.css +++ b/internal/gui/static/css/dashboard.css @@ -10,7 +10,7 @@ @import url("colors.css"); @import url("common.css"); -.dashboard { +.metrics { display: flex; flex-wrap: wrap; justify-content: center; diff --git a/internal/gui/static/css/normalize.css b/internal/gui/static/css/normalize.css index 1ce0fd3..15a633b 100644 --- a/internal/gui/static/css/normalize.css +++ b/internal/gui/static/css/normalize.css @@ -6,5 +6,4 @@ */ /*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */ *,::after,::before{box-sizing:border-box}html{-moz-tab-size:4;tab-size:4}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji'}hr{height:0;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item} -/*# sourceMappingURL=/sm/b8ae781793ee4eb86edef3f2a2ac43a5575d063ed8cd287d7553f9f1b2776616.map */ diff --git a/internal/gui/static/favicon.ico b/internal/gui/static/favicon.ico new file mode 100644 index 0000000..6d01667 Binary files /dev/null and b/internal/gui/static/favicon.ico differ diff --git a/internal/gui/static/js/common.js b/internal/gui/static/js/common.js new file mode 100644 index 0000000..3ffad28 --- /dev/null +++ b/internal/gui/static/js/common.js @@ -0,0 +1,21 @@ +/* +------------------------------------------------------------------------------------------------------------------------ +####### common ####### Copyright (c) 2021 mls-361 ################################################## MIT License ####### +------------------------------------------------------------------------------------------------------------------------ +*/ + +const $ = (function() { + const error = document.getElementById("error"); + + return { + showError: function(message) { + error.textContent = message; + error.style.display = "block"; + } + } +})(); + +/* +######################################################################################################## @(°_°)@ ####### +*/ + diff --git a/internal/gui/static/js/dashboard.js b/internal/gui/static/js/dashboard.js new file mode 100644 index 0000000..50de1ee --- /dev/null +++ b/internal/gui/static/js/dashboard.js @@ -0,0 +1,34 @@ +/* +------------------------------------------------------------------------------------------------------------------------ +####### dashboard ####### Copyright (c) 2021 mls-361 ############################################### MIT License ####### +------------------------------------------------------------------------------------------------------------------------ +*/ + +(function() { + const dashboard = document.getElementById("dashboard"); + + window.addEventListener("load", function(event) { + window.setInterval( + function() { + fetch("/dashboard/update").then(function(response) { + if (response.ok) { + response.text().then(function(html) { + dashboard.innerHTML = html; + }); + } else { + $.showError("Fetch error: invalid network response"); ////////////////////////////////////////// + } + }) + .catch(function(error) { + $.showError("Fetch error: " + error.message); ////////////////////////////////////////////////////// + }); + }, + 3000 + ); + }); +})(); + +/* +######################################################################################################## @(°_°)@ ####### +*/ +