From d150ec3abc015650b137abe552c0964d915dff10 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= Date: Mon, 17 Aug 2020 16:26:29 +0200 Subject: Can add events spanning midnight. --- module/html/vcomponent.scm | 21 +++++++++++++++------ static/script.js | 32 ++++++++++++++++++++++++++++---- 2 files changed, 43 insertions(+), 10 deletions(-) diff --git a/module/html/vcomponent.scm b/module/html/vcomponent.scm index 6801365b..7d2cace1 100644 --- a/module/html/vcomponent.scm +++ b/module/html/vcomponent.scm @@ -66,19 +66,28 @@ (div ,(call-with-values (lambda () (fmt-time-span ev)) (case-lambda [(start) - `(div (span (@ (class "dtstart") - (data-fmt ,(string-append "~L" start))) + `(div (time (@ (class "dtstart") + (data-fmt ,(string-append "~L" start)) + (datetime ,(datetime->string + (as-datetime (prop ev 'DTSTART)) + "~1T~3"))) ,(datetime->string (as-datetime (prop ev 'DTSTART)) start)))] [(start end) - `(div (span (@ (class "dtstart") - (data-fmt ,(string-append "~L" start))) + `(div (time (@ (class "dtstart") + (data-fmt ,(string-append "~L" start)) + (datetime ,(datetime->string + (as-datetime (prop ev 'DTSTART)) + "~1T~3"))) ,(datetime->string (as-datetime (prop ev 'DTSTART)) start)) " — " - (span (@ (class "dtend") - (data-fmt ,(string-append "~L" end))) + (time (@ (class "dtend") + (data-fmt ,(string-append "~L" end)) + (datetime ,(datetime->string + (as-datetime (prop ev 'DTSTART)) + "~1T~3"))) ,(datetime->string (as-datetime (prop ev 'DTEND)) end)))])) ,(when (and=> (prop ev 'LOCATION) (negate string-null?)) diff --git a/static/script.js b/static/script.js index acbe7ca8..46b76a9a 100644 --- a/static/script.js +++ b/static/script.js @@ -440,10 +440,30 @@ function place_in_edit_mode (event) { function replace_with_time_input(fieldname, event) { let field = popup.getElementsByClassName(fieldname)[0]; - let input = makeElement ('input', { + let dt = new Date(field.dateTime); + + let dateinput = makeElement ('input', { + type: 'date', + required: true, + value: dt.format("~Y-~m-~d"), + + onchange: function (e) { + /* Only update datetime when the input is filled out */ + if (! this.value) return; + let [year, month, day] = this.value.split("-").map(Number); + /* retain the hour and second information */ + let d = copyDate(event.properties[fieldname]); + d.setYear(year); + d.setMonth(month - 1); + d.setDate(day); + event.properties[fieldname] = d; + } + }); + + let timeinput = makeElement ('input', { type: "time", required: true, - value: field.innerText, + value: dt.format("~H:~M"), onchange: function (e) { /* Only update datetime when the input is filled out */ @@ -458,9 +478,13 @@ function place_in_edit_mode (event) { }); let slot = event.properties["_slot_" + fieldname] let idx = slot.findIndex(e => e[0] === field); - slot.splice(idx, 1, [input, (s, v) => s.value = v.format("~H:~M")]) + slot.splice(idx, 1, [timeinput, (s, v) => s.value = v.format("~H:~M")]) + slot.splice(idx, 0, [dateinput, (s, v) => s.value = v.format("~Y-~m-~d")]) - field.replaceWith(input); + field.innerHTML = ''; + field.appendChild(dateinput); + field.appendChild(timeinput); + // field.replaceWith(timeinput); } -- cgit v1.2.3