| 1 |
document.addEventListener('DOMContentLoaded', () => { |
| 2 |
|
| 3 |
const fluentBookingIconStyles = ` |
| 4 |
.fluent-booking-icon { |
| 5 |
width: 28px; |
| 6 |
height: 28px; |
| 7 |
display: block; |
| 8 |
margin: 0 auto; |
| 9 |
text-align: center; |
| 10 |
background-size: contain; |
| 11 |
background-repeat: no-repeat; |
| 12 |
background-image: url('${fcal_elementor_ajax_object.svgIcon}'); |
| 13 |
} |
| 14 |
`; |
| 15 |
|
| 16 |
const styleElement = document.createElement('style'); |
| 17 |
|
| 18 |
styleElement.appendChild(document.createTextNode(fluentBookingIconStyles)); |
| 19 |
|
| 20 |
document.head.appendChild(styleElement); |
| 21 |
|
| 22 |
elementor.hooks.addAction('panel/open_editor/widget', (panel, model, view) => { |
| 23 |
|
| 24 |
const calendarContainer = document.querySelector('.elementor-control-selected_cal_id select'); |
| 25 |
|
| 26 |
let calId = ''; |
| 27 |
if (calendarContainer) { |
| 28 |
calId = calendarContainer.value; |
| 29 |
fetchEvents().catch(error => console.error('Initial fetch error:', error)); |
| 30 |
|
| 31 |
calendarContainer.addEventListener('change', async (event) => { |
| 32 |
calId = event.target.value; |
| 33 |
try { |
| 34 |
await fetchEvents(); |
| 35 |
} catch (error) { |
| 36 |
console.error('Error fetching events on change:', error); |
| 37 |
} |
| 38 |
}); |
| 39 |
} |
| 40 |
|
| 41 |
async function fetchEvents() { |
| 42 |
if (!calId) { |
| 43 |
return; |
| 44 |
} |
| 45 |
try { |
| 46 |
const response = await fetch(window.fcal_elementor_ajax_object.ajaxurl, { |
| 47 |
method: 'POST', |
| 48 |
headers: { |
| 49 |
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' |
| 50 |
}, |
| 51 |
body: new URLSearchParams({ |
| 52 |
action: 'get_calendar_events', |
| 53 |
cal_id: calId, |
| 54 |
security: window.fcal_elementor_ajax_object.nonce // this is the nonce |
| 55 |
}) |
| 56 |
}); |
| 57 |
|
| 58 |
const result = await response.json(); |
| 59 |
|
| 60 |
if (result.success) { |
| 61 |
const eventControl = document.querySelector('.elementor-control-selected_event_ids select'); |
| 62 |
|
| 63 |
if (eventControl) { |
| 64 |
eventControl.innerHTML = ''; |
| 65 |
|
| 66 |
const currentSelectedIds = elementor.getPanelView().getCurrentPageView().getControlViewByName('selected_event_ids').getControlValue(); |
| 67 |
|
| 68 |
Object.entries(result.data).forEach(([key, value]) => { |
| 69 |
const option = document.createElement('option'); |
| 70 |
if (currentSelectedIds && currentSelectedIds.includes(key)) { |
| 71 |
option.selected = true; |
| 72 |
} |
| 73 |
option.value = key; |
| 74 |
option.textContent = value; |
| 75 |
eventControl.appendChild(option); |
| 76 |
}); |
| 77 |
} |
| 78 |
} else { |
| 79 |
console.error(result.data.message); |
| 80 |
} |
| 81 |
} catch (error) { |
| 82 |
console.error('Error fetching events:', error); |
| 83 |
} |
| 84 |
} |
| 85 |
|
| 86 |
const eventControl = document.querySelector('.elementor-control-selected_event select'); |
| 87 |
|
| 88 |
if (eventControl) { |
| 89 |
eventControl.addEventListener('change', async (event) => { |
| 90 |
const eventId = event.target.value; |
| 91 |
const eventHash = await fetchEventHash(eventId); |
| 92 |
|
| 93 |
const controlView = elementor?.getPanelView()?.getCurrentPageView()?.getControlViewByName('event_hash'); |
| 94 |
if (controlView) { |
| 95 |
controlView.setValue(eventHash); |
| 96 |
controlView.triggerMethod('input:change'); |
| 97 |
} else { |
| 98 |
console.error('Event hash control not found'); |
| 99 |
} |
| 100 |
}); |
| 101 |
} |
| 102 |
|
| 103 |
async function fetchEventHash(eventId) { |
| 104 |
const response = await fetch(window.fcal_elementor_ajax_object.ajaxurl, { |
| 105 |
method: 'POST', |
| 106 |
headers: { |
| 107 |
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' |
| 108 |
}, |
| 109 |
body: new URLSearchParams({ |
| 110 |
action: 'get_event_hash', |
| 111 |
event_id: eventId, |
| 112 |
security: window.fcal_elementor_ajax_object.nonce |
| 113 |
}) |
| 114 |
}); |
| 115 |
|
| 116 |
const result = await response.json(); |
| 117 |
|
| 118 |
if (result.success) { |
| 119 |
return result.data.hash; |
| 120 |
} else { |
| 121 |
console.error(result.data.message); |
| 122 |
} |
| 123 |
} |
| 124 |
}); |
| 125 |
}); |
| 126 |
|
