\u05e0\u05d9\u05d4\u05d5\u05dc \u05d9\u05d5\u05de\u05df \u05d0\u05d9\u05e9\u05d9<\/title>\r\n <style>\r\n * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n body {\r\n font-family: Arial, sans-serif;\r\n line-height: 1.6;\r\n background-color: #f4f4f4;\r\n }\r\n\r\n .calendar-container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n }\r\n\r\n header {\r\n text-align: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .calendar-nav {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .calendar-nav button {\r\n background: none;\r\n border: none;\r\n font-size: 24px;\r\n cursor: pointer;\r\n }\r\n\r\n .view-options {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .view-options button {\r\n padding: 5px 10px;\r\n margin: 0 5px;\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n cursor: pointer;\r\n }\r\n\r\n #calendar-view {\r\n background-color: white;\r\n border-radius: 5px;\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\r\n padding: 20px;\r\n }\r\n\r\n .month-view, .week-view, .day-view {\r\n display: grid;\r\n gap: 5px;\r\n }\r\n\r\n .month-view {\r\n grid-template-columns: repeat(7, 1fr);\r\n }\r\n\r\n .week-view {\r\n grid-template-columns: 50px repeat(7, 1fr);\r\n }\r\n\r\n .day-view {\r\n grid-template-columns: 50px 1fr;\r\n }\r\n\r\n .day, .hour {\r\n border: 1px solid #ddd;\r\n padding: 10px;\r\n min-height: 100px;\r\n position: relative;\r\n }\r\n\r\n .day.current-month {\r\n background-color: #f9f9f9;\r\n }\r\n\r\n .day.other-month {\r\n background-color: #f0f0f0;\r\n color: #999;\r\n }\r\n\r\n .day .date, .day-name {\r\n position: absolute;\r\n top: 5px;\r\n right: 5px;\r\n }\r\n\r\n .day-header {\r\n text-align: center;\r\n font-weight: bold;\r\n padding: 5px;\r\n background-color: #f0f0f0;\r\n border-bottom: 1px solid #ddd;\r\n }\r\n\r\n .event {\r\n background-color: #3498db;\r\n color: white;\r\n padding: 2px 5px;\r\n margin-bottom: 2px;\r\n border-radius: 3px;\r\n font-size: 12px;\r\n cursor: pointer;\r\n }\r\n\r\n .modal {\r\n display: none;\r\n position: fixed;\r\n z-index: 1;\r\n left: 0;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(0,0,0,0.4);\r\n }\r\n\r\n .modal-content {\r\n background-color: white;\r\n margin: 10% auto;\r\n padding: 20px;\r\n border-radius: 5px;\r\n width: 60%;\r\n max-width: 500px;\r\n }\r\n\r\n .close {\r\n color: #aaa;\r\n float: left;\r\n font-size: 28px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n }\r\n\r\n #event-form {\r\n display: grid;\r\n gap: 10px;\r\n }\r\n\r\n #event-form input, #event-form textarea, #event-form select {\r\n width: 100%;\r\n padding: 5px;\r\n }\r\n\r\n #event-form button {\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n padding: 10px;\r\n cursor: pointer;\r\n }\r\n\r\n .fab {\r\n position: fixed;\r\n bottom: 20px;\r\n right: 20px;\r\n width: 60px;\r\n height: 60px;\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n border-radius: 50%;\r\n font-size: 24px;\r\n cursor: pointer;\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.2);\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .calendar-container {\r\n padding: 10px;\r\n }\r\n\r\n .month-view, .week-view, .day-view {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .day, .hour {\r\n min-height: 60px;\r\n }\r\n\r\n .modal-content {\r\n width: 90%;\r\n margin: 5% auto;\r\n }\r\n\r\n .fab {\r\n width: 50px;\r\n height: 50px;\r\n font-size: 20px;\r\n }\r\n\r\n .day-header {\r\n display: none;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"calendar-container\">\r\n <header>\r\n <h1>\u05dc\u05d5\u05d7 \u05e9\u05e0\u05d4 \u05d1\u05e1\u05d2\u05e0\u05d5\u05df Google<\/h1>\r\n <div class=\"calendar-nav\">\r\n <button id=\"prev-btn\"><<\/button>\r\n <h2 id=\"current-date\">\u05d7\u05d5\u05d3\u05e9 \u05e9\u05e0\u05d4<\/h2>\r\n <button id=\"next-btn\">><\/button>\r\n <\/div>\r\n <div class=\"view-options\">\r\n <button id=\"month-view\" class=\"active\">\u05d7\u05d5\u05d3\u05e9<\/button>\r\n <button id=\"week-view\">\u05e9\u05d1\u05d5\u05e2<\/button>\r\n <button id=\"day-view\">\u05d9\u05d5\u05dd<\/button>\r\n <\/div>\r\n <\/header>\r\n \r\n <main id=\"calendar-view\"><\/main>\r\n \r\n <button id=\"add-event-btn\" class=\"fab\">+<\/button>\r\n\r\n <div id=\"event-modal\" class=\"modal\">\r\n <div class=\"modal-content\">\r\n <span class=\"close\">×<\/span>\r\n <h3 id=\"modal-title\">\u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9<\/h3>\r\n <form id=\"event-form\">\r\n <input type=\"text\" id=\"event-title\" placeholder=\"\u05db\u05d5\u05ea\u05e8\u05ea \u05d4\u05d0\u05d9\u05e8\u05d5\u05e2\" required>\r\n <input type=\"date\" id=\"event-start-date\" required>\r\n <input type=\"time\" id=\"event-start-time\" required>\r\n <input type=\"date\" id=\"event-end-date\">\r\n <input type=\"time\" id=\"event-end-time\">\r\n <input type=\"text\" id=\"event-location\" placeholder=\"\u05de\u05d9\u05e7\u05d5\u05dd\">\r\n <textarea id=\"event-description\" placeholder=\"\u05ea\u05d9\u05d0\u05d5\u05e8\"><\/textarea>\r\n <input type=\"color\" id=\"event-color\" value=\"#3498db\">\r\n <select id=\"event-reminder\">\r\n <option value=\"\">\u05dc\u05dc\u05d0 \u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/option>\r\n <option value=\"15\">15 \u05d3\u05e7\u05d5\u05ea \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <option value=\"60\">\u05e9\u05e2\u05d4 \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <option value=\"1440\">\u05d9\u05d5\u05dd \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <\/select>\r\n <button type=\"submit\">\u05e9\u05de\u05d5\u05e8 \u05d0\u05d9\u05e8\u05d5\u05e2<\/button>\r\n <button type=\"button\" id=\"delete-event\" style=\"background-color: #e74c3c; display: none;\">\u05de\u05d7\u05e7 \u05d0\u05d9\u05e8\u05d5\u05e2<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div id=\"reminder-modal\" class=\"modal\">\r\n <div class=\"modal-content\">\r\n <span class=\"close\">×<\/span>\r\n <h3>\u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/h3>\r\n <p id=\"reminder-text\"><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ \u05e7\u05d1\u05d5\u05e2\u05d9\u05dd \u05d5\u05d7\u05d9\u05d1\u05d5\u05e8\u05d9\u05dd \u05dc-DOM\r\n const calendarView = document.getElementById('calendar-view');\r\n const currentDateElement = document.getElementById('current-date');\r\n const prevBtn = document.getElementById('prev-btn');\r\n const nextBtn = document.getElementById('next-btn');\r\n const monthViewBtn = document.getElementById('month-view');\r\n const weekViewBtn = document.getElementById('week-view');\r\n const dayViewBtn = document.getElementById('day-view');\r\n const addEventBtn = document.getElementById('add-event-btn');\r\n const eventModal = document.getElementById('event-modal');\r\n const eventForm = document.getElementById('event-form');\r\n const reminderModal = document.getElementById('reminder-modal');\r\n const reminderText = document.getElementById('reminder-text');\r\n const deleteEventBtn = document.getElementById('delete-event');\r\n\r\n \/\/ \u05de\u05e9\u05ea\u05e0\u05d9\u05dd \u05d2\u05dc\u05d5\u05d1\u05dc\u05d9\u05d9\u05dd\r\n let currentDate = new Date();\r\n let currentView = 'month';\r\n let events = JSON.parse(localStorage.getItem('events')) || [];\r\n let editingEventIndex = null;\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05e2\u05d6\u05e8\r\n function formatDate(date) {\r\n return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;\r\n }\r\n\r\n function formatTime(date) {\r\n return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05ea\u05e6\u05d5\u05d2\u05d4\r\n function renderCalendar() {\r\n switch (currentView) {\r\n case 'month':\r\n renderMonthView();\r\n break;\r\n case 'week':\r\n renderWeekView();\r\n break;\r\n case 'day':\r\n renderDayView();\r\n break;\r\n }\r\n }\r\n\r\n function renderMonthView() {\r\n const year = currentDate.getFullYear();\r\n const month = currentDate.getMonth();\r\n const firstDay = new Date(year, month, 1);\r\n const lastDay = new Date(year, month + 1, 0);\r\n \r\n currentDateElement.textContent = `${firstDay.toLocaleString('he-IL', { month: 'long' })} ${year}`;\r\n \r\n let calendarHTML = '<div class=\"month-view\">';\r\n \r\n \/\/ \u05e9\u05de\u05d5\u05ea \u05d4\u05d9\u05de\u05d9\u05dd\r\n const daysOfWeek = ['\u05e8\u05d0\u05e9\u05d5\u05df', '\u05e9\u05e0\u05d9', '\u05e9\u05dc\u05d9\u05e9\u05d9', '\u05e8\u05d1\u05d9\u05e2\u05d9', '\u05d7\u05de\u05d9\u05e9\u05d9', '\u05e9\u05d9\u05e9\u05d9', '\u05e9\u05d1\u05ea'];\r\n daysOfWeek.forEach(day => {\r\n calendarHTML += `<div class=\"day-header\">${day}<\/div>`;\r\n });\r\n \r\n \/\/ \u05d9\u05de\u05d9\u05dd \u05de\u05d4\u05d7\u05d5\u05d3\u05e9 \u05d4\u05e7\u05d5\u05d3\u05dd\r\n for (let i = 0; i < firstDay.getDay(); i++) {\r\n calendarHTML += '<div class=\"day other-month\"><\/div>';\r\n }\r\n \r\n \/\/ \u05d9\u05de\u05d9\u05dd \u05de\u05d4\u05d7\u05d5\u05d3\u05e9 \u05d4\u05e0\u05d5\u05db\u05d7\u05d9\r\n for (let i = 1; i <= lastDay.getDate(); i++) {\r\n const date = new Date(year, month, i);\r\n const dateString = formatDate(date);\r\n const dayEvents = events.filter(event => event.startDate === dateString);\r\n \r\n calendarHTML += `<div class=\"day current-month\" data-date=\"${dateString}\">\r\n <span class=\"date\">${i}<\/span>\r\n ${dayEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>`;\r\n }\r\n \r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n function renderWeekView() {\r\n const startOfWeek = new Date(currentDate);\r\n startOfWeek.setDate(currentDate.getDate() - currentDate.getDay());\r\n const endOfWeek = new Date(startOfWeek);\r\n endOfWeek.setDate(startOfWeek.getDate() + 6);\r\n\r\n currentDateElement.textContent = `${startOfWeek.toLocaleDateString('he-IL')} - ${endOfWeek.toLocaleDateString('he-IL')}`;\r\n\r\n let calendarHTML = '<div class=\"week-view\">';\r\n calendarHTML += '<div class=\"day-header\"><\/div>'; \/\/ Empty cell for time column\r\n\r\n \/\/ Days of the week\r\n for (let i = 0; i < 7; i++) {\r\n const day = new Date(startOfWeek);\r\n day.setDate(startOfWeek.getDate() + i);\r\n calendarHTML += `<div class=\"day-header\">\r\n ${day.toLocaleDateString('he-IL', { weekday: 'short' })}<br>\r\n ${day.getDate()}\/${day.getMonth() + 1}\r\n <\/div>`;\r\n }\r\n\r\n \/\/ Hours\r\n for (let hour = 0; hour < 24; hour++) {\r\n calendarHTML += `<div class=\"hour\">${hour}:00<\/div>`;\r\n for (let day = 0; day < 7; day++) {\r\n const currentDay = new Date(startOfWeek);\r\n currentDay.setDate(startOfWeek.getDate() + day);\r\n currentDay.setHours(hour);\r\n const dateString = formatDate(currentDay);\r\n const timeString = formatTime(currentDay);\r\n const dayEvents = events.filter(event => \r\n event.startDate === dateString && \r\n event.startTime.startsWith(timeString.slice(0, 2))\r\n );\r\n calendarHTML += `<div class=\"hour\" data-date=\"${dateString}\" data-time=\"${timeString}\">\r\n ${dayEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>`;\r\n }\r\n }\r\n\r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n function renderDayView() {\r\n currentDateElement.textContent = currentDate.toLocaleDateString('he-IL', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });\r\n\r\n let calendarHTML = '<div class=\"day-view\">';\r\n\r\n \/\/ Hours\r\n for (let hour = 0; hour < 24; hour++) {\r\n const currentHour = new Date(currentDate);\r\n currentHour.setHours(hour);\r\n const dateString = formatDate(currentHour);\r\n const timeString = formatTime(currentHour);\r\n const hourEvents = events.filter(event => \r\n event.startDate === dateString && \r\n event.startTime.startsWith(timeString.slice(0, 2))\r\n );\r\n calendarHTML += `\r\n <div class=\"hour\">${hour}:00<\/div>\r\n <div class=\"hour\" data-date=\"${dateString}\" data-time=\"${timeString}\">\r\n ${hourEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>\r\n `;\r\n }\r\n\r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n function addEvent(event) {\r\n events.push(event);\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function editEvent(index, updatedEvent) {\r\n events[index] = updatedEvent;\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function deleteEvent(index) {\r\n events.splice(index, 1);\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function saveEvents() {\r\n localStorage.setItem('events', JSON.stringify(events));\r\n }\r\n\r\n function openEventModal(eventIndex = null) {\r\n editingEventIndex = eventIndex;\r\n const modalTitle = document.getElementById('modal-title');\r\n \r\n if (eventIndex !== null) {\r\n const event = events[eventIndex];\r\n modalTitle.textContent = '\u05e2\u05e8\u05d5\u05da \u05d0\u05d9\u05e8\u05d5\u05e2';\r\n document.getElementById('event-title').value = event.title;\r\n document.getElementById('event-start-date').value = event.startDate;\r\n document.getElementById('event-start-time').value = event.startTime;\r\n document.getElementById('event-end-date').value = event.endDate || '';\r\n document.getElementById('event-end-time').value = event.endTime || '';\r\n document.getElementById('event-location').value = event.location || '';\r\n document.getElementById('event-description').value = event.description || '';\r\n document.getElementById('event-color').value = event.color;\r\n document.getElementById('event-reminder').value = event.reminder || '';\r\n deleteEventBtn.style.display = 'block';\r\n } else {\r\n modalTitle.textContent = '\u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9';\r\n eventForm.reset();\r\n deleteEventBtn.style.display = 'none';\r\n }\r\n \r\n eventModal.style.display = 'block';\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05ea\u05d6\u05db\u05d5\u05e8\u05d5\u05ea\r\n function checkReminders() {\r\n const now = new Date();\r\n events.forEach(event => {\r\n if (event.reminder) {\r\n const reminderTime = new Date(event.startDate + 'T' + event.startTime);\r\n reminderTime.setMinutes(reminderTime.getMinutes() - event.reminder);\r\n \r\n if (now >= reminderTime && now < new Date(event.startDate + 'T' + event.startTime)) {\r\n showReminder(event);\r\n }\r\n }\r\n });\r\n }\r\n\r\n function showReminder(event) {\r\n reminderText.textContent = `\u05ea\u05d6\u05db\u05d5\u05e8\u05ea: ${event.title} \u05de\u05ea\u05d7\u05d9\u05dc \u05d1-${event.startTime}`;\r\n reminderModal.style.display = 'block';\r\n }\r\n\r\n \/\/ \u05de\u05d0\u05d6\u05d9\u05e0\u05d9 \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n prevBtn.addEventListener('click', () => {\r\n if (currentView === 'month') {\r\n currentDate.setMonth(currentDate.getMonth() - 1);\r\n } else if (currentView === 'week') {\r\n currentDate.setDate(currentDate.getDate() - 7);\r\n } else if (currentView === 'day') {\r\n currentDate.setDate(currentDate.getDate() - 1);\r\n }\r\n renderCalendar();\r\n });\r\n\r\n nextBtn.addEventListener('click', () => {\r\n if (currentView === 'month') {\r\n currentDate.setMonth(currentDate.getMonth() + 1);\r\n } else if (currentView === 'week') {\r\n currentDate.setDate(currentDate.getDate() + 7);\r\n } else if (currentView === 'day') {\r\n currentDate.setDate(currentDate.getDate() + 1);\r\n }\r\n renderCalendar();\r\n });\r\n\r\n monthViewBtn.addEventListener('click', () => {\r\n currentView = 'month';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n weekViewBtn.addEventListener('click', () => {\r\n currentView = 'week';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n dayViewBtn.addEventListener('click', () => {\r\n currentView = 'day';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n addEventBtn.addEventListener('click', () => openEventModal());\r\n\r\n eventForm.addEventListener('submit', (e) => {\r\n e.preventDefault();\r\n const newEvent = {\r\n title: document.getElementById('event-title').value,\r\n startDate: document.getElementById('event-start-date').value,\r\n startTime: document.getElementById('event-start-time').value,\r\n endDate: document.getElementById('event-end-date').value || null,\r\n endTime: document.getElementById('event-end-time').value || null,\r\n location: document.getElementById('event-location').value,\r\n description: document.getElementById('event-description').value,\r\n color: document.getElementById('event-color').value,\r\n reminder: document.getElementById('event-reminder').value\r\n };\r\n\r\n if (editingEventIndex !== null) {\r\n editEvent(editingEventIndex, newEvent);\r\n } else {\r\n addEvent(newEvent);\r\n }\r\n\r\n eventModal.style.display = 'none';\r\n editingEventIndex = null;\r\n });\r\n\r\n deleteEventBtn.addEventListener('click', () => {\r\n if (editingEventIndex !== null) {\r\n deleteEvent(editingEventIndex);\r\n eventModal.style.display = 'none';\r\n editingEventIndex = null;\r\n }\r\n });\r\n\r\n \/\/ \u05e1\u05d2\u05d9\u05e8\u05ea \u05d4\u05de\u05d5\u05d3\u05dc\r\n document.querySelectorAll('.close').forEach(closeBtn => {\r\n closeBtn.addEventListener('click', () => {\r\n eventModal.style.display = 'none';\r\n reminderModal.style.display = 'none';\r\n });\r\n });\r\n\r\n window.addEventListener('click', (e) => {\r\n if (e.target === eventModal || e.target === reminderModal) {\r\n eventModal.style.display = 'none';\r\n reminderModal.style.display = 'none';\r\n }\r\n });\r\n\r\n function updateActiveViewButton() {\r\n document.querySelectorAll('.view-options button').forEach(btn => {\r\n btn.classList.remove('active');\r\n });\r\n document.getElementById(`${currentView}-view`).classList.add('active');\r\n }\r\n\r\n \/\/ \u05d2\u05e8\u05d9\u05e8\u05d4 \u05d5\u05e9\u05d7\u05e8\u05d5\u05e8 \u05e9\u05dc \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n let draggedEvent = null;\r\n\r\n function enableDragAndDrop() {\r\n const days = document.querySelectorAll('.day, .hour');\r\n days.forEach(day => {\r\n day.addEventListener('dragover', dragOver);\r\n day.addEventListener('drop', drop);\r\n });\r\n\r\n const eventElements = document.querySelectorAll('.event');\r\n eventElements.forEach(eventElement => {\r\n eventElement.setAttribute('draggable', true);\r\n eventElement.addEventListener('dragstart', dragStart);\r\n });\r\n }\r\n\r\n function dragStart(e) {\r\n draggedEvent = events[e.target.dataset.index];\r\n }\r\n\r\n function dragOver(e) {\r\n e.preventDefault();\r\n }\r\n\r\n function drop(e) {\r\n e.preventDefault();\r\n if (draggedEvent) {\r\n const newDate = e.target.closest('.day, .hour').dataset.date;\r\n const newTime = e.target.closest('.hour')?.dataset.time || draggedEvent.startTime;\r\n const eventIndex = events.indexOf(draggedEvent);\r\n events[eventIndex].startDate = newDate;\r\n events[eventIndex].startTime = newTime;\r\n saveEvents();\r\n renderCalendar();\r\n draggedEvent = null;\r\n }\r\n }\r\n\r\n \/\/ \u05d0\u05ea\u05d7\u05d5\u05dc \u05d4\u05d0\u05e4\u05dc\u05d9\u05e7\u05e6\u05d9\u05d4\r\n renderCalendar();\r\n setInterval(checkReminders, 60000); \/\/ \u05d1\u05d3\u05d9\u05e7\u05ea \u05ea\u05d6\u05db\u05d5\u05e8\u05d5\u05ea \u05db\u05dc \u05d3\u05e7\u05d4\r\n enableDragAndDrop();\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u05e0\u05d9\u05d4\u05d5\u05dc \u05d9\u05d5\u05de\u05df \u05d0\u05d9\u05e9\u05d9 \u05dc\u05d5\u05d7 \u05e9\u05e0\u05d4 \u05d1\u05e1\u05d2\u05e0\u05d5\u05df Google < \u05d7\u05d5\u05d3\u05e9 \u05e9\u05e0\u05d4 > \u05d7\u05d5\u05d3\u05e9 \u05e9\u05d1\u05d5\u05e2 \u05d9\u05d5\u05dd + × \u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9 \u05dc\u05dc\u05d0 \u05ea\u05d6\u05db\u05d5\u05e8\u05ea15 \u05d3\u05e7\u05d5\u05ea \u05dc\u05e4\u05e0\u05d9\u05e9\u05e2\u05d4 \u05dc\u05e4\u05e0\u05d9\u05d9\u05d5\u05dd \u05dc\u05e4\u05e0\u05d9 \u05e9\u05de\u05d5\u05e8 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05de\u05d7\u05e7 \u05d0\u05d9\u05e8\u05d5\u05e2 × \u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_eb_attr":"","content-type":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-6969","page","type-page","status-publish","hentry"],"ams_acf":[],"_links":{"self":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6969"}],"version-history":[{"count":35,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969\/revisions"}],"predecessor-version":[{"id":8019,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969\/revisions\/8019"}],"wp:attachment":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6969"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u05e0\u05d9\u05d4\u05d5\u05dc \u05d9\u05d5\u05de\u05df \u05d0\u05d9\u05e9\u05d9<\/title>\r\n <style>\r\n * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n body {\r\n font-family: Arial, sans-serif;\r\n line-height: 1.6;\r\n background-color: #f4f4f4;\r\n }\r\n\r\n .calendar-container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n }\r\n\r\n header {\r\n text-align: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .calendar-nav {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .calendar-nav button {\r\n background: none;\r\n border: none;\r\n font-size: 24px;\r\n cursor: pointer;\r\n }\r\n\r\n .view-options {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .view-options button {\r\n padding: 5px 10px;\r\n margin: 0 5px;\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n cursor: pointer;\r\n }\r\n\r\n #calendar-view {\r\n background-color: white;\r\n border-radius: 5px;\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.1);\r\n padding: 20px;\r\n }\r\n\r\n .month-view, .week-view, .day-view {\r\n display: grid;\r\n gap: 5px;\r\n }\r\n\r\n .month-view {\r\n grid-template-columns: repeat(7, 1fr);\r\n }\r\n\r\n .week-view {\r\n grid-template-columns: 50px repeat(7, 1fr);\r\n }\r\n\r\n .day-view {\r\n grid-template-columns: 50px 1fr;\r\n }\r\n\r\n .day, .hour {\r\n border: 1px solid #ddd;\r\n padding: 10px;\r\n min-height: 100px;\r\n position: relative;\r\n }\r\n\r\n .day.current-month {\r\n background-color: #f9f9f9;\r\n }\r\n\r\n .day.other-month {\r\n background-color: #f0f0f0;\r\n color: #999;\r\n }\r\n\r\n .day .date, .day-name {\r\n position: absolute;\r\n top: 5px;\r\n right: 5px;\r\n }\r\n\r\n .day-header {\r\n text-align: center;\r\n font-weight: bold;\r\n padding: 5px;\r\n background-color: #f0f0f0;\r\n border-bottom: 1px solid #ddd;\r\n }\r\n\r\n .event {\r\n background-color: #3498db;\r\n color: white;\r\n padding: 2px 5px;\r\n margin-bottom: 2px;\r\n border-radius: 3px;\r\n font-size: 12px;\r\n cursor: pointer;\r\n }\r\n\r\n .modal {\r\n display: none;\r\n position: fixed;\r\n z-index: 1;\r\n left: 0;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(0,0,0,0.4);\r\n }\r\n\r\n .modal-content {\r\n background-color: white;\r\n margin: 10% auto;\r\n padding: 20px;\r\n border-radius: 5px;\r\n width: 60%;\r\n max-width: 500px;\r\n }\r\n\r\n .close {\r\n color: #aaa;\r\n float: left;\r\n font-size: 28px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n }\r\n\r\n #event-form {\r\n display: grid;\r\n gap: 10px;\r\n }\r\n\r\n #event-form input, #event-form textarea, #event-form select {\r\n width: 100%;\r\n padding: 5px;\r\n }\r\n\r\n #event-form button {\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n padding: 10px;\r\n cursor: pointer;\r\n }\r\n\r\n .fab {\r\n position: fixed;\r\n bottom: 20px;\r\n right: 20px;\r\n width: 60px;\r\n height: 60px;\r\n background-color: #3498db;\r\n color: white;\r\n border: none;\r\n border-radius: 50%;\r\n font-size: 24px;\r\n cursor: pointer;\r\n box-shadow: 0 2px 5px rgba(0,0,0,0.2);\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .calendar-container {\r\n padding: 10px;\r\n }\r\n\r\n .month-view, .week-view, .day-view {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .day, .hour {\r\n min-height: 60px;\r\n }\r\n\r\n .modal-content {\r\n width: 90%;\r\n margin: 5% auto;\r\n }\r\n\r\n .fab {\r\n width: 50px;\r\n height: 50px;\r\n font-size: 20px;\r\n }\r\n\r\n .day-header {\r\n display: none;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"calendar-container\">\r\n <header>\r\n <h1>\u05dc\u05d5\u05d7 \u05e9\u05e0\u05d4 \u05d1\u05e1\u05d2\u05e0\u05d5\u05df Google<\/h1>\r\n <div class=\"calendar-nav\">\r\n <button id=\"prev-btn\"><<\/button>\r\n <h2 id=\"current-date\">\u05d7\u05d5\u05d3\u05e9 \u05e9\u05e0\u05d4<\/h2>\r\n <button id=\"next-btn\">><\/button>\r\n <\/div>\r\n <div class=\"view-options\">\r\n <button id=\"month-view\" class=\"active\">\u05d7\u05d5\u05d3\u05e9<\/button>\r\n <button id=\"week-view\">\u05e9\u05d1\u05d5\u05e2<\/button>\r\n <button id=\"day-view\">\u05d9\u05d5\u05dd<\/button>\r\n <\/div>\r\n <\/header>\r\n \r\n <main id=\"calendar-view\"><\/main>\r\n \r\n <button id=\"add-event-btn\" class=\"fab\">+<\/button>\r\n\r\n <div id=\"event-modal\" class=\"modal\">\r\n <div class=\"modal-content\">\r\n <span class=\"close\">×<\/span>\r\n <h3 id=\"modal-title\">\u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9<\/h3>\r\n <form id=\"event-form\">\r\n <input type=\"text\" id=\"event-title\" placeholder=\"\u05db\u05d5\u05ea\u05e8\u05ea \u05d4\u05d0\u05d9\u05e8\u05d5\u05e2\" required>\r\n <input type=\"date\" id=\"event-start-date\" required>\r\n <input type=\"time\" id=\"event-start-time\" required>\r\n <input type=\"date\" id=\"event-end-date\">\r\n <input type=\"time\" id=\"event-end-time\">\r\n <input type=\"text\" id=\"event-location\" placeholder=\"\u05de\u05d9\u05e7\u05d5\u05dd\">\r\n <textarea id=\"event-description\" placeholder=\"\u05ea\u05d9\u05d0\u05d5\u05e8\"><\/textarea>\r\n <input type=\"color\" id=\"event-color\" value=\"#3498db\">\r\n <select id=\"event-reminder\">\r\n <option value=\"\">\u05dc\u05dc\u05d0 \u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/option>\r\n <option value=\"15\">15 \u05d3\u05e7\u05d5\u05ea \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <option value=\"60\">\u05e9\u05e2\u05d4 \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <option value=\"1440\">\u05d9\u05d5\u05dd \u05dc\u05e4\u05e0\u05d9<\/option>\r\n <\/select>\r\n <button type=\"submit\">\u05e9\u05de\u05d5\u05e8 \u05d0\u05d9\u05e8\u05d5\u05e2<\/button>\r\n <button type=\"button\" id=\"delete-event\" style=\"background-color: #e74c3c; display: none;\">\u05de\u05d7\u05e7 \u05d0\u05d9\u05e8\u05d5\u05e2<\/button>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div id=\"reminder-modal\" class=\"modal\">\r\n <div class=\"modal-content\">\r\n <span class=\"close\">×<\/span>\r\n <h3>\u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/h3>\r\n <p id=\"reminder-text\"><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ \u05e7\u05d1\u05d5\u05e2\u05d9\u05dd \u05d5\u05d7\u05d9\u05d1\u05d5\u05e8\u05d9\u05dd \u05dc-DOM\r\n const calendarView = document.getElementById('calendar-view');\r\n const currentDateElement = document.getElementById('current-date');\r\n const prevBtn = document.getElementById('prev-btn');\r\n const nextBtn = document.getElementById('next-btn');\r\n const monthViewBtn = document.getElementById('month-view');\r\n const weekViewBtn = document.getElementById('week-view');\r\n const dayViewBtn = document.getElementById('day-view');\r\n const addEventBtn = document.getElementById('add-event-btn');\r\n const eventModal = document.getElementById('event-modal');\r\n const eventForm = document.getElementById('event-form');\r\n const reminderModal = document.getElementById('reminder-modal');\r\n const reminderText = document.getElementById('reminder-text');\r\n const deleteEventBtn = document.getElementById('delete-event');\r\n\r\n \/\/ \u05de\u05e9\u05ea\u05e0\u05d9\u05dd \u05d2\u05dc\u05d5\u05d1\u05dc\u05d9\u05d9\u05dd\r\n let currentDate = new Date();\r\n let currentView = 'month';\r\n let events = JSON.parse(localStorage.getItem('events')) || [];\r\n let editingEventIndex = null;\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05e2\u05d6\u05e8\r\n function formatDate(date) {\r\n return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;\r\n }\r\n\r\n function formatTime(date) {\r\n return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05ea\u05e6\u05d5\u05d2\u05d4\r\n function renderCalendar() {\r\n switch (currentView) {\r\n case 'month':\r\n renderMonthView();\r\n break;\r\n case 'week':\r\n renderWeekView();\r\n break;\r\n case 'day':\r\n renderDayView();\r\n break;\r\n }\r\n }\r\n\r\n function renderMonthView() {\r\n const year = currentDate.getFullYear();\r\n const month = currentDate.getMonth();\r\n const firstDay = new Date(year, month, 1);\r\n const lastDay = new Date(year, month + 1, 0);\r\n \r\n currentDateElement.textContent = `${firstDay.toLocaleString('he-IL', { month: 'long' })} ${year}`;\r\n \r\n let calendarHTML = '<div class=\"month-view\">';\r\n \r\n \/\/ \u05e9\u05de\u05d5\u05ea \u05d4\u05d9\u05de\u05d9\u05dd\r\n const daysOfWeek = ['\u05e8\u05d0\u05e9\u05d5\u05df', '\u05e9\u05e0\u05d9', '\u05e9\u05dc\u05d9\u05e9\u05d9', '\u05e8\u05d1\u05d9\u05e2\u05d9', '\u05d7\u05de\u05d9\u05e9\u05d9', '\u05e9\u05d9\u05e9\u05d9', '\u05e9\u05d1\u05ea'];\r\n daysOfWeek.forEach(day => {\r\n calendarHTML += `<div class=\"day-header\">${day}<\/div>`;\r\n });\r\n \r\n \/\/ \u05d9\u05de\u05d9\u05dd \u05de\u05d4\u05d7\u05d5\u05d3\u05e9 \u05d4\u05e7\u05d5\u05d3\u05dd\r\n for (let i = 0; i < firstDay.getDay(); i++) {\r\n calendarHTML += '<div class=\"day other-month\"><\/div>';\r\n }\r\n \r\n \/\/ \u05d9\u05de\u05d9\u05dd \u05de\u05d4\u05d7\u05d5\u05d3\u05e9 \u05d4\u05e0\u05d5\u05db\u05d7\u05d9\r\n for (let i = 1; i <= lastDay.getDate(); i++) {\r\n const date = new Date(year, month, i);\r\n const dateString = formatDate(date);\r\n const dayEvents = events.filter(event => event.startDate === dateString);\r\n \r\n calendarHTML += `<div class=\"day current-month\" data-date=\"${dateString}\">\r\n <span class=\"date\">${i}<\/span>\r\n ${dayEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>`;\r\n }\r\n \r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n function renderWeekView() {\r\n const startOfWeek = new Date(currentDate);\r\n startOfWeek.setDate(currentDate.getDate() - currentDate.getDay());\r\n const endOfWeek = new Date(startOfWeek);\r\n endOfWeek.setDate(startOfWeek.getDate() + 6);\r\n\r\n currentDateElement.textContent = `${startOfWeek.toLocaleDateString('he-IL')} - ${endOfWeek.toLocaleDateString('he-IL')}`;\r\n\r\n let calendarHTML = '<div class=\"week-view\">';\r\n calendarHTML += '<div class=\"day-header\"><\/div>'; \/\/ Empty cell for time column\r\n\r\n \/\/ Days of the week\r\n for (let i = 0; i < 7; i++) {\r\n const day = new Date(startOfWeek);\r\n day.setDate(startOfWeek.getDate() + i);\r\n calendarHTML += `<div class=\"day-header\">\r\n ${day.toLocaleDateString('he-IL', { weekday: 'short' })}<br>\r\n ${day.getDate()}\/${day.getMonth() + 1}\r\n <\/div>`;\r\n }\r\n\r\n \/\/ Hours\r\n for (let hour = 0; hour < 24; hour++) {\r\n calendarHTML += `<div class=\"hour\">${hour}:00<\/div>`;\r\n for (let day = 0; day < 7; day++) {\r\n const currentDay = new Date(startOfWeek);\r\n currentDay.setDate(startOfWeek.getDate() + day);\r\n currentDay.setHours(hour);\r\n const dateString = formatDate(currentDay);\r\n const timeString = formatTime(currentDay);\r\n const dayEvents = events.filter(event => \r\n event.startDate === dateString && \r\n event.startTime.startsWith(timeString.slice(0, 2))\r\n );\r\n calendarHTML += `<div class=\"hour\" data-date=\"${dateString}\" data-time=\"${timeString}\">\r\n ${dayEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>`;\r\n }\r\n }\r\n\r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n function renderDayView() {\r\n currentDateElement.textContent = currentDate.toLocaleDateString('he-IL', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });\r\n\r\n let calendarHTML = '<div class=\"day-view\">';\r\n\r\n \/\/ Hours\r\n for (let hour = 0; hour < 24; hour++) {\r\n const currentHour = new Date(currentDate);\r\n currentHour.setHours(hour);\r\n const dateString = formatDate(currentHour);\r\n const timeString = formatTime(currentHour);\r\n const hourEvents = events.filter(event => \r\n event.startDate === dateString && \r\n event.startTime.startsWith(timeString.slice(0, 2))\r\n );\r\n calendarHTML += `\r\n <div class=\"hour\">${hour}:00<\/div>\r\n <div class=\"hour\" data-date=\"${dateString}\" data-time=\"${timeString}\">\r\n ${hourEvents.map(event => `<div class=\"event\" style=\"background-color: ${event.color}\" onclick=\"openEventModal(${events.indexOf(event)})\">${event.title}<\/div>`).join('')}\r\n <\/div>\r\n `;\r\n }\r\n\r\n calendarHTML += '<\/div>';\r\n calendarView.innerHTML = calendarHTML;\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n function addEvent(event) {\r\n events.push(event);\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function editEvent(index, updatedEvent) {\r\n events[index] = updatedEvent;\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function deleteEvent(index) {\r\n events.splice(index, 1);\r\n saveEvents();\r\n renderCalendar();\r\n }\r\n\r\n function saveEvents() {\r\n localStorage.setItem('events', JSON.stringify(events));\r\n }\r\n\r\n function openEventModal(eventIndex = null) {\r\n editingEventIndex = eventIndex;\r\n const modalTitle = document.getElementById('modal-title');\r\n \r\n if (eventIndex !== null) {\r\n const event = events[eventIndex];\r\n modalTitle.textContent = '\u05e2\u05e8\u05d5\u05da \u05d0\u05d9\u05e8\u05d5\u05e2';\r\n document.getElementById('event-title').value = event.title;\r\n document.getElementById('event-start-date').value = event.startDate;\r\n document.getElementById('event-start-time').value = event.startTime;\r\n document.getElementById('event-end-date').value = event.endDate || '';\r\n document.getElementById('event-end-time').value = event.endTime || '';\r\n document.getElementById('event-location').value = event.location || '';\r\n document.getElementById('event-description').value = event.description || '';\r\n document.getElementById('event-color').value = event.color;\r\n document.getElementById('event-reminder').value = event.reminder || '';\r\n deleteEventBtn.style.display = 'block';\r\n } else {\r\n modalTitle.textContent = '\u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9';\r\n eventForm.reset();\r\n deleteEventBtn.style.display = 'none';\r\n }\r\n \r\n eventModal.style.display = 'block';\r\n }\r\n\r\n \/\/ \u05e4\u05d5\u05e0\u05e7\u05e6\u05d9\u05d5\u05ea \u05ea\u05d6\u05db\u05d5\u05e8\u05d5\u05ea\r\n function checkReminders() {\r\n const now = new Date();\r\n events.forEach(event => {\r\n if (event.reminder) {\r\n const reminderTime = new Date(event.startDate + 'T' + event.startTime);\r\n reminderTime.setMinutes(reminderTime.getMinutes() - event.reminder);\r\n \r\n if (now >= reminderTime && now < new Date(event.startDate + 'T' + event.startTime)) {\r\n showReminder(event);\r\n }\r\n }\r\n });\r\n }\r\n\r\n function showReminder(event) {\r\n reminderText.textContent = `\u05ea\u05d6\u05db\u05d5\u05e8\u05ea: ${event.title} \u05de\u05ea\u05d7\u05d9\u05dc \u05d1-${event.startTime}`;\r\n reminderModal.style.display = 'block';\r\n }\r\n\r\n \/\/ \u05de\u05d0\u05d6\u05d9\u05e0\u05d9 \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n prevBtn.addEventListener('click', () => {\r\n if (currentView === 'month') {\r\n currentDate.setMonth(currentDate.getMonth() - 1);\r\n } else if (currentView === 'week') {\r\n currentDate.setDate(currentDate.getDate() - 7);\r\n } else if (currentView === 'day') {\r\n currentDate.setDate(currentDate.getDate() - 1);\r\n }\r\n renderCalendar();\r\n });\r\n\r\n nextBtn.addEventListener('click', () => {\r\n if (currentView === 'month') {\r\n currentDate.setMonth(currentDate.getMonth() + 1);\r\n } else if (currentView === 'week') {\r\n currentDate.setDate(currentDate.getDate() + 7);\r\n } else if (currentView === 'day') {\r\n currentDate.setDate(currentDate.getDate() + 1);\r\n }\r\n renderCalendar();\r\n });\r\n\r\n monthViewBtn.addEventListener('click', () => {\r\n currentView = 'month';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n weekViewBtn.addEventListener('click', () => {\r\n currentView = 'week';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n dayViewBtn.addEventListener('click', () => {\r\n currentView = 'day';\r\n renderCalendar();\r\n updateActiveViewButton();\r\n });\r\n\r\n addEventBtn.addEventListener('click', () => openEventModal());\r\n\r\n eventForm.addEventListener('submit', (e) => {\r\n e.preventDefault();\r\n const newEvent = {\r\n title: document.getElementById('event-title').value,\r\n startDate: document.getElementById('event-start-date').value,\r\n startTime: document.getElementById('event-start-time').value,\r\n endDate: document.getElementById('event-end-date').value || null,\r\n endTime: document.getElementById('event-end-time').value || null,\r\n location: document.getElementById('event-location').value,\r\n description: document.getElementById('event-description').value,\r\n color: document.getElementById('event-color').value,\r\n reminder: document.getElementById('event-reminder').value\r\n };\r\n\r\n if (editingEventIndex !== null) {\r\n editEvent(editingEventIndex, newEvent);\r\n } else {\r\n addEvent(newEvent);\r\n }\r\n\r\n eventModal.style.display = 'none';\r\n editingEventIndex = null;\r\n });\r\n\r\n deleteEventBtn.addEventListener('click', () => {\r\n if (editingEventIndex !== null) {\r\n deleteEvent(editingEventIndex);\r\n eventModal.style.display = 'none';\r\n editingEventIndex = null;\r\n }\r\n });\r\n\r\n \/\/ \u05e1\u05d2\u05d9\u05e8\u05ea \u05d4\u05de\u05d5\u05d3\u05dc\r\n document.querySelectorAll('.close').forEach(closeBtn => {\r\n closeBtn.addEventListener('click', () => {\r\n eventModal.style.display = 'none';\r\n reminderModal.style.display = 'none';\r\n });\r\n });\r\n\r\n window.addEventListener('click', (e) => {\r\n if (e.target === eventModal || e.target === reminderModal) {\r\n eventModal.style.display = 'none';\r\n reminderModal.style.display = 'none';\r\n }\r\n });\r\n\r\n function updateActiveViewButton() {\r\n document.querySelectorAll('.view-options button').forEach(btn => {\r\n btn.classList.remove('active');\r\n });\r\n document.getElementById(`${currentView}-view`).classList.add('active');\r\n }\r\n\r\n \/\/ \u05d2\u05e8\u05d9\u05e8\u05d4 \u05d5\u05e9\u05d7\u05e8\u05d5\u05e8 \u05e9\u05dc \u05d0\u05d9\u05e8\u05d5\u05e2\u05d9\u05dd\r\n let draggedEvent = null;\r\n\r\n function enableDragAndDrop() {\r\n const days = document.querySelectorAll('.day, .hour');\r\n days.forEach(day => {\r\n day.addEventListener('dragover', dragOver);\r\n day.addEventListener('drop', drop);\r\n });\r\n\r\n const eventElements = document.querySelectorAll('.event');\r\n eventElements.forEach(eventElement => {\r\n eventElement.setAttribute('draggable', true);\r\n eventElement.addEventListener('dragstart', dragStart);\r\n });\r\n }\r\n\r\n function dragStart(e) {\r\n draggedEvent = events[e.target.dataset.index];\r\n }\r\n\r\n function dragOver(e) {\r\n e.preventDefault();\r\n }\r\n\r\n function drop(e) {\r\n e.preventDefault();\r\n if (draggedEvent) {\r\n const newDate = e.target.closest('.day, .hour').dataset.date;\r\n const newTime = e.target.closest('.hour')?.dataset.time || draggedEvent.startTime;\r\n const eventIndex = events.indexOf(draggedEvent);\r\n events[eventIndex].startDate = newDate;\r\n events[eventIndex].startTime = newTime;\r\n saveEvents();\r\n renderCalendar();\r\n draggedEvent = null;\r\n }\r\n }\r\n\r\n \/\/ \u05d0\u05ea\u05d7\u05d5\u05dc \u05d4\u05d0\u05e4\u05dc\u05d9\u05e7\u05e6\u05d9\u05d4\r\n renderCalendar();\r\n setInterval(checkReminders, 60000); \/\/ \u05d1\u05d3\u05d9\u05e7\u05ea \u05ea\u05d6\u05db\u05d5\u05e8\u05d5\u05ea \u05db\u05dc \u05d3\u05e7\u05d4\r\n enableDragAndDrop();\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u05e0\u05d9\u05d4\u05d5\u05dc \u05d9\u05d5\u05de\u05df \u05d0\u05d9\u05e9\u05d9 \u05dc\u05d5\u05d7 \u05e9\u05e0\u05d4 \u05d1\u05e1\u05d2\u05e0\u05d5\u05df Google < \u05d7\u05d5\u05d3\u05e9 \u05e9\u05e0\u05d4 > \u05d7\u05d5\u05d3\u05e9 \u05e9\u05d1\u05d5\u05e2 \u05d9\u05d5\u05dd + × \u05d4\u05d5\u05e1\u05e3 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05d7\u05d3\u05e9 \u05dc\u05dc\u05d0 \u05ea\u05d6\u05db\u05d5\u05e8\u05ea15 \u05d3\u05e7\u05d5\u05ea \u05dc\u05e4\u05e0\u05d9\u05e9\u05e2\u05d4 \u05dc\u05e4\u05e0\u05d9\u05d9\u05d5\u05dd \u05dc\u05e4\u05e0\u05d9 \u05e9\u05de\u05d5\u05e8 \u05d0\u05d9\u05e8\u05d5\u05e2 \u05de\u05d7\u05e7 \u05d0\u05d9\u05e8\u05d5\u05e2 × \u05ea\u05d6\u05db\u05d5\u05e8\u05ea<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_eb_attr":"","content-type":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-6969","page","type-page","status-publish","hentry"],"ams_acf":[],"_links":{"self":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6969"}],"version-history":[{"count":35,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969\/revisions"}],"predecessor-version":[{"id":8019,"href":"https:\/\/digitalrise.art\/index.php?rest_route=\/wp\/v2\/pages\/6969\/revisions\/8019"}],"wp:attachment":[{"href":"https:\/\/digitalrise.art\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6969"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}