asiaH4/modules/space/show.html.erb

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>