calendar - find how to save the date in google calendar or ios calendar.

resources/views/modals/calendar-modal.blade.php

@@ -233,7 +233,7 @@
       </div>
       <div class="modal-action">
         <form method="dialog" id="closeCalendarForm"></form>
-        <button type="button" class="btn bg-babybluedark">Simpan</button>
+        <button type="button" class="btn bg-babybluedark" id="saveDate">Simpan</button>
         <button type="button" class="btn" id="submitCloseCalendarForm">Tutup</button>
       </div>
     </div>
@@ -247,4 +247,63 @@
             });
         });
       </script>
+
+<script>
+    function getMobileOperatingSystem() {
+        var userAgent = navigator.userAgent || navigator.vendor || window.opera;
+
+        if (/windows phone/i.test(userAgent)) {
+            return "Windows Phone";
+        }
+
+        if (/android/i.test(userAgent)) {
+            return "Android";
+        }
+
+        if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+            return "iOS";
+        }
+
+        return "unknown";
+    }
+
+    document.getElementById('saveDate').addEventListener('click', function () {
+        const os = getMobileOperatingSystem();
+        console.log("Operating System: " + os);
+
+        const title = 'Event Title';
+        const startDate = '20240720T090000Z';
+        const endDate = '20240720T100000Z';
+        const details = 'Event Details';
+        const location = 'Event Location';
+
+        if (os === 'iOS') {
+            const icsContent = `BEGIN:VCALENDAR
+VERSION:2.0
+BEGIN:VEVENT
+SUMMARY:${title}
+DTSTART:${startDate}
+DTEND:${endDate}
+DESCRIPTION:${details}
+LOCATION:${location}
+END:VEVENT
+END:VCALENDAR`;
+
+            const blob = new Blob([icsContent], { type: 'text/calendar' });
+            const url = URL.createObjectURL(blob);
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = 'event.ics';
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(url);
+        } else if (os === 'Android') {
+            const googleCalendarUrl = `https://calendar.google.com/calendar/render?action=TEMPLATE&text=${encodeURIComponent(title)}&dates=${startDate}/${endDate}&details=${encodeURIComponent(details)}&location=${encodeURIComponent(location)}`;
+            window.open(googleCalendarUrl, '_blank');
+        } else {
+            alert('Your device is not supported for this feature.');
+        }
+    });
+</script>
   @endpush