var rei_property = false; function rei_showPropertyDetails() { rei_property = JSON.parse(rei_propertyJson); console.log(rei_property); if (!rei_property) return; if (rei_property.error != undefined) { document.getElementById("rei-property-container").innerHTML = "
"+rei_property.error+"
"; return; } if (rei_property.message != undefined) document.getElementById("rei-property-container").innerHTML = "
"+rei_property.message+"
"; let l = rei_detailsGetTranslation; var rei_property_hasMap = (rei_has_floatval(rei_property, "longitude") && rei_has_floatval(rei_property, "latitude")); let newHtml = "
"; newHtml += "
"; newHtml += "
"; newHtml += "
"+l("Info")+""+ ((rei_property.video != undefined && rei_property.video.length > 0) ? (""+l("Video")+"") : "")+ ((rei_property.helicopter_view != undefined && rei_property.helicopter_view.length > 0) ? (""+l("360° view")+"") : "")+ ((rei_property.virtual_tour != undefined && rei_property.virtual_tour.length > 0) ? (""+l("Virtual Tour")+"") : "")+ ""+l("Images")+""+ ""+l("Location")+""+l("Contact")+"
"; newHtml += " "; newHtml += "
"; newHtml += "
"; newHtml += "

"+l(rei_property.type)+" "+l("in")+" "+rei_property.city+"

"; newHtml += "

€"+rei_property.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,")+"

"; newHtml += "

"+rei_property.description+"

"; newHtml += "
"; newHtml += "
"; newHtml += "
"+l("Location")+": "+rei_property.city+"
"; newHtml += "
"+l("Ref no")+": "+rei_property.reference+"
"; newHtml += "
"+l("Type")+": "+(typeof rei_property.subtype == "string" ? rei_property.subtype : rei_property.type)+"
"; newHtml += "
"+l("Bedrooms")+": "+rei_property.bedrooms+"
"; newHtml += "
"+l("Bathrooms")+": "+rei_property.bathrooms+"
"; newHtml += "
"+l("Size")+": "+rei_property.built_area+"m²
"; newHtml += (rei_property.plot_area != undefined && rei_property.plot_area.length > 0) ? "
"+l("Plot size")+": "+rei_property.plot_area+"m²
" : ""; newHtml += "
"; newHtml += "
"; newHtml += "
"; newHtml += " "; newHtml += "
"; if (rei_property.video != undefined && rei_property.video.length > 0) { newHtml += "

"+l("Video")+"

"; let videoUrl = rei_property.video; if (videoUrl.match(/^https?:\/\/youtu.be\//)) newHtml += "
"; else if (videoUrl.match(/^https?:\/\/youtube.com\//)) newHtml += "
"; } if (rei_property.virtual_tour != undefined && rei_property.virtual_tour.length > 0) { newHtml += "

"+l("Virtual Tour")+"

"; newHtml += "
"; } if (rei_property.helicopter_view != undefined && rei_property.helicopter_view.length > 0) { newHtml += "

"+l("360° view")+"

"; newHtml += "
"; } newHtml += "

"+l("Images")+"

"; newHtml += "
"; rei_property.images = []; for (imgNo = 0; imgNo < rei_property.image_urls; imgNo++) { if (imgNo < 5) newHtml += "
"; rei_property.images.push(rei_property["image_url_"+imgNo]); } newHtml += "
"; newHtml += "
"; let features = rei_extract_features(rei_property); console.log(features); newHtml += "

"+l("Property information")+"

"; if (rei_has_intval(rei_property, "construction_year")) newHtml += "

"+l("Built Year")+"

"+rei_property.construction_year+"

"; if (rei_has_intval(rei_property, "pool")) { newHtml += "

"+l("Pool")+"

"+(features.pool ? l(features.pool) : l("Yes"))+"

"; } if (features.garden) newHtml += "

"+l("Garden")+"

"+features.garden+"

"; if (features.orientation) newHtml += "

"+l("Orientation")+"

"+features.orientation+"

"; if (features.lift) newHtml += "

"+l("Lift")+"

"+features.lift+"

"; if ((features.pool || features.garden || features.orientation || features.lift) && (rei_has_intval(rei_property, "community_fee") || rei_has_intval(rei_property, "ibi") || rei_has_intval(rei_property, "garbage_fee")) ) newHtml += "
"; if (rei_has_intval(rei_property, "community_fee")) newHtml += "

"+l("Community Fee")+"

€"+Math.round(parseInt(rei_property.community_fee)/12)+" /"+l("mon")+"

"; if (rei_has_intval(rei_property, "ibi")) newHtml += "

"+l("Property Tax (IBI)")+"

€"+rei_property.ibi+" /"+l("year")+"

"; if (rei_has_intval(rei_property, "garbage_fee")) newHtml += "

"+l("Garbage Fee")+"

€"+rei_property.garbage_fee+" /"+l("year")+"

"; newHtml += "
"; newHtml += "
"; newHtml += "

"+l("Location")+"

"; newHtml += "
"; newHtml += "
"; newHtml += "
"; // for (propNo = 0; propNo < rei_property.properties_order.length; propNo++) { // // Properties // let prop = rei_property.properties[rei_property.properties_order[propNo]]; // newHtml += ""; // newHtml += "
"; // newHtml += "
"+prop.city+" ("+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+" bedrooms"; // if (prop.bathrooms != undefined && prop.bathrooms.length > 0 && prop.type != "Plot") rooms += ","+prop.bathrooms+" 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 += '
'; document.getElementById("rei-property-container").innerHTML += newHtml; let contForm = document.getElementById("rei-property-contact"); document.getElementById("rei-propertypage-content").insertBefore(contForm,document.getElementById("rei-property-features")); let els = document.getElementById("rei-property-images").children; for (elNo = 0; elNo < els.length; elNo++) { els.item(elNo).addEventListener('click', (e) => { let t = e.target; if(t.tagName.toUpperCase() == "IMG") { t = t.parentElement;} rei_estate_startSlideshow(parseInt(t.getAttribute("rei-image-no"))+1); return false;} ); } document.getElementById("rei-more-imgs").addEventListener('click', () => { rei_estate_startSlideshow(1); return false;}); contForm.style.display = "block"; if (rei_property_hasMap) { // Load Google Map! var script = document.createElement("script") script.type = "text/javascript"; // script.onload = function(){ callback(); }; script.src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyC9BNOWsIOW90zntkUhZazhQGpyIsy_qRg&callback=rei_estatecds_initMap"; document.getElementsByTagName("head")[0].appendChild(script); } let ytVid = document.querySelector("#rei-yt-player"); if (ytVid != null && ytVid.getAttribute("rei-yt-id") != null) { // var tag = document.createElement('script'); // tag.src = "https://www.youtube.com/player_api"; // var firstScriptTag = document.getElementsByTagName('script')[0]; // firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); let ytIframe = document.createElement("iframe"); ytIframe.setAttribute("src", "https://www.youtube.com/embed/" + ytVid.getAttribute("rei-yt-id") + "?autoplay=0&autohide=1&border=0&wmode=opaque&enablejsapi=1"); ytIframe.style.width = ytVid.style.width; ytIframe.style.height = ytVid.style.height; ytVid.appendChild(ytIframe); } } var rei_map; function rei_estatecds_initMap() { let mapholder = document.getElementById('rei-map-box'); let lat = parseFloat(mapholder.getAttribute('rei-map-lat')); let lng = parseFloat(mapholder.getAttribute('rei-map-lng')); if (isNaN(lat) || isNaN(lng) ) { console.log("LAT or LANG of map not numbers.");return; } rei_map = new google.maps.Map(mapholder, { center: {lat: lat, lng: lng}, zoom: 14, mapTypeId: 'satellite', disableDefaultUI: false }); rei_mapCircle = new google.maps.Circle({ center: new google.maps.LatLng(lat,lng), radius: 400, strokeColor: 'transparent', fillColor: '#00aedb', fillOpacity: 0.3 }); rei_mapCircle.setMap(rei_map); } function rei_estate_startSlideshow(imgNoToShow) { let slideshowOverlay = document.getElementById("rei-slideshow-overlay"); let currentImg = false; if (slideshowOverlay == null) { // Create slideshow if (typeof rei_property == 'undefined' || !rei_property) { console.log("No data"); return;} let imgs = rei_property.images; // console.log(slideshowOverlay.innerHTML); slideshowImagesSlider = document.createElement('div'); slideshowImagesSlider.className = 'rei-slideshow-imagesslider'; slideshowImagelist = document.createElement('div'); slideshowImagelist.className = 'rei-slideshow-imagelist'; slideshowImagelist.setAttribute("id", "rei-slideshow-imagelist"); let onScreen = imgs[0]; for (imgNo = 0; imgNo < imgs.length; imgNo++) { let i = document.createElement('img'); i.setAttribute("src", imgs[imgNo]); i.setAttribute("rei-img-no", imgNo+1); i.addEventListener("click", (e) => { rei_vitecapi_moveto(parseInt(e.target.getAttribute("rei-img-no"))); }); slideshowImagelist.appendChild(i); } slideshowOverlay = document.createElement('div'); slideshowOverlay.setAttribute("id", 'rei-slideshow-overlay'); slideshowOverlay.innerHTML = '

'+imgNoToShow+'/'+imgs.length+'

'; slideshowImagesSlider.appendChild(slideshowImagelist); slideshowOverlay.appendChild(slideshowImagesSlider); document.body.appendChild(slideshowOverlay); document.getElementById("rei-slideshow-next").addEventListener("click", (e) => { let t = e.target; while(!t.tagName.match(/^p$/i)) { t=t.parentElement; } rei_vitecapi_moveto(parseInt(t.getAttribute("rei-next-no"))); return false; }, false); document.getElementById("rei-slideshow-previous").addEventListener("click", (e) => {let t = e.target; while(!t.tagName.match(/^p$/i)) { t=t.parentElement; } rei_vitecapi_moveto(parseInt(t.getAttribute("rei-prev-no"))); return false; }, false); document.getElementById("rei-img-close").addEventListener("click", () => { document.getElementById("rei-slideshow-overlay").className = ""; }); } rei_vitecapi_moveto(imgNoToShow); slideshowOverlay.className = "rei-active"; } function rei_vitecapi_moveto(imageNo) { let imgs = document.getElementById("rei-slideshow-imagelist").children; if (imageNo < 1 || imageNo > imgs.length) return false; let offset = 0; for (imgNo = 0; imgNo < imgs.length; imgNo++) { imgs[imgNo].className = ""; if (imgNo < imageNo-2) offset += 6+imgs[imgNo].getBoundingClientRect().width; } offset = Math.max(0, offset); let onScreen = document.getElementById("rei-onscreen"); onScreen.setAttribute("src", imgs[imageNo-1].getAttribute("src")); imgs[imageNo-1].className = "rei-active"; let counter = document.getElementById("rei-img-counter"); counter.innerHTML = counter.innerHTML.replace(/^([0-9]+)\//, ""+imgs[imageNo-1].getAttribute("rei-img-no")+"/"); document.getElementById("rei-slideshow-next").setAttribute("rei-next-no", imageNo+1); document.getElementById("rei-slideshow-previous").setAttribute("rei-prev-no", imageNo-1); document.getElementById("rei-slideshow-previous").className = (imageNo <= 1) ? "rei-inactive" : ""; document.getElementById("rei-slideshow-next").className = (imageNo > imgs.length) ? "rei-inactive" : ""; if (imageNo <= 1) document.getElementById("rei-slideshow-previous").className = "rei-inactive"; if (imageNo >= imgs.length) document.getElementById("rei-slideshow-next").className = "rei-inactive"; document.getElementById("rei-slideshow-imagelist").style.marginLeft = "-"+offset+"px"; } function rei_detailsGetTranslation(textToTranslate) { return rei_getTranslation(textToTranslate, 'detailspage'); // if (typeof textToTranslate != "string") return ""; // if (rei_detailspage_translations == undefined || rei_detailspage_translations[textToTranslate] == undefined) return textToTranslate; // return rei_detailspage_translations[textToTranslate]; } function onYouTubePlayerAPIReady() { console.log("OOOOOOOOOOOOON") let ytVid = document.querySelector(".rei-yt-player"); if (ytVid == null) return; let vidId = ytVid.getAttribute("rei-yt-id"); if (vidId == null || vidId == "") { console.log("YT video missing youtube id"); return; } player = new YT.Player('rei-yt-player', { playerVars: { 'autoplay': 0, 'controls': 1, 'autohide':1, 'wmode':'opaque', 'rel': 0, 'modestbranding': 1, 'loop': 1 }, videoId: vidId, height: document.getElementById('rei-yt-player').offsetHeight, width: document.getElementById('rei-yt-player').offsetWidth, events: { 'onReady': rei_propertyVideo_onPlayerReady} }); } function rei_onYouTubePlayerAPIReady() { let ytVid = document.querySelector(".rei-yt-player"); if (ytVid == null) return; let vidId = ytVid.getAttribute("rei-yt-id"); if (vidId == null || vidId == "") { console.log("YT video missing youtube id"); return; } player = new YT.Player('rei-yt-player', { playerVars: { 'autoplay': 1, 'controls': 1, 'autohide':1, 'wmode':'opaque', 'rel': 0, 'modestbranding': 1, 'loop': 1 }, videoId: vidId, height: document.getElementById('rei-yt-player').offsetHeight, width: document.getElementById('rei-yt-player').offsetWidth, events: { 'onReady': rei_propertyVideo_onPlayerReady} }); } function rei_propertyVideo_onPlayerReady(event) { event.target.mute(); } function rei_extract_features(property) { featNo = 0; let features = {parking: false, garden: false, pool: false, orientation: false, lift: false} let l=rei_detailsGetTranslation; while (rei_has_strval(property, "feature_"+featNo)) { if (property["feature_"+featNo].match(/.* facing$/)) features.orientation = (features.orientation ? (features.orientation+", ") : "")+l(property["feature_"+featNo].replace(/ facing$/, "")); if (property["feature_"+featNo].match(/^Garage$/)) features.parking = (features.parking ? (features.parking+", ") : "")+l("Garage"); if (property["feature_"+featNo].match(/.* parking$/)) features.parking = (features.parking ? (features.parking+", ") : "")+property["feature_"+featNo]; if (property["feature_"+featNo].match(/^Lift$/)) features.lift = l("Yes"); if (property["feature_"+featNo].match(/.* garden$/)) features.garden = (features.garden ? (features.garden+", ") : "")+property["feature_"+featNo].replace(/ garden$/, ""); if (property["feature_"+featNo].match(/.*pool.*$/) && !property["feature_"+featNo].match(/.*view.*$/) && !property["feature_"+featNo].match(/.*room for.*$/)) features.pool = (features.pool ? (features.pool+", ") : "")+l(property["feature_"+featNo].replace(/ ?pool/i, "")); featNo++; } return features; } function rei_has_intval(obj, name) { return (obj[name] != undefined && obj[name] != null && obj[name] != 0); } function rei_has_floatval(obj, name) { console.log("FLVAL",obj,name,""+obj[name]) return (obj[name] != undefined && obj[name] != null && !(""+obj[name]).match(/^0\.?0*$/)); } function rei_has_strval(obj, name) { return (obj[name] != undefined && obj[name] != null && obj[name] != ""); }