var rei_searchResult = false; document.addEventListener('DOMContentLoaded', (event) => { console.log("loaded");rei_showFoundProperties(); rei_prepareSearchForm(); }); function rei_showFoundProperties() { let propertyLists = document.querySelectorAll(".rei-properties-box"); for (listNo = 0; listNo < propertyLists.length; listNo++) { jsonVarName = propertyLists[listNo].getAttribute("rei-properties-holder"); showPagination = parseInt(propertyLists[listNo].getAttribute("rei-show-pagination")); // console.log("Rei show found properties: ", this[jsonVarName]) ; rei_showPropertiesList(this[jsonVarName], showPagination, propertyLists[listNo]); } } function rei_showPropertiesList(rei_searchResultJson, showPagination, targetDiv) { rei_searchResult = JSON.parse(rei_searchResultJson); if (!rei_searchResult) return; if (rei_searchResult.properties_order == undefined) { console.log("No properties order - properties not found?"); return;} if (rei_searchResult.error != undefined) { targetDiv.innerHTML = "
"+rei_searchResult.error+"
"; return; } if (rei_searchResult.message != undefined) document.getElementById("rei-search-result").innerHTML = "
"+rei_searchResult.message+"
"; let l = rei_searchlistGetTranslation; let newHtml = ""; if (showPagination) { newHtml += "
"; newHtml += "
"; newHtml += "

"+l("Search Result")+"

"+l("Found")+" "+rei_searchResult.nof_found+" "+l("Properties")+"

"; newHtml += "
"; newHtml += "
"; newHtml += "
"; newHtml += "
"; } newHtml += "
"; let lang = ""; if (location.href.match(/lang=/)) lang = "?lang="+location.href.replace(/.*lang\=([a-z][a-z]).*/, "$1"); console.log("LANG "+lang); for (propNo = 0; propNo < rei_searchResult.properties_order.length; propNo++) { // Properties let prop = rei_searchResult.properties[rei_searchResult.properties_order[propNo]]; newHtml += ""; newHtml += "
"; newHtml += "
"+prop.city+" ("+l(prop.type)+")
€"+prop.price.trim().replace(/([0-9])([0-9]{3})$/, "$1,$2").replace(/([0-9])([0-9]{3})[,]/, "$1,$2,").replace(/([0-9])([0-9]{3})[,]/, "$1,$2,")+"
"; let rooms = ""; if (prop.bedrooms != undefined && prop.bedrooms.length > 0 && prop.type != "Plot") rooms += ","+prop.bedrooms+" "+l('bedrooms'); if (prop.bathrooms != undefined && prop.bathrooms.length > 0 && prop.type != "Plot") rooms += ","+prop.bathrooms+" "+l('bathrooms'); if (prop.built_area != undefined && prop.built_area.length > 0 && prop.type != "Plot") rooms += ","+prop.built_area+" m²"; if (prop.plot_area != undefined && prop.plot_area.length > 0 && prop.type == "Plot") rooms += ","+prop.plot_area+" m²"; newHtml += "
"+rooms.replace(/^,/, "")+"
"; newHtml += "
"; } newHtml += '
'; if (showPagination) { newHtml += "
"; let curUrlWoPage = rei_searchResult.url.replace("/(&|\?)resultpage=[0-9]*/", "").replace(/&+$/, "").replace(/\?$/, ""); console.log(curUrlWoPage) if (rei_searchResult.page != 1) newHtml += "«"; for (pageNo = Math.max(1, rei_searchResult.page-3); pageNo <= Math.min(rei_searchResult.page+3, rei_searchResult.nof_pages); pageNo++) { if (pageNo == rei_searchResult.page) newHtml += ""+pageNo+""; else { newHtml += ""+pageNo+""; } } if (rei_searchResult.nof_pages > 0 && rei_searchResult.page != rei_searchResult.nof_pages) newHtml += "»"; newHtml += "
"; } targetDiv.innerHTML += newHtml; console.log("Show properties list", rei_searchResult); } function rei_prepareSearchForm() { let multiSelectDisplays = document.querySelectorAll(".rei-multiselect-display"); for (mulNo = 0; mulNo < multiSelectDisplays.length; mulNo++) { multiSelectDisplays[mulNo].addEventListener("click", (event) => {rei_toggleMultiSelect(event.target);}); startSels = multiSelectDisplays[mulNo].querySelectorAll(".rei-multiselect-display-selected"); for (selNo = 0; selNo < startSels.length; selNo++) startSels[selNo].addEventListener("click", (event) => {event.stopPropagation();event.preventDefault();rei_unselectMultiOption(event.target);}); } let multiSelectOptions = document.querySelectorAll(".rei-multiselect-options .rei-option"); for (mulNo = 0; mulNo < multiSelectOptions.length; mulNo++) { multiSelectOptions[mulNo].addEventListener("click", (event) => {rei_selectMultiOption(event.target);}); } let multiSelectInputs = document.querySelectorAll(".rei-input-multiselect input"); console.log(multiSelectInputs) for (mulNo = 0; mulNo < multiSelectInputs.length; mulNo++) { console.log(multiSelectInputs[mulNo].value) let mulDis = multiSelectInputs[mulNo].parentNode.querySelector(".rei-multiselect-display"); mulDis.className = mulDis.className.replace("rei-something-selected", "").replace(/ /, ""); if (multiSelectInputs[mulNo].value.length > 0) mulDis.className += " rei-something-selected"; } // console.log("DDDDDDDD", multiSelectOptions); let dependentSelects = [{name: "region", dependents: ["city", "suburb", "urbanization"]}, {name: "city", dependents: ["suburb", "urbanization"]}, {name: "suburb", dependents: ["urbanization"]}]; for (depNo = 0; depNo < dependentSelects.length; depNo++) { let selects = document.getElementsByName(dependentSelects[depNo].name); for (selNo = 0; selNo < selects.length; selNo++) { if (selects[selNo].tagName != "SELECT") continue; rei_cloneSelect(selects[selNo], "rei-"+dependentSelects[depNo].name+"-clone"); } } for (depNo = 0; depNo < dependentSelects.length; depNo++) { let selects = document.getElementsByName(dependentSelects[depNo].name); for (selNo = 0; selNo < selects.length; selNo++) { // console.log("Setting dependent select (init): "+selects[selNo].getAttribute("name")) ; if (selects[selNo].tagName != "SELECT") continue; selects[selNo].rei_leads = dependentSelects[depNo].name; selects[selNo].rei_dependents = dependentSelects[depNo].dependents; selects[selNo].onchange = function(e) { let selValue = e.target.options[e.target.selectedIndex].value; rei_showHideOptions(e.target.rei_dependents, "rei-"+e.target.rei_leads, selValue); } let curValue = selects[selNo].options[selects[selNo].selectedIndex].value; rei_showHideOptions(selects[selNo].rei_dependents, "rei-"+selects[selNo].rei_leads, curValue, true); } } rei_showClearFiltersButtons(); rei_showSortButton(); } function rei_showHideOptions(targetNames, attribute, value, keepDependentValue = false) { // console.log("Showhide",targetNames, attribute, value); let targets = []; for (tNo = 0; tNo < targetNames.length; tNo++) { let els = document.getElementsByName(targetNames[tNo]).entries(); for (let [k, el] of els) targets.push(el); } for (tNo = 0; tNo < targets.length; tNo++) { if (targets[tNo].tagName != "SELECT") continue; let curValue = targets[tNo].options[targets[tNo].selectedIndex].value; for (optNo = targets[tNo].options.length-1; optNo >= 1; optNo--) targets[tNo].removeChild(targets[tNo].options[optNo]); let clone = document.getElementById("rei-"+targets[tNo].name+"-clone"); let selectedIndex = 0; for (optNo = 1; optNo < clone.options.length; optNo++) { if (value.length == 0 || clone.options[optNo].getAttribute(attribute) == value) { if (clone.value == curValue) clone.setAttribute("selected", "selected"); else clone.removeAttribute("selected"); targets[tNo].appendChild(clone.options[optNo].cloneNode(true)); } } if (!keepDependentValue) { targets[tNo].selectedIndex = selectedIndex; targets[tNo].options[selectedIndex].setAttribute("selected", "selected"); } } } function rei_searchlistGetTranslation(textToTranslate) { return rei_getTranslation(textToTranslate, 'searchlist'); } function rei_toggleMultiSelect(clickedMulti) { if (clickedMulti.parentNode.parentNode.className.match(/rei-active/)) clickedMulti.parentNode.parentNode.className = clickedMulti.parentNode.parentNode.className.replace(/rei-active/, "").replace(/ /, ""); else clickedMulti.parentNode.parentNode.className += " rei-active"; } function rei_selectMultiOption(clickedOption) { let preval = clickedOption.parentNode.parentNode.querySelector("input").value; clickedOption.parentNode.parentNode.querySelector("input").value = preval + (preval.length > 0 ? "," : "") + clickedOption.getAttribute("rei-value"); clickedOption.style.display = "none"; dispSel = document.createElement("span"); dispSel.innerText = clickedOption.innerText; dispSel.className="rei-multiselect-display-selected"; dispSel.setAttribute("rei-value", clickedOption.getAttribute("rei-value")); let selDisp = clickedOption.parentNode.parentNode.querySelector(".rei-multiselect-display"); selDisp.appendChild(dispSel); console.log("ADD",selDisp.className) selDisp.className += (selDisp.className.indexOf("rei-something-selected") >= 0 ? "" : " rei-something-selected"); console.log("ADDED",selDisp.className) dispSel.addEventListener("click", (event) => {event.stopPropagation();event.preventDefault();rei_unselectMultiOption(event.target);}); } function rei_unselectMultiOption(clickedOption) { let inp = clickedOption.parentNode.parentNode.querySelector("input"); inp.value = inp.value.replace(clickedOption.getAttribute("rei-value"), "").replace(/^,/, "").replace(/,,/, ",").replace(/,$/, ""); let dispSel = inp.parentNode.querySelector(".rei-multiselect-display"); console.log("DEL",dispSel.className.replace("rei-something-selected", "")) if (inp.value.length == 0) dispSel.className = dispSel.className.replace("rei-something-selected", "").replace(/ /, ""); console.log("DELETED",dispSel.className) let opts = clickedOption.parentNode.parentNode.querySelectorAll(".rei-option"); for (const opt of opts) { if (opt.getAttribute("rei-value") == clickedOption.getAttribute("rei-value")) opt.style.display = "block"; } clickedOption.remove(); } function rei_cloneSelect(selectToClone, cloneId) { if (document.getElementById(cloneId) != null) return; let selClone = selectToClone.cloneNode(true); selClone.id = cloneId; selClone.name = ""; // selClone.style.display = "none"; document.body.appendChild(selClone); } function rei_showClearFiltersButtons() { let clearFiltersContainer = document.getElementById("rei-clear-filters"); if (clearFiltersContainer == null) return; let query = location.href.split("?"); if (query.length < 2) return; let l = rei_searchlistGetTranslation; query = query[1].split("&"); console.log(query); for (qNo = 0; qNo < query.length; qNo++) { let param = query[qNo].split("="); if (param.length < 2 || param[1].length == 0 || param[1] == 0) continue; let link = location.href.split("?")[0]+"?"; for (qN2 = 0; qN2 < query.length; qN2++) { let p2 = query[qN2].split("="); link += p2[0]+"="+((p2[1] != undefined && p2[1].length != 0 && p2[0] != param[0]) ? p2[1] : "")+"&"; } htmlToAdd = ""; console.log("P1",param[0],":",param[1]) if (param[0] == "new_development") htmlToAdd += (param[1] == -1 ? l("Exclude new developments") : l("Only new developments")); else if (param[0] == "minprice") htmlToAdd += l("From")+" "+param[1]+"€"; else if (param[0] == "maxprice") htmlToAdd += l("To")+" "+param[1]+"€"; else if (param[0] == "minbedrooms") htmlToAdd += l("From")+" "+param[1]+" "+(param[1] == 1 ? l("bedroom") : l("bedrooms")); else if (param[0] == "maxbedrooms") htmlToAdd += l("To")+" "+param[1]+" "+(param[1] == 1 ? l("bedroom") : l("bedrooms")); else if (param[0] == "features") htmlToAdd += param[1].replace(",", ", ").replace("%2C", ", "); else htmlToAdd += param[1]; htmlToAdd += ""; clearFiltersContainer.innerHTML += htmlToAdd; } } function rei_showSortButton() { let resultSortContainer = document.getElementById("rei-search-sort"); if (resultSortContainer == null) return; let l = rei_searchlistGetTranslation; let usingSort = false; let query = location.href.split("?"); if (query.length > 2) query[1] = query.slice(1).join("?"); if (query.length = 2) { q2 = query[1].split("&"); newQuery = [query[0]]; nQ2 = []; for (qNo = 0; qNo < q2.length; qNo++) { q3 = q2[qNo].split("="); if (q3[0] == "sort") { usingSort = q3[1]; continue; } nQ2.push(q2[qNo]); } newQuery.push(nQ2.join("&")); newQuery = newQuery.join("?"); } else newQuery = location.href; console.log(newQuery); console.log(usingSort); tag = (!usingSort ? "span" : "a"); sortButtons = "<"+tag+" "+(tag == "a" ? ("href='"+newQuery+"'") : "")+">"+l("Newest")+""; tag = (usingSort == "price_asc" ? "span" : "a"); sortButtons += "<"+tag+" "+(tag == "a" ? ("href='"+newQuery+"&sort=price_asc'") : "")+">"+l("Cheapest")+""; tag = (usingSort == "price_desc" ? "span" : "a"); sortButtons += "<"+tag+" "+(tag == "a" ? ("href='"+newQuery+"&sort=price_desc'") : "")+">"+l("Most expensive")+""; resultSortContainer.innerHTML += sortButtons; resultSortContainer.querySelector("span").addEventListener("click", (event) => { rei_toggleClass(event.target.parentNode, "rei-active"); }) }