Annotations: add checkbox example and fix

eeditiones · Apr 18, 2024 · a16bca8 · a16bca8
1 parent 121e512
commit a16bca8
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/resources/scripts/annotations/annotations.js b/resources/scripts/annotations/annotations.js
@@ -158,7 +158,14 @@ window.addEventListener("WebComponentsReady", () => {
 			Object.keys(data).forEach((key) => {
 				const field = form.querySelector(`[name="${key}"]`);
 				if (field) {
-					field.value = data[key];
+					if (field.type === 'checkbox') {
+						const values = Array.isArray(data[key]) ? data[key] : data[key].split(/\s+/);
+						form.querySelectorAll(`[name="${key}"]`).forEach((input) => {
+							input.checked = values.indexOf(input.value) != -1;
+						});
+					} else {
+						field.value = data[key];
+					}
 				}
 			});
 			form.querySelectorAll('pb-repeat').forEach(repeat => repeat.setData(data));

diff --git a/templates/pages/annotate.html b/templates/pages/annotate.html
@@ -171,7 +171,12 @@
                                     <paper-input name="to" label="to" type="date"></paper-input>
                                 </div>
                                 <div class="annotation-form hi">
-                                    <paper-input name="rend" label="rend"></paper-input>
+                                    <label>
+                                        <input type="checkbox" name="rend" value="b"/> bold
+                                    </label>
+                                    <label>
+                                        <input type="checkbox" name="rend" value="i"/> italicised
+                                    </label>
                                     <paper-input name="rendition" label="rendition"></paper-input>
                                 </div>
                                 <div class="annotation-form link">