HTML add toggle for whole-day.

2 files changed, 42 insertions, 10 deletions

diff --git a/module/vcomponent/xcal/parse.scm b/module/vcomponent/xcal/parse.scm
index 17c684fc..c97bc492 100644
--- a/module/vcomponent/xcal/parse.scm
+++ b/module/vcomponent/xcal/parse.scm
@@ -25,7 +25,10 @@
     ;; TODO possibly trim whitespace on text fields
     [(cal-address uri text unknown) (car value)]
 
-    [(date) (parse-iso-date (car value))]
+    [(date)
+     ;; TODO this is correct, but ensure remaining types
+     (hashq-set! props 'VALUE "DATE")
+     (parse-iso-date (car value))]
 
     [(date-time) (parse-iso-datetime (car value))]
 
@@ -108,6 +111,12 @@
                data '(AUDIO DISPLAY EMAIL NONE)))
     [else data]))
 
+;; Note
+;; This doesn't verify the inter-field validity of the object,
+;; meaning that value(DTSTART) == DATE and value(DTEND) == DATE-TIME
+;; are possibilities, which other parts of the code will crash on.
+;; TODO
+;; since we are feeding user input into this it really should be fixed.
 (define-public (sxcal->vcomponent sxcal)
   (define type (symbol-upcase (car sxcal)))
   (define component (make-vcomponent type))
diff --git a/static/script.js b/static/script.js
index af80c15e..636bf086 100644
--- a/static/script.js
+++ b/static/script.js
@@ -817,6 +817,21 @@ function bind_properties (el, wide_event=false) {
         }
     }
 
+    /* checkbox for whole day */
+    let wholeday = popup.querySelector("input[name='wholeday']");
+    wholeday.addEventListener('click', function (event) {
+        for (let f of popup.querySelectorAll("input[type='time']")) {
+            f.disabled = wholeday.checked;
+        }
+
+        for (let f of ['dtstart', 'dtend']) {
+            let d = el.properties[f];
+            if (! d) continue; /* dtend optional */
+            d.isWholeDay = wholeday.checked;
+            el.properties[f] = d;
+        }
+    });
+
 
     for (let field of ['dtstart', 'dtend']) {
 
@@ -855,21 +870,29 @@ function bind_properties (el, wide_event=false) {
     }
 
 
+    /* icalendar properties */
     for (let child of el.querySelector("vevent > properties").children) {
-        let field = child.tagName;
+        /* child ≡ <dtstart><date-time>...</date-time></dtstart> */
 
+        let field = child.tagName;
         let lst = get_property(el, field);
 
         /* Bind vcomponent fields for this event */
         for (let s of el.querySelectorAll(`${field} > :not(parameters)`)) {
-            switch (s.tagName) {
-            case 'date':
-                lst.push([s, (s, v) => s.innerHTML = v.format("~Y-~m-~d")]); break;
-            case 'date-time':
-                lst.push([s, (s, v) => s.innerHTML = v.format("~Y-~m-~dT~H:~M:00~Z")]); break;
-            default:
-                lst.push([s, (s, v) => s.innerHTML = v]);
-            }
+            lst.push([s, (s, v) => {
+                if (v instanceof Date) {
+                    if (v.isWholeDay) {
+                        let str = v.format('~Y-~m-~d');
+                        child.innerHTML = `<date>${str}</date>`;
+                    } else {
+                        let str = v.format('~Y-~m-~dT~H:~M:00~Z');
+                        child.innerHTML = `<date-time>${str}</date-time>`;
+                    }
+                } else {
+                    /* assume that type already is correct */
+                    s.innerHTML = v;
+                }
+            }]);
             el.properties["_value_" + field] = s.innerHTML;
         }
     }