Berkarar/themes/berkarar/assets/js/customSelect.js

373 lines
12 KiB
JavaScript
Raw Normal View History

2022-08-28 19:50:26 +00:00
var x, i, j, l, ll, selElmnt, a, b, c;
function initializeCustomSelect() {
x = document.getElementsByClassName("custom-select");
l = x.length;
for (i = 0; i < l; i++) {
selElmnt = x[i].getElementsByTagName("select")[0];
2024-03-16 06:24:27 +00:00
2022-08-28 19:50:26 +00:00
var onSelectFunc = x[i].getAttribute('onCustomSelect')
ll = selElmnt.length;
if (x[i].querySelectorAll('.select-selected').length == 0) {
a = document.createElement("DIV");
a.setAttribute("class", "select-selected");
a.setAttribute('onCustomSelect', onSelectFunc);
a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML;
x[i].appendChild(a);
b = document.createElement("DIV");
b.setAttribute("class", "select-items select-hide");
for (j = 1; j < ll; j++) {
c = document.createElement("DIV");
c.innerHTML = selElmnt.options[j].innerHTML;
c.addEventListener("click", function (e) {
var y, i, k, s, h, sl, yl;
s = this.parentNode.parentNode.getElementsByTagName("select")[0];
2024-03-16 06:24:27 +00:00
// console.log(s);
// console.log(s);
2022-08-28 19:50:26 +00:00
sl = s.length;
h = this.parentNode.previousSibling;
for (i = 0; i < sl; i++) {
if (s.options[i].innerHTML == this.innerHTML) {
s.selectedIndex = i;
2024-03-16 06:24:27 +00:00
// console.log(s.options[i]);
// for (var j = 0; j < s.options.length; j++) {
// s.options[j].removeAttribute("selected");
// }
// s.options[i].setAttribute("selected", "selected");
// console.log(s.options[i]);
2024-04-05 12:41:28 +00:00
// handleChange(s.selectedIndex, 'shops');
handleChange(s.selectedIndex, s.name);
2024-03-16 06:24:27 +00:00
2022-08-28 19:50:26 +00:00
h.innerHTML = this.innerHTML;
y = this.parentNode.getElementsByClassName("same-as-selected");
yl = y.length;
for (k = 0; k < yl; k++) {
y[k].removeAttribute("class");
}
this.setAttribute("class", "same-as-selected");
break;
}
}
h.click();
});
b.appendChild(c);
}
x[i].appendChild(b);
a.addEventListener("click", function (e) {
e.stopPropagation();
if (!this.nextSibling.classList.contains('select-hide') && this.getAttribute('onCustomSelect') != 'null') {
window[this.getAttribute('onCustomSelect')](this.parentNode.parentNode.getElementsByTagName("select")[0].value, this.parentNode);
}
closeAllSelect(this);
this.nextSibling.classList.toggle("select-hide");
this.classList.toggle("select-arrow-active");
});
}
}
}
function closeAllSelect(elmnt) {
/* A function that will close all select boxes in the document,
except the current select box: */
var x,
y,
i,
xl,
yl,
arrNo = [];
x = document.getElementsByClassName("select-items");
y = document.getElementsByClassName("select-selected");
xl = x.length;
yl = y.length;
for (i = 0; i < yl; i++) {
if (elmnt == y[i]) {
arrNo.push(i);
} else {
y[i].classList.remove("select-arrow-active");
}
}
for (i = 0; i < xl; i++) {
if (arrNo.indexOf(i)) {
x[i].classList.add("select-hide");
}
}
}
/* If the user clicks anywhere outside the select box,
then close all select boxes: */
document.addEventListener("click", closeAllSelect);
initializeCustomSelect();
2024-03-16 06:24:27 +00:00
2024-04-05 12:41:28 +00:00
// **************************************************
// function afterUpdate1() {
// console.log("runned my function");
// var itemsPerPage = 1;
// var currentPage = 0;
// var items = document.querySelectorAll(".shops_item_data");
// var totalPages = Math.ceil(items.length / itemsPerPage);
// var nextButton = document.querySelector(".next-button");
// var prevButton = document.querySelector(".prev-button");
// var pageInput = document.querySelector(".input_page");
// var paginationBlock = document.querySelector("#all_pagination");
// // Initially hide all items except the first page
// for (var i = itemsPerPage; i < items.length; i++) {
// items[i].style.display = "none";
// }
// updatePagination();
// prevButton.addEventListener("click", function () {
// if (currentPage > 0) {
// currentPage--;
// updatePagination();
// }
// });
// nextButton.addEventListener("click", function () {
// if (currentPage < totalPages - 1) {
// currentPage++;
// updatePagination();
// }
// });
// function updatePagination() {
// var startIndex = currentPage * itemsPerPage;
// var endIndex = startIndex + itemsPerPage;
// for (var i = 0; i < items.length; i++) {
// if (i >= startIndex && i < endIndex) {
// items[i].style.display = "block";
// } else {
// items[i].style.display = "none";
// }
// }
// if(pageInput.value != null)
// {
// pageInput.value = currentPage + 1; // Update input field value
// }
// }
// };
// function afterUpdate2() {
// var itemsPerPage = 9;
// var currentPage = 0;
// var items = document.querySelectorAll("#rentals .shops_item");
// var totalPages = Math.ceil(items.length / itemsPerPage);
// var nextButton = document.querySelector("#rentals_pagination .next-button");
// var prevButton = document.querySelector("#rentals_pagination .prev-button");
// var pageInput = document.querySelector("#rentals_pagination .input_page");
// var paginationBlock = document.querySelector("#rentals_pagination");
// // Initially hide all items except the first page
// for (var i = itemsPerPage; i < items.length; i++) {
// items[i].style.display = "none";
// }
// updatePagination();
// prevButton.addEventListener("click", function () {
// if (currentPage > 0) {
// currentPage--;
// updatePagination();
// }
// });
// nextButton.addEventListener("click", function () {
// if (currentPage < totalPages - 1) {
// currentPage++;
// updatePagination();
// }
// });
// function updatePagination() {
// var startIndex = currentPage * itemsPerPage;
// var endIndex = startIndex + itemsPerPage;
// for (var i = 0; i < items.length; i++) {
// if (i >= startIndex && i < endIndex) {
// items[i].style.display = "block";
// } else {
// items[i].style.display = "none";
// }
// }
// console.log(items.length);
// if(pageInput.value != null)
// {
// pageInput.value = currentPage + 1; // Update input field value
// }
// }
// };
// function afterUpdate3() {
// var itemsPerPage = 9;
// var currentPage = 0;
// var items = document.querySelectorAll("#sales .shops_item");
// var totalPages = Math.ceil(items.length / itemsPerPage);
// var nextButton = document.querySelector("#sales_pagination .next-button");
// var prevButton = document.querySelector("#sales_pagination .prev-button");
// var pageInput = document.querySelector("#sales_pagination .input_page");
// var paginationBlock = document.querySelector("#sales_pagination");
// // Initially hide all items except the first page
// for (var i = itemsPerPage; i < items.length; i++) {
// items[i].style.display = "none";
// }
// updatePagination();
// prevButton.addEventListener("click", function () {
// if (currentPage > 0) {
// currentPage--;
// updatePagination();
// }
// });
// nextButton.addEventListener("click", function () {
// if (currentPage < totalPages - 1) {
// currentPage++;
// updatePagination();
// }
// });
// function updatePagination() {
// var startIndex = currentPage * itemsPerPage;
// var endIndex = startIndex + itemsPerPage;
// for (var i = 0; i < items.length; i++) {
// if (i >= startIndex && i < endIndex) {
// items[i].style.display = "block";
// } else {
// items[i].style.display = "none";
// }
// }
// if(pageInput.value != null)
// {
// pageInput.value = currentPage + 1; // Update input field value
// }
// }
// };
// function afterUpdate4() {
// // Initially hide all pagination buttons except the one for the active tab
// var allPagination = document.querySelector('.shops_block_all_pagination');
// var rentalsPagination = document.querySelector('.shops_block_rentals_pagination');
// var salesPagination = document.querySelector('.shops_block_sales_pagination');
// allPagination.style.display = "inline-flex";
// rentalsPagination.style.display = "none";
// salesPagination.style.display = "none";
// // Handle click events on tab links
// var tabLinks = document.querySelectorAll('.shops_tab-link');
// // console.log(tabLinks);
// tabLinks.forEach(function(tabLink) {
// tabLink.addEventListener('click', function() {
// // Remove 'active' class from all tab links
// tabLinks.forEach(function(link) {
// link.classList.remove('active');
// });
// // Add 'active' class to the clicked tab link
// tabLink.classList.add('active');
// // Hide all pagination buttons
// allPagination.style.display = "none";
// rentalsPagination.style.display = "none";
// salesPagination.style.display = "none";
// // Get the data-tab attribute value of the clicked tab link
// var tabId = tabLink.getAttribute('data-tab');
// console.log(tabId + '_pagination');
// document.querySelector(tabId + '_pagination').style.display = "inline-flex";
// });
// });
// };
// **********************************************************************************************
function handleChange(selectElement,type) {
var floorID = selectElement;
if(type == 'shops')
{
console.log("Selected type:", type);
$.request('onUpdate', {
data: { floorID: floorID },
update: {
'home/shop_item': '#rest-all',
'home/pagination': '#pagination-container'
}
});
}
if(type == 'rentals_and_sales'){
console.log("Selected type:", type);
$.request('onUpdate', {
data: { floorID: floorID },
update: {
'home/rentals_and_sales/rentals_and_sales': '#all',
'home/rentals_and_sales/rentals': '#rentals',
'home/rentals_and_sales/sales': '#sales',
'home/rentals_and_sales/js_code': '#js_code',
},
complete: function(data) {
afterPartialUpdate();
}
});
}
2024-03-16 06:24:27 +00:00
return false;
}
2024-04-05 12:41:28 +00:00
// complete: function(data) {
// // console.log("hi");
// }
// complete: function(data) {
// // This code runs after the first AJAX request is completed
// $.request('refreshOtherPartial', {
// update: {
// 'other/partial': '#otherPartial'
// },
// complete: function(data) {
// // This code runs after the second AJAX request is completed
// console.log("Other partial refreshed");
// }
// });
// }