1 | document.addEventListener('DOMContentLoaded', function() {
|
---|
2 | const form = document.getElementById('form-id');
|
---|
3 | const loadingOverlay = document.getElementById('loadingOverlay');
|
---|
4 |
|
---|
5 | form.addEventListener('submit', function(event) {
|
---|
6 | event.preventDefault();
|
---|
7 |
|
---|
8 | const formData = new FormData(form);
|
---|
9 | const data = {};
|
---|
10 | let isValid = true;
|
---|
11 | let errorMessage = "";
|
---|
12 |
|
---|
13 | formData.forEach((value, key) => {
|
---|
14 | data[key] = value;
|
---|
15 | if (key === "departureDate") {
|
---|
16 | const today = new Date();
|
---|
17 | const departureDate = new Date(value);
|
---|
18 | if (departureDate <= today) {
|
---|
19 | isValid = false;
|
---|
20 | errorMessage += "Датумот на поаѓање е грешен!.\n";
|
---|
21 | }
|
---|
22 | }
|
---|
23 | if (key === "destination" && !value) {
|
---|
24 | isValid = false;
|
---|
25 | errorMessage += "Внесете дестинација.\n";
|
---|
26 | }
|
---|
27 | });
|
---|
28 |
|
---|
29 | if (!isValid) {
|
---|
30 | alert(errorMessage);
|
---|
31 | return;
|
---|
32 | }
|
---|
33 |
|
---|
34 | loadingOverlay.style.display = 'flex';
|
---|
35 |
|
---|
36 | fetch('/submit', {
|
---|
37 | method: 'POST',
|
---|
38 | headers: {
|
---|
39 | 'Content-Type': 'application/json'
|
---|
40 | },
|
---|
41 | body: JSON.stringify(data)
|
---|
42 | })
|
---|
43 | .then(response => {
|
---|
44 | if (!response.ok) {
|
---|
45 | throw new Error('Network response was not ok ' + response.statusText);
|
---|
46 | }
|
---|
47 | return response.json();
|
---|
48 | })
|
---|
49 | .then(data => {
|
---|
50 | loadingOverlay.style.display = 'none';
|
---|
51 | const dataList = document.getElementById('givenOptions');
|
---|
52 | dataList.innerHTML = '';
|
---|
53 |
|
---|
54 | if (data.length === 0) {
|
---|
55 | const wrapper = document.createElement('div');
|
---|
56 | const text = document.createElement('p');
|
---|
57 | text.textContent = "Не се пронајдени резултати за вашето пребарување!";
|
---|
58 | wrapper.appendChild(text);
|
---|
59 | dataList.appendChild(wrapper);
|
---|
60 | } else {
|
---|
61 | data.forEach(item => {
|
---|
62 | const optionDiv = document.createElement('div');
|
---|
63 | optionDiv.classList.add('option');
|
---|
64 |
|
---|
65 | const img = document.createElement('img');
|
---|
66 | img.classList.add('image');
|
---|
67 | img.src = item.imgSrc || '';
|
---|
68 | optionDiv.appendChild(img);
|
---|
69 | const wrapperDiv = document.createElement('div');
|
---|
70 | optionDiv.appendChild(wrapperDiv);
|
---|
71 |
|
---|
72 | const nameParagraph = document.createElement('p');
|
---|
73 | nameParagraph.id = 'name';
|
---|
74 | nameParagraph.textContent = item.hotelName || 'N/A';
|
---|
75 | wrapperDiv.appendChild(nameParagraph);
|
---|
76 |
|
---|
77 | const countryParagraph = document.createElement('p');
|
---|
78 | countryParagraph.id = 'country';
|
---|
79 | countryParagraph.style.fontSize = '20px';
|
---|
80 | countryParagraph.textContent = item.country || 'N/A';
|
---|
81 | wrapperDiv.appendChild(countryParagraph);
|
---|
82 |
|
---|
83 | const dateParagraph = document.createElement('h2');
|
---|
84 | dateParagraph.id = 'date';
|
---|
85 | dateParagraph.textContent = item.dateRange || 'N/A';
|
---|
86 | wrapperDiv.appendChild(dateParagraph);
|
---|
87 |
|
---|
88 | const peopleParagraph = document.createElement('p');
|
---|
89 | peopleParagraph.id = 'numPeople';
|
---|
90 | peopleParagraph.textContent = item.numPeople === 1 ? item.numPeople + " лице" : item.numPeople + " лица";
|
---|
91 | wrapperDiv.appendChild(peopleParagraph);
|
---|
92 |
|
---|
93 | const priceHeading = document.createElement('h1');
|
---|
94 | priceHeading.textContent = 'Цена:';
|
---|
95 | wrapperDiv.appendChild(priceHeading);
|
---|
96 | const priceParagraph = document.createElement('h2');
|
---|
97 | priceParagraph.id = 'price';
|
---|
98 | priceParagraph.textContent = (item.price || 0) + " EUR";
|
---|
99 | wrapperDiv.appendChild(priceParagraph);
|
---|
100 |
|
---|
101 | const infoDiv = document.createElement('div');
|
---|
102 | infoDiv.classList.add("infoDiv");
|
---|
103 | const typeRoom = document.createElement('p');
|
---|
104 | typeRoom.textContent = "Тип на соба: " + (item.type || 'N/A');
|
---|
105 | infoDiv.appendChild(typeRoom);
|
---|
106 | const plan = document.createElement('p');
|
---|
107 | plan.textContent = "Услуга: " + (item.board || 'N/A');
|
---|
108 | infoDiv.appendChild(plan);
|
---|
109 | const amenities = document.createElement('p');
|
---|
110 | amenities.textContent = item.amenities && item.amenities.length > 0 ? "Поволности: " + item.amenities : "Нема информации од агенцијата за вклучените поволности.";
|
---|
111 | infoDiv.appendChild(amenities);
|
---|
112 | optionDiv.appendChild(infoDiv);
|
---|
113 |
|
---|
114 | const changesDiv = document.createElement('div');
|
---|
115 | item.changes.forEach(change => {
|
---|
116 | const changeParagraph = document.createElement('p');
|
---|
117 | changeParagraph.textContent = change.attribute + " changed from " + change.oldValue + " to " + change.newValue;
|
---|
118 | changesDiv.appendChild(changeParagraph);
|
---|
119 | });
|
---|
120 | optionDiv.appendChild(changesDiv);
|
---|
121 |
|
---|
122 | const link = document.createElement('a');
|
---|
123 | link.id = 'link';
|
---|
124 | link.href = item.link || '#';
|
---|
125 | link.target = '_blank';
|
---|
126 |
|
---|
127 | const button = document.createElement('button');
|
---|
128 | button.classList.add('btn', 'login-button');
|
---|
129 | button.textContent = 'Линк до страна';
|
---|
130 | const btnWrapDiv = document.createElement('div');
|
---|
131 | btnWrapDiv.classList.add('btnWrapper');
|
---|
132 | const favBtn = document.createElement('button');
|
---|
133 | favBtn.classList.add('favBtn', 'btn');
|
---|
134 | favBtn.id = 'favBtnId';
|
---|
135 | favBtn.textContent = 'Додадете во омилени';
|
---|
136 | favBtn.setAttribute('data-option-id', item.id);
|
---|
137 | favBtn.addEventListener('click', function () {
|
---|
138 | const optionId = this.getAttribute('data-option-id');
|
---|
139 | saveFavoriteOption(optionId);
|
---|
140 | });
|
---|
141 |
|
---|
142 | btnWrapDiv.appendChild(link);
|
---|
143 | link.appendChild(button);
|
---|
144 | btnWrapDiv.appendChild(favBtn);
|
---|
145 |
|
---|
146 | optionDiv.appendChild(btnWrapDiv);
|
---|
147 | dataList.appendChild(optionDiv);
|
---|
148 | });
|
---|
149 | console.log('Finished processing data.');
|
---|
150 | }
|
---|
151 | updateFavoriteButtons();
|
---|
152 | })
|
---|
153 | .catch(error => {
|
---|
154 | console.error('Error fetching data:', error);
|
---|
155 | loadingOverlay.style.display = 'none';
|
---|
156 | });
|
---|
157 | });
|
---|
158 | });
|
---|