From 6774c0ecd4cbe94325b9dc00b093faf960b82f04 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= Date: Tue, 8 Sep 2020 00:44:04 +0200 Subject: HTML add description on existing events. --- module/calp/html/vcomponent.scm | 29 +++++++++++++------------- static/lib.js | 2 ++ static/script.js | 46 ++++++++++++++++++++++++++++++++++++----- 3 files changed, 58 insertions(+), 19 deletions(-) diff --git a/module/calp/html/vcomponent.scm b/module/calp/html/vcomponent.scm index 3a2bd3cc..49b24fbc 100644 --- a/module/calp/html/vcomponent.scm +++ b/module/calp/html/vcomponent.scm @@ -90,20 +90,21 @@ "~1T~3"))) ,(datetime->string (as-datetime (prop ev 'DTEND)) end)))])) - ,(when (and=> (prop ev 'LOCATION) (negate string-null?)) - `(div (b "Plats: ") - (div (@ (class "location")) - ,(string-map (lambda (c) (if (char=? c #\,) #\newline c)) - (prop ev 'LOCATION))))) - ,(awhen (prop ev 'DESCRIPTION) - `(span (@ (class "description")) - ,(format-description ev it))) - ,(awhen (prop ev 'RRULE) - `(span (@ (class "rrule")) - ,@(format-recurrence-rule ev))) - ,(when (prop ev 'LAST-MODIFIED) - `(span (@ (class "last-modified")) "Senast ändrad " - ,(datetime->string (prop ev 'LAST-MODIFIED) "~1 ~H:~M"))) + (div (@ (class "fields")) + ,(when (and=> (prop ev 'LOCATION) (negate string-null?)) + `(div (b "Plats: ") + (div (@ (class "location")) + ,(string-map (lambda (c) (if (char=? c #\,) #\newline c)) + (prop ev 'LOCATION))))) + ,(awhen (prop ev 'DESCRIPTION) + `(span (@ (class "description")) + ,(format-description ev it))) + ,(awhen (prop ev 'RRULE) + `(span (@ (class "rrule")) + ,@(format-recurrence-rule ev))) + ,(when (prop ev 'LAST-MODIFIED) + `(span (@ (class "last-modified")) "Senast ändrad " + ,(datetime->string (prop ev 'LAST-MODIFIED) "~1 ~H:~M")))) ))) diff --git a/static/lib.js b/static/lib.js index a6f1892b..3c11e23f 100644 --- a/static/lib.js +++ b/static/lib.js @@ -130,3 +130,5 @@ function format_date(date, str) { } Object.prototype.format = function () { return this; } /* any number of arguments */ Date.prototype.format = function (str) { return format_date (this, str); } + +const xcal = "urn:ietf:params:xml:ns:icalendar-2.0"; diff --git a/static/script.js b/static/script.js index fbab5b72..ce57e5e1 100644 --- a/static/script.js +++ b/static/script.js @@ -429,9 +429,21 @@ function place_in_edit_mode (event) { * '.eventtext'?). * Biggest problem is generated fields relative order. */ - let descs = popup.getElementsByClassName("description"); - if (descs.length === 1) { - let description = descs[0]; + { + let descs = popup.getElementsByClassName("description"); + let description; + if (descs.length === 1) { + description = descs[0]; + } else { + let fields = popup.getElementsByClassName("fields")[0] + description = makeElement('span', { + class: 'description', + }); + fields.appendChild(description); + let slot = get_property(event, "description"); + slot.push([description, (s, v) => s.innerHTML = v]); + } + let textarea = makeElement('textarea', { name: "description", placeholder: "Description (optional)", @@ -655,7 +667,14 @@ function toggle_popup(popup_id) { -function get_property(el, field, default_value) { +/* + Returns the _value_ slot of given field in event, creating it if needed . + el - the event to work on + field - name of the field + default_value - default value when creating + bind_to_ical - should this property be added to the icalendar subtree? +*/ +function get_property(el, field, default_value, bind_to_ical=true) { if (! el.properties) { el.properties = {}; } @@ -679,6 +698,20 @@ function get_property(el, field, default_value) { }); } + if (bind_to_ical) { + let ical_properties = el.querySelector("icalendar vevent properties"); + if (! ical_properties.querySelector(field)) { + let text = document.createElementNS(xcal, 'text'); + let element = document.createElementNS(xcal, field); + element.appendChild(text); + if (default_value) {text.innerHTML = default_value;} + + ical_properties.appendChild(element); + el.properties["_slot_" + field].push( + [text, (s, v) => s.innerHTML = v]); + } + } + return el.properties["_slot_" + field]; } @@ -703,6 +736,8 @@ function bind_properties (el, wide_event=false) { let field = child.tagName; let lst = get_property(el, field); + + /* Bind HTML fields for this event */ for (let s of el.getElementsByClassName(field)) { let f = ((s, v) => s.innerHTML = v.format(s.dataset && s.dataset.fmt)); lst.push([s, f]); @@ -712,6 +747,7 @@ function bind_properties (el, wide_event=false) { lst.push([s, f]); } + /* Bind vcomponent fields for this event */ for (let s of el.querySelectorAll(field + " > :not(parameters)")) { switch (s.tagName) { case 'date': @@ -757,7 +793,7 @@ function bind_properties (el, wide_event=false) { el.dataset.calendar = "Unknown"; } - let calprop = get_property(el, 'calendar', el.dataset.calendar); + let calprop = get_property(el, 'calendar', el.dataset.calendar, false); const rplcs = (s, v) => { let [_, calclass] = s.classList.find(/^CAL_/); -- cgit v1.2.3