diff options
Diffstat (limited to '')
-rw-r--r-- | module/output/html.scm | 26 | ||||
-rw-r--r-- | static/script.js | 12 | ||||
-rw-r--r-- | static/style.css | 70 |
3 files changed, 102 insertions, 6 deletions
diff --git a/module/output/html.scm b/module/output/html.scm index 26cf4b86..36424edc 100644 --- a/module/output/html.scm +++ b/module/output/html.scm @@ -88,6 +88,18 @@ +(define (event-debug-html event) + `(table + (tbody + ,@(hash-map->list + (match-lambda* + [(key vline) + `(tr (th ,key) (td ,(format #f "~a" (value vline))))] + [_ (error "What are you doing‽")]) + (attributes event))))) + + + ;;; Procedures for wide output @@ -149,7 +161,11 @@ ,(when (date<? date (as-date (attr ev 'DTEND))) " continuing")) (style ,style)) - ,((summary-filter) ev (attr ev 'SUMMARY)))) + (div (@ (class "event-inner")) + (div (@ (class "popup")) + ,(event-debug-html ev)) + (div (@ (class "body")) + ,((summary-filter) ev (attr ev 'SUMMARY)))))) ) @@ -183,9 +199,11 @@ ,(when (and (attr ev 'PARTSTAT) (string= "TENTATIVE" (attr ev 'PARTSTAT))) " tentative")) (style ,style)) - ,((summary-filter) ev (attr ev 'SUMMARY)))) - - ) + (div (@ (class "event-inner")) + (div (@ (class "popup")) + ,(event-debug-html ev)) + (div (@ (class "body")) + ,((summary-filter) ev (attr ev 'SUMMARY))))))) ;; Lay out complete day (graphical) diff --git a/static/script.js b/static/script.js index bc20cb07..dcc7285f 100644 --- a/static/script.js +++ b/static/script.js @@ -95,8 +95,15 @@ function update_current_time_bar () { event_area.append(bar_object) } +function toggle_event_pupup () { + console.log(this); + this.getElementsByClassName("popup")[0].classList.toggle("show"); +} + window.onload = function () { + console.log("Running"); + /* update_current_time_bar() // once a minute for now, could probably be slowed to every 10 minutes window.setInterval(update_current_time_bar, 1000 * 60) @@ -106,4 +113,9 @@ window.onload = function () { c.onmouseup = onmouseuphandler; c.onmousemove = onmousemovehandler; } + */ + + for (let e of document.getElementsByClassName("event-inner")) { + e.onclick = toggle_event_pupup; + } } diff --git a/static/style.css b/static/style.css index 2545b9e9..77c9e2f8 100644 --- a/static/style.css +++ b/static/style.css @@ -293,9 +293,10 @@ html, body { border: 2px solid black; font-size: 8pt; - overflow: hidden; + /* overflow: hidden; */ - z-index: 0; + /* Setting this makes popups render under */ + /* z-index: 0; */ } .root footer { @@ -392,3 +393,68 @@ html, body { border-color: blue; left: -1em; } + +.event-inner { + position: relative; + width: 100%; + height: 100%; +} + +.event-inner .popup { + visibility: hidden; + position: absolute; + left: 10%; + bottom: 125%; + z-index: 100; + + background-color: #dedede; + color: black; + border: 2px solid black; + + font-size: 8pt; + font-family: monospace; + + white-space: pre; + overflow-y: scroll; + max-width: 100ch; + max-height: 60ch; +} + +.event-inner .popup td { + white-space: pre-line; +} + +/* Arrow pointing at origin of popup + Currently broken due to an overflow: scroll +*/ +/* .event-inner .popup:after { */ + +/* content: ""; */ +/* position: absolute; */ +/* top: 100%; */ +/* /\* left: 5%; *\/ */ +/* border-style: solid; */ +/* border-width: 1.5em; */ +/* /\* margin-left: -2em; *\/ */ +/* border-color: transparent; */ +/* border-top-color: #555; */ +/* } */ + +.popup th { + text-align: right; + vertical-align: top; +} + +.popup th::after { + content: ": "; +} + +.popup.show { + visibility: visible; +} + +.event-inner .body { + overflow: hidden; + width: 100%; + height: 100%; +} |