first commit

js/main.js

@@ -0,0 +1,33 @@
+class CampingCareWidget {
+    constructor(elm) {
+        this.elm = elm;
+
+        const jsonData = elm.querySelector('script[data-role=availability]')?.innerHTML;
+        const availability = JSON.parse(jsonData);
+
+
+        flatpickr(elm, {
+            inline: true,
+            enable: Object.keys(availability),
+            onDayCreate: function(dObj, dStr, fp, dayElem){
+                const date = dayElem.dateObj;
+                const dateFormatted = date.toISOString().split('T')[0]
+                const extraClass = availability[dateFormatted];
+
+                if(extraClass){
+                    dayElem.classList.add(extraClass);
+                }
+            }
+
+        });
+    }
+}
+
+
+document.addEventListener('DOMContentLoaded', () => {
+    document.querySelectorAll('[data-camping-care-widget]').forEach((element) => {
+        new CampingCareWidget(element);
+    });
+
+})
+