93 lines
2.7 KiB
Plaintext
93 lines
2.7 KiB
Plaintext
|
<article class="s-space show-space">
|
||
|
|
<h3 class="s-space__apartment-name">{{floor-title}}</h3>
|
||
|
|
<div class="s-space__apartment-layout">
|
||
|
|
{{floor-layout}}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- <div class="s-space__floor-img-small">
|
||
|
|
<img class="img-btn" src="{{floor-frontend-image-thumb}}" alt="{{image-alt}}">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="s-space__floor-img-large">
|
||
|
|
<img src="{{floor-frontend-image}}" alt="{{image-alt}}">
|
||
|
|
</div>
|
||
|
|
-->
|
||
|
|
<div class="s-space__back-btn-wrap">
|
||
|
|
<a href="{{building-back-link}}" class="s-space__back-btn btn btn-primary"><i class="fa fa-arrow-left"></i></a>
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
(function() {
|
||
|
|
var canvas = $("#full-layout-canvas");
|
||
|
|
var layoutImage = $("#layout-image");
|
||
|
|
var cover = canvas.find(".image-cover");
|
||
|
|
var pxToDeduct = (Modernizr.touch ? 157 : 257);
|
||
|
|
var windowHeight = ($(window).height() - pxToDeduct);
|
||
|
|
var coverImageHeight = (parseInt(windowHeight));
|
||
|
|
var tmpImg = new Image();
|
||
|
|
var $box = $('.selection-box');
|
||
|
|
var $pin = $('<a class="s-space__pin-link" href="#"><div class="pin"></div><div class="pulse"></div></a>');
|
||
|
|
var floorId = "{{floor-id}}";
|
||
|
|
var pageId = "{{page-id}}";
|
||
|
|
var id = '';
|
||
|
|
var obj = null;
|
||
|
|
var temp = null;
|
||
|
|
var $imgToggle = $('.s-space__floor-img-small');
|
||
|
|
var $imgLarge = $('.s-space__floor-img-large');
|
||
|
|
var $lightbox = $('<div class="s-space__light-box"></div>');
|
||
|
|
var $closeBtn = $('<div class="s-space__close-btn"><i class="fa fa-times"></i></div>');
|
||
|
|
var body = document.body;
|
||
|
|
|
||
|
|
canvas.height(windowHeight);
|
||
|
|
cover.height(coverImageHeight);
|
||
|
|
layoutImage.height(coverImageHeight);
|
||
|
|
|
||
|
|
tmpImg.src = layoutImage.attr('src') ;
|
||
|
|
tmpImg.onload = function() {
|
||
|
|
cover.width(layoutImage.width());
|
||
|
|
};
|
||
|
|
|
||
|
|
// get rid of these buttons since we're not using them on frontend page
|
||
|
|
$('.selection-box-btn-holder').remove();
|
||
|
|
|
||
|
|
// get URLs for each link
|
||
|
|
$.ajax({
|
||
|
|
url: "/xhr/spaces/get_floor_units",
|
||
|
|
data: {floor_id : floorId, page_id : pageId },
|
||
|
|
dataType: 'JSON'
|
||
|
|
|
||
|
|
}).done(function(data) {
|
||
|
|
$box.each(function(i) {
|
||
|
|
id = $(this).data('unit-id');
|
||
|
|
obj = data.units.filter(function(x) {
|
||
|
|
return x.id == id;
|
||
|
|
});
|
||
|
|
temp = $pin.clone();
|
||
|
|
temp.attr('href', obj[0].url);
|
||
|
|
$(this).append(temp);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
$imgToggle.on('click', function(e) {
|
||
|
|
if (!$(body).children('.light-box').length) {
|
||
|
|
$lightbox.append($closeBtn);
|
||
|
|
$(body).append($lightbox);
|
||
|
|
}
|
||
|
|
|
||
|
|
$(body).toggleClass('has-lightbox');
|
||
|
|
|
||
|
|
$closeBtn.on('click', function(e) {
|
||
|
|
$(body).removeClass('has-lightbox');
|
||
|
|
});
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
$('html').keyup(function(e) {
|
||
|
|
if (e.keyCode === 27) {
|
||
|
|
$(body).removeClass('has-lightbox');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
}());
|
||
|
|
</script>
|