space module update
This commit is contained in:
parent
70589b9d51
commit
ff9f15535c
|
|
@ -0,0 +1,36 @@
|
|||
;(function($) {
|
||||
|
||||
var doc = document;
|
||||
var html = document.documentElement;
|
||||
var body = doc.body;
|
||||
|
||||
var space = {
|
||||
setDataAttr: function() {
|
||||
var cardName = doc.querySelectorAll('.card-name');
|
||||
var i = -1;
|
||||
var len = -1;
|
||||
|
||||
if (cardName) {
|
||||
for (i = 0; i < cardName.length; i++) {
|
||||
if (cardName[i].textContent.trim() !== '') {
|
||||
cardName[i].className += ' has-data-text';
|
||||
cardName[i].setAttribute('data-text', cardName[i].textContent);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
init: function() {
|
||||
var container = doc.querySelector('.card-container');
|
||||
|
||||
if (container) {
|
||||
this.setDataAttr();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
$(document).ready(function() {
|
||||
space.init();
|
||||
});
|
||||
|
||||
}(jQuery));
|
||||
|
|
@ -0,0 +1,788 @@
|
|||
// Bootstrap grid
|
||||
.row {
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
.col-xs-1,
|
||||
.col-sm-1,
|
||||
.col-md-1,
|
||||
.col-lg-1,
|
||||
.col-xs-2,
|
||||
.col-sm-2,
|
||||
.col-md-2,
|
||||
.col-lg-2,
|
||||
.col-xs-3,
|
||||
.col-sm-3,
|
||||
.col-md-3,
|
||||
.col-lg-3,
|
||||
.col-xs-4,
|
||||
.col-sm-4,
|
||||
.col-md-4,
|
||||
.col-lg-4,
|
||||
.col-xs-5,
|
||||
.col-sm-5,
|
||||
.col-md-5,
|
||||
.col-lg-5,
|
||||
.col-xs-6,
|
||||
.col-sm-6,
|
||||
.col-md-6,
|
||||
.col-lg-6,
|
||||
.col-xs-7,
|
||||
.col-sm-7,
|
||||
.col-md-7,
|
||||
.col-lg-7,
|
||||
.col-xs-8,
|
||||
.col-sm-8,
|
||||
.col-md-8,
|
||||
.col-lg-8,
|
||||
.col-xs-9,
|
||||
.col-sm-9,
|
||||
.col-md-9,
|
||||
.col-lg-9,
|
||||
.col-xs-10,
|
||||
.col-sm-10,
|
||||
.col-md-10,
|
||||
.col-lg-10,
|
||||
.col-xs-11,
|
||||
.col-sm-11,
|
||||
.col-md-11,
|
||||
.col-lg-11,
|
||||
.col-xs-12,
|
||||
.col-sm-12,
|
||||
.col-md-12,
|
||||
.col-lg-12 {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.col-xs-1,
|
||||
.col-xs-2,
|
||||
.col-xs-3,
|
||||
.col-xs-4,
|
||||
.col-xs-5,
|
||||
.col-xs-6,
|
||||
.col-xs-7,
|
||||
.col-xs-8,
|
||||
.col-xs-9,
|
||||
.col-xs-10,
|
||||
.col-xs-11,
|
||||
.col-xs-12 {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.col-xs-12 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.col-xs-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-9 {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.col-xs-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-6 {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.col-xs-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-3 {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.col-xs-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
|
||||
.col-xs-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
|
||||
.col-xs-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
|
||||
.col-xs-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
|
||||
.col-xs-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.col-xs-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.col-xs-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
|
||||
.col-xs-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.col-xs-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
|
||||
.col-xs-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.col-xs-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
|
||||
.col-xs-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
|
||||
.col-xs-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
.col-xs-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
|
||||
.col-xs-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
|
||||
.col-xs-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
|
||||
.col-xs-offset-0 {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.col-sm-1,
|
||||
.col-sm-2,
|
||||
.col-sm-3,
|
||||
.col-sm-4,
|
||||
.col-sm-5,
|
||||
.col-sm-6,
|
||||
.col-sm-7,
|
||||
.col-sm-8,
|
||||
.col-sm-9,
|
||||
.col-sm-10,
|
||||
.col-sm-11,
|
||||
.col-sm-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-sm-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-sm-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-sm-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-sm-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-sm-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-sm-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-sm-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-sm-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-sm-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-sm-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-sm-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-sm-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-sm-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-sm-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-sm-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-sm-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-sm-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-sm-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-sm-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-sm-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-sm-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-sm-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-sm-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-sm-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-sm-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-sm-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-sm-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-sm-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-sm-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-sm-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-sm-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-sm-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-sm-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-sm-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-sm-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-sm-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-sm-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-sm-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-sm-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-sm-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-sm-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-sm-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-sm-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-sm-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-sm-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-sm-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-sm-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-sm-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-sm-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-sm-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-sm-offset-0 {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.col-md-1,
|
||||
.col-md-2,
|
||||
.col-md-3,
|
||||
.col-md-4,
|
||||
.col-md-5,
|
||||
.col-md-6,
|
||||
.col-md-7,
|
||||
.col-md-8,
|
||||
.col-md-9,
|
||||
.col-md-10,
|
||||
.col-md-11,
|
||||
.col-md-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-md-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-md-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-md-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-md-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-md-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-md-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-md-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-md-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-md-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-md-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-md-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-md-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-md-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-md-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-md-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-md-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-md-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-md-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-md-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-md-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-md-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-md-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-md-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-md-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-md-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-md-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-md-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-md-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-md-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-md-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-md-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-md-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-md-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-md-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-md-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-md-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-md-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-md-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-md-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-md-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-md-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-md-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-md-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-md-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-md-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-md-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-md-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-md-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-md-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-md-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-md-offset-0 {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.col-lg-1,
|
||||
.col-lg-2,
|
||||
.col-lg-3,
|
||||
.col-lg-4,
|
||||
.col-lg-5,
|
||||
.col-lg-6,
|
||||
.col-lg-7,
|
||||
.col-lg-8,
|
||||
.col-lg-9,
|
||||
.col-lg-10,
|
||||
.col-lg-11,
|
||||
.col-lg-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-lg-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-lg-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-lg-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-lg-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-lg-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-lg-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-lg-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-lg-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-lg-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-lg-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-lg-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-lg-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-lg-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-lg-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-lg-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-lg-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-lg-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-lg-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-lg-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-lg-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-lg-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-lg-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-lg-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-lg-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-lg-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-lg-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-lg-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-lg-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-lg-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-lg-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-lg-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-lg-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-lg-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-lg-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-lg-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-lg-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-lg-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-lg-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-lg-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-lg-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-lg-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-lg-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-lg-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-lg-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-lg-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-lg-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-lg-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-lg-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-lg-offset-0 {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
@charset "utf-8";
|
||||
@import "variables";
|
||||
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
@charset "utf-8";
|
||||
@import url(https://fonts.googleapis.com/css?family=Roboto);
|
||||
|
||||
// Base Color
|
||||
$white: #fff;
|
||||
$black: #000;
|
||||
$red: #ef6741;
|
||||
$purple: #3d416e;
|
||||
$gray: #828282;
|
||||
|
||||
$main-color: #0c96a1;
|
||||
|
||||
// Font stacks
|
||||
$main-font: 'Roboto', "微軟正黑體", "Helvetica Neue", Helvetica, sans-serif;
|
||||
$sub-font: 'Roboto', "新細明體", "Helvetica Neue", Helvetica, sans-serif;
|
||||
|
||||
// Units
|
||||
$border-radius-narrow: 2px;
|
||||
$border-radius-normal: 4px;
|
||||
|
||||
// Screen breakpoints
|
||||
$screen-xs: 480px;
|
||||
$screen-sm: 768px;
|
||||
$screen-md: 992px;
|
||||
$screen-lg: 1200px;
|
||||
|
|
@ -0,0 +1,59 @@
|
|||
@charset "utf-8";
|
||||
@import "variables";
|
||||
@import "grid";
|
||||
|
||||
.message {
|
||||
position: fixed;
|
||||
right: 1rem;
|
||||
top: 4rem;
|
||||
color: $white;
|
||||
padding: 16px 1.375rem;
|
||||
background-color: $main-color;
|
||||
border-radius: $border-radius-narrow;
|
||||
font-size: 13px;
|
||||
box-shadow: 0px 0px 16px 3px rgba(0, 0, 0, 0.2);
|
||||
-webkit-animation-duration: .3s;
|
||||
animation-duration: .3s;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.group {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
-webkit-flex-wrap: wrap;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.group-item {
|
||||
padding: 0;
|
||||
margin-bottom: 10px;
|
||||
margin: 8px;
|
||||
padding: 15px 20px;
|
||||
border: 2px solid lighten($gray, 30%);
|
||||
border-radius: $border-radius-narrow;
|
||||
}
|
||||
|
||||
.group-actions {
|
||||
padding: 8px;
|
||||
background-color: lighten($gray, 45%);
|
||||
}
|
||||
|
||||
.group-img {
|
||||
margin-bottom: 8px
|
||||
}
|
||||
|
||||
.group-label {
|
||||
font-family: $main-font;
|
||||
font-size: 12px;
|
||||
display: inline;
|
||||
vertical-align: middle;
|
||||
color: lighten($black, 50%);
|
||||
}
|
||||
|
||||
.group-clear-4 {
|
||||
> .group-item:nth-child(4n+1) {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
@charset "utf-8";
|
||||
|
||||
// space-box
|
||||
.overlay {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#full-layout-canvas {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
|
||||
.image-cover {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
height: 100%;
|
||||
margin: auto;
|
||||
|
||||
// overflow: hidden;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,166 +0,0 @@
|
|||
ul.building-showcase{
|
||||
list-style: outside none none;
|
||||
margin: 0;
|
||||
padding: 0 0 10px;
|
||||
|
||||
.building{
|
||||
background: #ffffff none repeat scroll 0 0;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||
float: left;
|
||||
margin: 5px;
|
||||
overflow: hidden;
|
||||
padding: 5px;
|
||||
position: relative;
|
||||
transition-property: left, right, top;
|
||||
width: 200px;
|
||||
height: 275px;
|
||||
|
||||
.actions {
|
||||
text-align: center;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.shade {
|
||||
background-color: #000000;
|
||||
bottom: 0;
|
||||
content: "";
|
||||
display: block;
|
||||
left: 0;
|
||||
margin: 5px;
|
||||
opacity: 0.4;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 200px;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
p {
|
||||
bottom: 30px;
|
||||
color: #f2f2f2;
|
||||
font-family: "Playfair Display SC",sans-serif;
|
||||
font-size: 30px;
|
||||
letter-spacing: -0.5px;
|
||||
line-height: 28px;
|
||||
margin: 0;
|
||||
opacity: 1;
|
||||
padding: 10px;
|
||||
position: absolute;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 250px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
ul.apartments-area {
|
||||
list-style: outside none none;
|
||||
margin: 0;
|
||||
padding: 0 0 10px;
|
||||
|
||||
.apartment {
|
||||
background: #ffffff none repeat scroll 0 0;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||
float: left;
|
||||
margin: 10px;
|
||||
overflow: hidden;
|
||||
padding: 5px;
|
||||
position: relative;
|
||||
margin-bottom: 3px;
|
||||
padding-bottom: 0;
|
||||
transition-property: left, right, top;
|
||||
width: 150px;
|
||||
height: 170px;
|
||||
text-align: center;
|
||||
|
||||
.apartment-img {
|
||||
background-color: #F1F1F1;
|
||||
width: 100%;
|
||||
height: 125px;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
p{
|
||||
font-size: 18px;
|
||||
font-family: "Playfair Display SC",sans-serif;
|
||||
color : #000;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul#layout-canvas {
|
||||
background-color: #fff;
|
||||
border: 2px solid #eee;
|
||||
list-style: outside none none;
|
||||
li.apartment-draggable {
|
||||
max-width: 200px;
|
||||
position: relative;
|
||||
float: left;
|
||||
cursor: move;
|
||||
}
|
||||
}
|
||||
|
||||
#full-layout-canvas {
|
||||
background-color: #fff;
|
||||
border: 2px solid #eee;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
|
||||
.image-cover {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
height: 100%;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.selection-box{
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
background-color: rgba(0, 0, 0, .4);
|
||||
|
||||
.selection-box-label{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.make-box-permanent{
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.selection-box-form {
|
||||
color: #fff;
|
||||
|
||||
.form-unit-title{
|
||||
margin: 5px;
|
||||
input {
|
||||
width : 90%;
|
||||
}
|
||||
select {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.floor-unit-title{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,464 @@
|
|||
@charset "utf-8";
|
||||
|
||||
@import "variables";
|
||||
@import "grid";
|
||||
|
||||
// Since the backend system is using Bootstrap 2 heavily and it's not supporting RWD
|
||||
// And if I import Bootstrap 3 directly into pages, it could cause CSS conflicts...
|
||||
// that's why I only imported Bootstrap grid system and added flat style into this module
|
||||
// ------ helpers
|
||||
// classes
|
||||
.list-unstyled {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.no-wrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.absolute-center {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.absolute-bottom {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 100%;
|
||||
-webkit-transform: translate(-50%, 0);
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
// button, add -flat to extend the styling from Bootstrap
|
||||
.btn-flat {
|
||||
color: $white;
|
||||
background: $gray;
|
||||
border-radius: $border-radius-narrow;
|
||||
padding: 4px 14px;
|
||||
font-size: 13px;
|
||||
border: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
font-family: $main-font;
|
||||
|
||||
&:hover {
|
||||
color: $white;
|
||||
text-decoration: none;
|
||||
background-color: lighten($gray, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-primary {
|
||||
color: $white;
|
||||
background-color: $main-color;
|
||||
|
||||
&:hover {
|
||||
background-color: lighten($main-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-info {
|
||||
background-color: $purple;
|
||||
|
||||
&:hover {
|
||||
background-color: lighten($purple, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-warning {
|
||||
background-color: #f5a742;
|
||||
|
||||
&:hover {
|
||||
background-color: lighten(#f5a742, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-danger {
|
||||
background-color: $red;
|
||||
|
||||
&:hover {
|
||||
background-color: lighten($red, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-small {
|
||||
padding: 2px 8px;
|
||||
}
|
||||
|
||||
.btn-flat-has-icon {
|
||||
i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-flat-has-margin {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.btn-flat-block {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-bottom: 8px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// ------ module
|
||||
// card
|
||||
.card-container {
|
||||
margin: 0 20px;
|
||||
|
||||
@media (min-width: $screen-sm) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
position: relative;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.card-inner {
|
||||
font-family: $main-font;
|
||||
margin: 5px;
|
||||
background-color: $white;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
|
||||
border-radius: $border-radius-normal;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.card-actions {
|
||||
padding: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card-link {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
color: $white;
|
||||
overflow: hidden;
|
||||
height: 275px;
|
||||
background-size: cover;
|
||||
background-position: top center;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.card-name {
|
||||
padding: 8px;
|
||||
margin-left: -8px;
|
||||
color: lighten($black, 20%);
|
||||
width: 108%;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid lighten($black, 95%);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background-color: $white;
|
||||
text-transform: capitalize;
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
&.has-data-text:after {
|
||||
position: absolute;
|
||||
top: calc(100% + 1px);
|
||||
bottom: calc(-100% - 1px);
|
||||
left: 0;
|
||||
right: 0;
|
||||
content: attr(data-text);
|
||||
transition: .2s all ease;
|
||||
background-color: $main-color;
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&:hover:after {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.card-name-not-link {
|
||||
&:hover {
|
||||
color: lighten($black, 20%);
|
||||
background-color: $white;
|
||||
}
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
// float box
|
||||
.float-box {
|
||||
position: absolute;
|
||||
padding: 15px 20px;
|
||||
border: 1px solid lighten($gray, 30%);
|
||||
background-color: $white;
|
||||
border-radius: $border-radius-narrow;
|
||||
-webkit-box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.2);
|
||||
z-index: 100;
|
||||
white-space: nowrap;
|
||||
min-width: 120px;
|
||||
|
||||
// right arrow
|
||||
&:before {
|
||||
border: 10px solid transparent;
|
||||
border-left-color: $white;
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: calc(100% - 1px);
|
||||
top: 0;
|
||||
}
|
||||
|
||||
// add more space for mouse hover
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -20px;
|
||||
height: 100%;
|
||||
width: 20px;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.float-box-right {
|
||||
left: calc(100% + 5px);
|
||||
|
||||
// left arrow
|
||||
&:before {
|
||||
right: calc(100% - 1px);
|
||||
border-left-color: transparent;
|
||||
border-right-color: $white;
|
||||
left: auto;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
// add more space for mouse hover, change direction
|
||||
&:after {
|
||||
left: -20px;
|
||||
}
|
||||
}
|
||||
|
||||
.float-box-left {
|
||||
right: calc(100% + 5px);
|
||||
}
|
||||
|
||||
.float-box-top {
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.float-box-bottom {
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
// table, extend with -flat class
|
||||
.table-flat {
|
||||
.btn-flat {
|
||||
margin: 4px 0;
|
||||
}
|
||||
}
|
||||
|
||||
// form elements, extend with -flat class
|
||||
.form-horizontal-flat {
|
||||
margin-bottom: 8px;
|
||||
|
||||
.control-label-flat {
|
||||
color: lighten($black, 60%);
|
||||
background-color: transparent;
|
||||
font-family: $main-font;
|
||||
float: none;
|
||||
text-align: left;
|
||||
width: auto;
|
||||
display: inline-block;
|
||||
font-size: 13px;
|
||||
|
||||
i {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.control-group-flat {
|
||||
margin-bottom: 8px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.control-group-flat-last {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.toggle-select-wrap {
|
||||
font-family: $main-font;
|
||||
color: lighten($black, 60%);
|
||||
}
|
||||
}
|
||||
|
||||
.input-flat[type="text"] {
|
||||
height: 30px;
|
||||
padding: 0 5px;
|
||||
border-radius: $border-radius-narrow;
|
||||
color: lighten($black, 60%);
|
||||
box-shadow: none;
|
||||
border: 1px solid lighten($gray, 30%);
|
||||
font-size: 12px;
|
||||
width: 150px;
|
||||
|
||||
&:focus {
|
||||
border: 1px solid lighten($gray, 30%);
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.select-flat {
|
||||
height: 30px;
|
||||
padding: 0 5px;
|
||||
color: lighten($black, 60%);
|
||||
width: 150px;
|
||||
font-size: 12px;
|
||||
border: 1px solid lighten($gray, 30%);
|
||||
border-radius: $border-radius-narrow;
|
||||
}
|
||||
|
||||
.checkbox-flat[type="checkbox"] {
|
||||
margin-top: 0;
|
||||
margin-right: 5px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
// space-box
|
||||
.overlay {
|
||||
background-color: rgba($main-color, 0.3);
|
||||
border: 2px solid $main-color;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
cursor: pointer;
|
||||
|
||||
.selection-box-label {
|
||||
box-sizing: border-box;
|
||||
font-family: $main-font;
|
||||
min-width: calc(100% + 4px);
|
||||
color: $white;
|
||||
background-color: rgba($main-color, 0.9);
|
||||
padding: 5px 8px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
// Page specific styles
|
||||
.building-showcase {
|
||||
img {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
height: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
.selection-box {
|
||||
&:hover {
|
||||
.selection-box-btn-holder {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.selection-box-btn-holder {
|
||||
display: none;
|
||||
|
||||
// &:before {
|
||||
// position: absolute;
|
||||
// left: -20px;
|
||||
// top: 0;
|
||||
// content: "";
|
||||
// width: 20px;
|
||||
// height: 100px;
|
||||
// background-color: transparent;
|
||||
// }
|
||||
}
|
||||
|
||||
.floor-unit-title {
|
||||
font-size: 14px;
|
||||
|
||||
h3 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#layout-image {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.space-canvas {
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
// styles from Harry
|
||||
ul#layout-canvas {
|
||||
background-color: #fff;
|
||||
border: 2px solid #eee;
|
||||
list-style: outside none none;
|
||||
|
||||
li.apartment-draggable {
|
||||
max-width: 200px;
|
||||
position: relative;
|
||||
float: left;
|
||||
cursor: move;
|
||||
}
|
||||
}
|
||||
|
||||
#full-layout-canvas {
|
||||
background-color: #fff;
|
||||
border: 2px solid #eee;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
padding: 0 0 20px 0;
|
||||
overflow: hidden;
|
||||
|
||||
.image-cover {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
margin: auto;
|
||||
transform: translate(-50%, 0);
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.make-box-permanent {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.floor-unit-title {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -52,7 +52,10 @@ class Admin::SpacesController < OrbitAdminController
|
|||
|
||||
def update_floor
|
||||
floor = Floor.find(params[:floor_id]) rescue nil
|
||||
old_img = floor.layout_image.url
|
||||
floor.update_attributes(floor_params)
|
||||
img = floor.layout_image.url
|
||||
floor.layout = floor.layout.sub(old_img ,img) if !floor.layout.nil?
|
||||
floor.save
|
||||
redirect_to "/admin/spaces/#{floor.building.to_param}/floors"
|
||||
|
||||
|
|
@ -90,7 +93,10 @@ class Admin::SpacesController < OrbitAdminController
|
|||
def update_floor_unit
|
||||
floor_unit = FloorUnit.find(params[:unit_id]) rescue nil
|
||||
if !floor_unit.nil?
|
||||
old_img = floor_unit.layout_image.url
|
||||
floor_unit.update_attributes(floor_unit_params)
|
||||
img = floor_unit.layout_image.url
|
||||
floor_unit.layout = floor_unit.layout.sub(old_img ,img) if !floor_unit.layout.nil?
|
||||
floor_unit.save
|
||||
end
|
||||
redirect_to "/admin/spaces/#{floor_unit.floor.building.to_param}/#{floor_unit.floor.to_param}/units"
|
||||
|
|
@ -132,6 +138,12 @@ class Admin::SpacesController < OrbitAdminController
|
|||
@sub_unit = FloorSubUnit.find_by(:uid => params[:sub_unit_id].split("-").last) rescue nil
|
||||
end
|
||||
|
||||
def destroy_sub_unit
|
||||
sub_unit = FloorSubUnit.find_by(:uid => params[:sub_unit_id].split("-").last) rescue nil
|
||||
sub_unit.destroy if !sub_unit.nil?
|
||||
redirect_to "/admin/spaces/#{sub_unit.floor_unit.floor.to_param}/#{sub_unit.floor_unit.to_param}/sub_units"
|
||||
end
|
||||
|
||||
def update_sub_unit
|
||||
sub_unit = FloorSubUnit.find(params[:floor_sub_unit_id]) rescue nil
|
||||
if !sub_unit.nil?
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
class SpacesController < ApplicationController
|
||||
def index
|
||||
page = Page.where(:module => OrbitHelper.this_module_app.key).first
|
||||
params = OrbitHelper.params
|
||||
page = Page.where(:page_id => params[:page_id]).first
|
||||
buildings = Building.filter_by_categories.collect do |building|
|
||||
floors = building.floors.desc(:title).collect do |floor|
|
||||
image = (!floor.frontend_image.thumb.url.nil? ? floor.frontend_image.thumb.url : "/assets/default-floor.jpg")
|
||||
|
|
@ -33,7 +34,7 @@ class SpacesController < ApplicationController
|
|||
floor = Floor.where(:uid => params[:uid]).first rescue nil
|
||||
thumb_image = (!floor.frontend_image.thumb.url.nil? ? floor.frontend_image.thumb.url : "/assets/default-floor.jpg")
|
||||
image = (!floor.frontend_image.mobile.url.nil? ? floor.frontend_image.mobile.url : "#")
|
||||
page = Page.where(:module => OrbitHelper.this_module_app.key).first
|
||||
page = Page.where(:page_id => params[:page_id]).first
|
||||
|
||||
{
|
||||
"floor-title" => floor.title,
|
||||
|
|
@ -70,7 +71,7 @@ class SpacesController < ApplicationController
|
|||
units = []
|
||||
if !unit.nil?
|
||||
unit.floor_sub_units.each do |subunit|
|
||||
url = "/#{I18n.locale.to_s}#{page.url}/#{subunit.to_param}?method=showcase&layout=false" rescue "#"
|
||||
url = subunit.floor_sub_unit_images.empty? ? "#" : "/#{I18n.locale.to_s}#{page.url}/#{subunit.to_param}?method=showcase&layout=false" rescue "#"
|
||||
units << {
|
||||
"id" => subunit.id.to_s,
|
||||
"url" => url
|
||||
|
|
@ -84,12 +85,13 @@ class SpacesController < ApplicationController
|
|||
def unit
|
||||
params = OrbitHelper.params
|
||||
unit = FloorUnit.where(:uid => params[:uid]).first rescue nil
|
||||
page = Page.where(:module => OrbitHelper.this_module_app.key).first
|
||||
|
||||
page = Page.where(:page_id => params[:page_id]).first
|
||||
layout = unit.layout.nil? ? "<div id='full-layout-canvas'><img href='<%= unit.layout_image.url %>' id='layout-image'></div>" : unit.layout
|
||||
backlink = unit.floor.layout.nil? ? "/" + I18n.locale.to_s + page.url : "/" + I18n.locale.to_s + page.url + "/#{unit.floor.to_param}"
|
||||
{
|
||||
"unit-title" => unit.title,
|
||||
"floor-back-link" => "/" + I18n.locale.to_s + page.url + "/#{unit.floor.to_param}",
|
||||
"unit-layout" => unit.layout,
|
||||
"floor-back-link" => backlink,
|
||||
"unit-layout" => layout,
|
||||
"unit-id" => unit.id.to_s,
|
||||
"page-id" => page.page_id
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,12 @@
|
|||
<li class="building">
|
||||
<a href="/admin/spaces/<%= building.to_param %>/floors">
|
||||
<img src="<%= building.image.thumb.url %>" />
|
||||
<div class="shade"></div>
|
||||
<p><%= building.title %></p>
|
||||
</a>
|
||||
<div class="actions">
|
||||
<a href="<%= edit_admin_space_path(building) %>">Edit</a> | <a href="<%= admin_space_path(building) %>" data-method="delete" data-confirm="Are you sure?">Delete</a>
|
||||
</div>
|
||||
<li class="building card col-xs-6 col-sm-4 col-md-3 col-lg-2 animated bounceInDown">
|
||||
<div class="card-inner">
|
||||
<a class="building-link card-link" href="/admin/spaces/<%= building.to_param %>/floors" style="background-image: url(<%= building.image.thumb.url %>)">
|
||||
<!-- <img class="building-img card-img" src="<%= building.image.thumb.url %>" /> -->
|
||||
<p class="building-name card-name"><%= building.title %></i></p>
|
||||
</a>
|
||||
<div class="building-actions card-actions">
|
||||
<a class="btn-flat btn-flat-primary btn-flat-has-icon" href="<%= edit_admin_space_path(building) %>"><i class="fa fa-pencil"></i>Edit</a>
|
||||
<a class="btn-flat btn-flat-danger btn-flat-has-icon" href="<%= admin_space_path(building) %>" data-method="delete" data-confirm="Are you sure?"><i class="fa fa-trash-o"></i>Delete</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
|
@ -2,9 +2,9 @@
|
|||
<td><a href="/admin/spaces/<%= floor.building.to_param %>/<%= floor.to_param %>/units"><%= floor.title %></a></td>
|
||||
<td>
|
||||
<% if !floor.layout_image.url.nil? %>
|
||||
<a href="/admin/spaces/floor/<%= floor.to_param %>/layout" class="btn btn-info">Floor Layout</a>
|
||||
<a class="btn-flat btn-flat-info btn-flat-has-icon" href="/admin/spaces/floor/<%= floor.to_param %>/layout"><i class="fa fa-object-group"></i>Floor Layout</a>
|
||||
<% end %>
|
||||
<a href="#" data-values='{"id" : "<%= floor.id.to_s %>", "title" : "<%= floor.title %>", "layout" : "<%= floor.layout_image.url == "" ? "" : floor.layout_image.url %>"}' class="btn btn-warning edit-floor-btns">Edit Floor</a>
|
||||
<a href="/admin/spaces/floor/<%= floor.to_param %>/delete" class="btn btn-danger floor-delete-btns"><i class="icons-trash"></i></a>
|
||||
<a class="btn-flat btn-flat-primary btn-flat-has-icon edit-floor-btns" href="#" data-values='{"id" : "<%= floor.id.to_s %>", "title" : "<%= floor.title %>", "layout" : "<%= floor.layout_image.url == "" ? "" : floor.layout_image.url %>"}'><i class="fa fa-pencil"></i>Edit Floor</a>
|
||||
<a class="btn-flat btn-flat-danger btn-flat-has-icon floor-delete-btns" href="/admin/spaces/floor/<%= floor.to_param %>/delete"><i class="fa fa-trash-o"></i>Delete</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -1,12 +1,19 @@
|
|||
<li class="apartment">
|
||||
<a href="/admin/spaces/<%= floor_unit.floor.to_param %>/<%= floor_unit.to_param %>/sub_units">
|
||||
<div class="apartment-img">
|
||||
<img src="<%= floor_unit.layout_image.thumb.url.nil? ? "/assets/no-layout.jpg" : floor_unit.layout_image.thumb.url %>" >
|
||||
<li class="apartment card col-sm-6 col-md-4 animated bounceInDown">
|
||||
<div class="card-inner">
|
||||
<a class="apartment-link card-link" href="/admin/spaces/<%= floor_unit.floor.to_param %>/<%= floor_unit.to_param %>/sub_units" style="background-image: url(<%= floor_unit.layout_image.thumb.url.nil? ? "/assets/no-layout.jpg" : floor_unit.layout_image.thumb.url %>)">
|
||||
<!-- <img src="<%= floor_unit.layout_image.thumb.url.nil? ? "/assets/no-layout.jpg" : floor_unit.layout_image.thumb.url %>" > -->
|
||||
<p class="apartment-name card-name"><%= floor_unit.title %></p>
|
||||
</a>
|
||||
<div class="apartment-actions card-actions">
|
||||
<a class="btn-flat btn-flat-primary btn-flat-has-icon" href="/admin/spaces/unit/<%= floor_unit.to_param %>/edit">
|
||||
<i class="fa fa-pencil"></i>Edit
|
||||
</a>
|
||||
<a class="btn-flat btn-flat-danger btn-flat-has-icon" href="/admin/spaces/unit/<%= floor_unit.to_param %>/delete" data-method="delete" data-confirm="Are you sure?">
|
||||
<i class="fa fa-trash-o"></i>Delete
|
||||
</a>
|
||||
<% if !floor_unit.layout_image.thumb.url.nil? %>
|
||||
<a class="btn-flat btn-flat-info btn-flat-has-icon" href="/admin/spaces/unit/<%= floor_unit.to_param %>/layout"><i class="fa fa-object-group"></i>Layout</a>
|
||||
<% end %>
|
||||
</div>
|
||||
<p><%= floor_unit.title %></p>
|
||||
</a>
|
||||
<a href="/admin/spaces/unit/<%= floor_unit.to_param %>/edit">Edit</a> | <a href="/admin/spaces/unit/<%= floor_unit.to_param %>/delete" data-method="delete" data-confirm="Are you sure?">Delete</a>
|
||||
<% if !floor_unit.layout_image.thumb.url.nil? %>
|
||||
| <a href="/admin/spaces/unit/<%= floor_unit.to_param %>/layout">Layout</a>
|
||||
<% end %>
|
||||
</div>
|
||||
</li>
|
||||
|
|
@ -1,7 +1,13 @@
|
|||
<li class="apartment">
|
||||
<div class="apartment-img">
|
||||
<img src="<%= sub_unit.floor_sub_unit_images.blank? ? "/assets/no-layout.jpg" : sub_unit.floor_sub_unit_images.first.image.thumb.url %>" >
|
||||
</div>
|
||||
<p><%= sub_unit.title %></p>
|
||||
<a href="/admin/spaces/sub_unit/<%= sub_unit.to_param %>/edit">Edit</a> | <a href="/admin/spaces/sub_unit/<%= sub_unit.to_param %>/delete" data-method="delete" data-confirm="Are you sure?">Delete</a>
|
||||
<li class="apartment card col-xs-6 col-md-3 col-lg-2 animated bounceInDown">
|
||||
<div class="card-inner">
|
||||
<div class="apartment-img card-link" style="background-image: url(<%= sub_unit.floor_sub_unit_images.blank? ? "/assets/no-layout.jpg" : sub_unit.floor_sub_unit_images.first.image.thumb.url %>)">
|
||||
<p class="card-name card-name-not-link"><%= sub_unit.title %></p>
|
||||
</div>
|
||||
<div class="card-actions">
|
||||
<a class="btn-flat btn-flat-primary btn-flat-has-icon" href="/admin/spaces/sub_unit/<%= sub_unit.to_param %>/edit"><i class="fa fa-pencil"></i>Edit</a>
|
||||
<a class="btn-flat btn-flat-danger btn-flat-has-icon" href="/admin/spaces/sub_unit/<%= sub_unit.to_param %>/delete" data-method="delete" data-confirm="Are you sure?"><i class="fa fa-times"></i>Delete</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</li>
|
||||
|
|
@ -2,15 +2,17 @@
|
|||
<%= stylesheet_link_tag "lib/main-forms" %>
|
||||
<%= stylesheet_link_tag "lib/main-list" %>
|
||||
<%= stylesheet_link_tag "lib/dropzone" %>
|
||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.6/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "space-admin" %>
|
||||
<% end %>
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "lib/dropzone" %>
|
||||
<%= javascript_include_tag "validator" %>
|
||||
<%= javascript_include_tag "space/space" %>
|
||||
<% end %>
|
||||
|
||||
<div class="upload-status-notice hide">
|
||||
<div class="message hide">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
<span class="upload-text">Uploading...</span>
|
||||
</div>
|
||||
|
|
@ -38,20 +40,20 @@
|
|||
<label class="control-label muted"><%= t(:images) %></label>
|
||||
<div class="controls">
|
||||
<% if params[:action] == "edit_sub_unit" %>
|
||||
<div class="group-admin-edit-image-wrap clearfix">
|
||||
<div class="group group-clear-4 clearfix">
|
||||
<% @sub_unit.floor_sub_unit_images.each do |image| %>
|
||||
<div class="group-admin-edit-image-item card clearfix">
|
||||
<div class="group-admin-edit-image-item-inner">
|
||||
<div class="group-admin-edit-image-container">
|
||||
<img src="<%= image.image.thumb.url %>">
|
||||
</div>
|
||||
<div class="group-admin-edit-checkbox-wrap">
|
||||
<input class="group-admin-edit-image-checkbox" type="checkbox" name="images_to_destroy[]" value="<%= image.id.to_s %>" />
|
||||
<label class="group-admin-edit-image-label">Delete Image</label>
|
||||
<div class="group-item col-md-3">
|
||||
<div class="group-item-inner">
|
||||
<img class="group-img" src="<%= image.image.thumb.url %>">
|
||||
<div class="group-actions">
|
||||
<input class="group-checkbox" type="checkbox" name="images_to_destroy[]" value="<%= image.id.to_s %>" />
|
||||
<label class="group-label">Delete Image</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="dropzone dropzone-pool" id="sub-unit-images">
|
||||
|
|
@ -80,4 +82,29 @@
|
|||
<%= hidden_field_tag :floor_sub_unit_id, @sub_unit.id.to_s %>
|
||||
<% end %>
|
||||
<%= f.submit t('submit'), class: 'btn btn-primary', :id => "floor-sub-unit-form-btn" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function equalHeight(items) {
|
||||
if (typeof items === 'string' && items.length > 0) {
|
||||
var $items = $(items);
|
||||
var $this = null;
|
||||
var maxHeight = -1;
|
||||
|
||||
// when images are loaded
|
||||
$items.find('img').load(function() {
|
||||
console.log('g')
|
||||
$.each($items, function(i, val) {
|
||||
$this = $(this);
|
||||
if ($this.outerHeight() > maxHeight) {
|
||||
maxHeight = $this.outerHeight();
|
||||
}
|
||||
console.log($this)
|
||||
}).css('min-height', maxHeight + 'px');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
equalHeight('.group-item-inner');
|
||||
|
||||
</script>
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
return false;
|
||||
}
|
||||
// uploading all the files
|
||||
$(".upload-status-notice")
|
||||
$(".message")
|
||||
.removeClass("hide")
|
||||
.addClass("animated slideInRight");
|
||||
return false;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "space" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "attrchange" %>
|
||||
|
|
@ -9,7 +10,7 @@
|
|||
<h3><%= @floor.title %></h3>
|
||||
</div>
|
||||
<% if @floor.layout == nil %>
|
||||
<div id="full-layout-canvas">
|
||||
<div id="full-layout-canvas" class="space-canvas">
|
||||
<img id="layout-image" src="<%= @floor.layout_image.url %>" />
|
||||
<div class="image-cover"></div>
|
||||
</div>
|
||||
|
|
@ -25,8 +26,10 @@
|
|||
var canvas = $("#full-layout-canvas"),
|
||||
layoutImage = $("#layout-image"),
|
||||
cover = canvas.find(".image-cover"),
|
||||
positionClass = "float-box-left",
|
||||
dragAreaCount = 0,
|
||||
windowHeight = ($(window).height() - (36 + 46 + 75 + 60)) + "px",
|
||||
windowHeight = ($(window).height() - (36 + 46 + 75 + 60)),
|
||||
coverImageHeight = (parseInt(windowHeight)),
|
||||
floorUnits = <%= @floor.floor_units.asc(:title).collect{|unit| {"id" => unit.id.to_s, "title" => unit.title}}.to_json.html_safe %>,
|
||||
formDisplay = false,
|
||||
changesMade = 0,
|
||||
|
|
@ -34,11 +37,13 @@
|
|||
tmpImg = new Image();
|
||||
|
||||
canvas.height(windowHeight);
|
||||
layoutImage.height(windowHeight);
|
||||
cover.height(coverImageHeight);
|
||||
layoutImage.height(coverImageHeight - 40);
|
||||
canvas.css('box-sizing', 'border-box');
|
||||
|
||||
tmpImg.src = layoutImage.attr('src') ;
|
||||
tmpImg.onload = function() {
|
||||
cover.width(layoutImage.width());
|
||||
cover.width(layoutImage.width() + 40);
|
||||
// cover.css("left",((layoutImage.position().left * 100) / canvas.width()) + "%");
|
||||
}
|
||||
|
||||
|
|
@ -50,13 +55,14 @@
|
|||
currentDragBox = null,
|
||||
isDragging = false;
|
||||
cover.on("mousedown",function(e){
|
||||
// e.preventDefault();
|
||||
if($(".selection-box.hover").length == 0 && !formDisplay){
|
||||
if(currentDragBox != null){
|
||||
currentDragBox.remove();
|
||||
currentDragBox = null;
|
||||
$(".make-box-permanent").remove();
|
||||
}
|
||||
var dragBox = $("<div class='selection-box'></div>"),
|
||||
var dragBox = $("<div class='selection-box overlay'></div>"),
|
||||
xpercent = ((e.offsetX * 100) / cover.width()) + "%",
|
||||
ypercent = ((e.offsetY * 100) / cover.height()) + "%";
|
||||
dragBox.css({
|
||||
|
|
@ -72,6 +78,7 @@
|
|||
})
|
||||
|
||||
cover.on("mousemove",function(e){
|
||||
e.preventDefault();
|
||||
if(isDragging){
|
||||
diffX = e.offsetX - offsetX;
|
||||
diffY = e.offsetY - offsetY;
|
||||
|
|
@ -87,7 +94,7 @@
|
|||
isDragging = false;
|
||||
if(currentDragBox.width() > 20 && currentDragBox.height() > 20){
|
||||
var offset = currentDragBox.offset(),
|
||||
btn = $("<button class='make-box-permanent btn btn-primary btn-small'><i class='fa fa-check'></i> Ok</button>");
|
||||
btn = $("<button class='make-box-permanent btn-flat btn-flat-has-icon btn-flat-primary btn-flat-small absolute-center'><i class='fa fa-check'></i>OK</button>");
|
||||
btn.on("click",selectAreaOkBtnHandler);
|
||||
currentDragBox.append(btn);
|
||||
currentDragBox.hover(function(){
|
||||
|
|
@ -103,8 +110,11 @@
|
|||
|
||||
var selectAreaOkBtnHandler = function(event){
|
||||
$(this).remove();
|
||||
var deleteBtn = $("<button class='btn btn-small btn-danger selection-box-delete-btn' for='temp_unit_id_" + dragAreaCount + "'><i class='fa fa-times'></i></button>"),
|
||||
btnHolder = $("<div class='selection-box-btn-holder'></div>");
|
||||
if(parseInt(currentDragBox.css("left")) < 195){
|
||||
positionClass = "float-box-right";
|
||||
}
|
||||
var deleteBtn = $("<button class='btn-flat btn-flat-small btn-flat-danger btn-flat-has-icon btn-flat-has-margin selection-box-delete-btn btn-flat-block' for='temp_unit_id_" + dragAreaCount + "'><i class='fa fa-trash-o'></i>Delete</button>"),
|
||||
btnHolder = $("<div class='selection-box-btn-holder float-box " + positionClass + "'></div>");
|
||||
btnHolder.append(deleteBtn);
|
||||
currentDragBox.append(btnHolder);
|
||||
currentDragBox.css({
|
||||
|
|
@ -122,9 +132,9 @@
|
|||
|
||||
var makeNewForm = function(box,edit){
|
||||
formDisplay = true;
|
||||
var formWrapper = $("<div class='selection-form-wrapper' />"),
|
||||
form = $("<form class='selection-box-form form-horizontal' />"),
|
||||
field = "<div class='control-group'> <label calss='control-label muted' for='floor_unit_title'>Unit name : </label><img src='/assets/preloader.gif' style='width:50px; height:50px; display:none;' /><div class='form-unit-title'><input id='floor_unit_title' type='text' name='floor_unit[title]' placeholder='New unit title' /><select style='display:none;'>";
|
||||
var formWrapper = $("<div class='selection-form-wrapper float-box " + positionClass + "' />"),
|
||||
form = $("<form class='selection-box-form form-horizontal form-horizontal-flat' />"),
|
||||
field = "<div class='control-group control-group-flat'> <label class='control-label muted control-label-flat floor-unit-title' for='floor_unit_title'><i class='fa fa-cube'></i>Unit name : </label><img src='/assets/preloader.gif' style='width:50px; height:50px; display:none;' /><div class='form-unit-title'><input class='input-flat' id='floor_unit_title' type='text' name='floor_unit[title]' placeholder='New unit title' /><select class='select-flat' style='display:none;'>";
|
||||
|
||||
for(index = 0; index < floorUnits.length; index++){
|
||||
var unit = floorUnits[index];
|
||||
|
|
@ -132,7 +142,7 @@
|
|||
}
|
||||
|
||||
field += "</select></div></div>";
|
||||
var checkbox = $("<div class='control-group'><div><input type='checkbox' id='toggle-select-text' /> Select existing units</div></div>"),
|
||||
var checkbox = $("<div class='control-group control-group-flat'><div class='toggle-select-wrap'><input class='checkbox-flat' type='checkbox' id='toggle-select-text' /><label class='control-label-flat' for='toggle-select-text'>Select existing units</label></div></div>"),
|
||||
type = (edit ? "existing" : "new");
|
||||
checkbox.find("input[type=checkbox]").on("click",function(){
|
||||
if($(this).is(":checked")){
|
||||
|
|
@ -146,7 +156,17 @@
|
|||
}
|
||||
})
|
||||
|
||||
var submitBtn = $("<div class='control-group'><div class='form-action-btn-holder'><button class='btn btn-small btn-primary'>Save</button></div>");
|
||||
var submitBtn = $("<div class='control-group control-group-flat control-group-flat-last'><div class='form-action-btn-holder no-wrap'><button class='btn-flat btn-flat-small btn-flat-primary btn-flat-has-icon btn-flat-has-margin'><i class='fa fa-floppy-o'></i>Save</button></div>");
|
||||
if(type == "new"){
|
||||
var deleteBtn = $("<button class='btn-flat btn-flat-small btn-flat-danger btn-flat-has-icon btn-flat-has-margin' ><i class='fa fa-trash-o'></i>Delete</button>");
|
||||
deleteBtn.one("click",function(){
|
||||
formDisplay = false;
|
||||
changesMade--;
|
||||
box.remove();
|
||||
return false;
|
||||
})
|
||||
submitBtn.find(".form-action-btn-holder").append(deleteBtn);
|
||||
}
|
||||
submitBtn.find("button").on("click",function(){
|
||||
if(type == "existing"){
|
||||
var id = form.find("select").val(),
|
||||
|
|
@ -154,12 +174,12 @@
|
|||
box.attr("data-unit-id",id);
|
||||
box.find(".selection-box-delete-btn").attr("for",id);
|
||||
if(box.find(".selection-box-label").length == 0){
|
||||
box.append("<div class='selection-box-label'>" + unit[0].title + "</div>");
|
||||
box.append("<div class='selection-box-label absolute-bottom'>" + unit[0].title + "</div>");
|
||||
}else{
|
||||
box.find(".selection-box-label").text(unit[0].title);
|
||||
}
|
||||
if(box.find(".selection-box-btn-holder button.selection-box-edit-btn").length == 0){
|
||||
box.find(".selection-box-btn-holder").append("<button class='selection-box-edit-btn btn btn-small' for='" + id + "'>E</button>")
|
||||
box.find(".selection-box-btn-holder").prepend("<button class='selection-box-edit-btn btn-flat btn-flat-primary btn-flat-has-icon btn-flat-small btn-flat-block' for='" + id + "'><i class='fa fa-pencil'></i>Edit</button>");
|
||||
}else{
|
||||
box.find(".selection-box-btn-holder button.selection-box-edit-btn").prop("disabled",false).attr("for",id);
|
||||
box.find(".selection-box-btn-holder button.selection-box-delete-btn").attr("for",id);
|
||||
|
|
@ -184,12 +204,12 @@
|
|||
formDisplay = false;
|
||||
formWrapper.remove();
|
||||
if(box.find(".selection-box-label").length == 0){
|
||||
box.append("<div class='selection-box-label'>" + data.unit.title + "</div>");
|
||||
box.append("<div class='selection-box-label absolute-center'>" + data.unit.title + "</div>");
|
||||
}else{
|
||||
box.find(".selection-box-label").text(data.unit.title);
|
||||
}
|
||||
if(box.find(".selection-box-btn-holder button.selection-box-edit-btn").length == 0){
|
||||
box.find(".selection-box-btn-holder").append("<button class='selection-box-edit-btn btn btn-small' for='" + data.unit.id + "'>E</button>")
|
||||
box.find(".selection-box-btn-holder").prepend("<button class='selection-box-edit-btn btn-flat btn-flat-primary btn-flat-has-icon btn-flat-small btn-flat-block' for='" + data.unit.id + "'><i class='fa fa-pencil'></i>Edit</button>")
|
||||
}else{
|
||||
box.find(".selection-box-btn-holder button.selection-box-edit-btn").prop("disabled",false).attr("for",data.unit.id);
|
||||
box.find(".selection-box-btn-holder button.selection-box-delete-btn").attr("for",data.unit.id);
|
||||
|
|
@ -221,13 +241,14 @@
|
|||
id = el.attr("for"),
|
||||
box = el.parents(".selection-box[data-unit-id=" + id + "]"),
|
||||
form = makeNewForm(box,true),
|
||||
cancelBtn = $("<button class='cancel-button btn btn-small'>Cancel</button>");
|
||||
cancelBtn = $("<button class='cancel-button btn-flat btn-flat-warning btn-flat-has-icon btn-flat-small'><i class='fa fa-times'></i>Cancel</button>");
|
||||
|
||||
cancelBtn.one("click",function(){
|
||||
el.prop("disabled",false);
|
||||
box.find(".selection-form-wrapper").remove();
|
||||
formDisplay = false;
|
||||
changesMade--;
|
||||
return false;
|
||||
})
|
||||
|
||||
el.prop("disabled",true);
|
||||
|
|
|
|||
|
|
@ -1,8 +1,13 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "lib/jquery.form" %>
|
||||
<%= javascript_include_tag "validator" %>
|
||||
<% end %>
|
||||
<table class="table main-list">
|
||||
<table class="table main-list table-flat">
|
||||
<thead>
|
||||
<tr class="sort-header">
|
||||
<% @table_fields.each do |f| %>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,13 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "space" %>
|
||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<ul class="building-showcase clearfix">
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "space/space" %>
|
||||
<% end %>
|
||||
|
||||
<ul class="building-showcase card-container list-unstyled clearfix row">
|
||||
<%= render :partial => "building", :collection => @buildings %>
|
||||
</ul>
|
||||
|
||||
|
|
@ -9,4 +15,4 @@
|
|||
<div class="action pull-right">
|
||||
<%= link_to t("space.add_building"), new_admin_space_path, :class => "btn btn-primary" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "space" %>
|
||||
<%= stylesheet_link_tag "//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<ul class="apartments-area">
|
||||
<ul class="rooms card-container list-unstyled clearfix row">
|
||||
<%= render :partial => "sub_unit", :collection => @floor_unit.floor_sub_units %>
|
||||
</ul>
|
||||
|
||||
<div class="bottomnav clearfix">
|
||||
<div class="action pull-right">
|
||||
<a href="/admin/spaces/unit/<%= @floor_unit.to_param %>/add_sub_unit" class="btn btn-primary"><%= t("space.add_sub_units") %></a>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "space" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "attrchange" %>
|
||||
|
|
@ -25,8 +26,10 @@
|
|||
var canvas = $("#full-layout-canvas"),
|
||||
layoutImage = $("#layout-image"),
|
||||
cover = canvas.find(".image-cover"),
|
||||
positionClass = "float-box-left",
|
||||
dragAreaCount = 0,
|
||||
windowHeight = ($(window).height() - (36 + 46 + 75 + 60)) + "px",
|
||||
windowHeight = ($(window).height() - (36 + 46 + 75 + 60)),
|
||||
coverImageHeight = (parseInt(windowHeight)),
|
||||
subUnits = <%= @floor_unit.floor_sub_units.asc(:title).collect{|unit| {"id" => unit.id.to_s, "title" => unit.title}}.to_json.html_safe %>,
|
||||
formDisplay = false,
|
||||
changesMade = 0,
|
||||
|
|
@ -34,11 +37,13 @@
|
|||
tmpImg = new Image();
|
||||
|
||||
canvas.height(windowHeight);
|
||||
layoutImage.height(windowHeight);
|
||||
cover.height(coverImageHeight);
|
||||
layoutImage.height(coverImageHeight - 40);
|
||||
canvas.css('box-sizing', 'border-box');
|
||||
|
||||
tmpImg.src = layoutImage.attr('src') ;
|
||||
tmpImg.onload = function() {
|
||||
cover.width(layoutImage.width());
|
||||
cover.width(layoutImage.width() + 40);
|
||||
// cover.css("left",((layoutImage.position().left * 100) / canvas.width()) + "%");
|
||||
}
|
||||
|
||||
|
|
@ -49,14 +54,27 @@
|
|||
diffY = 0,
|
||||
currentDragBox = null,
|
||||
isDragging = false;
|
||||
|
||||
// cover.hover(function(){
|
||||
// cover.addClass("hover");
|
||||
// },function(){
|
||||
// cover.removeClass("hover");
|
||||
// if(currentDragBox != null){
|
||||
// isDragging = false;
|
||||
// makeBoxPermanent();
|
||||
// }
|
||||
// })
|
||||
|
||||
cover.on("mousedown",function(e){
|
||||
// e.preventDefault();
|
||||
if($(".selection-box.hover").length == 0 && !formDisplay){
|
||||
|
||||
if(currentDragBox != null){
|
||||
currentDragBox.remove();
|
||||
currentDragBox = null;
|
||||
$(".make-box-permanent").remove();
|
||||
}
|
||||
var dragBox = $("<div class='selection-box'></div>"),
|
||||
var dragBox = $("<div class='selection-box overlay'></div>"),
|
||||
xpercent = ((e.offsetX * 100) / cover.width()) + "%",
|
||||
ypercent = ((e.offsetY * 100) / cover.height()) + "%";
|
||||
dragBox.css({
|
||||
|
|
@ -70,24 +88,39 @@
|
|||
cover.append(dragBox);
|
||||
}
|
||||
})
|
||||
|
||||
var tempX = 0,
|
||||
tempY = 0;
|
||||
cover.on("mousemove",function(e){
|
||||
e.preventDefault();
|
||||
if(isDragging){
|
||||
diffX = e.offsetX - offsetX;
|
||||
diffY = e.offsetY - offsetY;
|
||||
currentDragBox.css({
|
||||
width : diffX + "px",
|
||||
height : diffY + "px"
|
||||
})
|
||||
if(diffX > 0 && diffY > 0){
|
||||
console.log("Difference :", diffX, diffY);
|
||||
console.log("Old :", tempX, tempY);
|
||||
tempX = diffX;
|
||||
tempY = diffY;
|
||||
if(diffX >= tempX && diffY >= tempY){
|
||||
currentDragBox.css({
|
||||
width : diffX + "px",
|
||||
height : diffY + "px"
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
cover.on("mouseup",function(){
|
||||
if(isDragging){
|
||||
isDragging = false;
|
||||
if(currentDragBox.width() > 20 && currentDragBox.height() > 20){
|
||||
var offset = currentDragBox.offset(),
|
||||
btn = $("<button class='make-box-permanent btn btn-primary btn-small'><i class='fa fa-check'></i> Ok</button>");
|
||||
makeBoxPermanent();
|
||||
}
|
||||
})
|
||||
|
||||
var makeBoxPermanent = function(){
|
||||
if(currentDragBox.width() > 20 && currentDragBox.height() > 20){
|
||||
var offset = currentDragBox.offset(),
|
||||
btn = $("<button class='make-box-permanent btn-flat btn-flat-has-icon btn-flat-primary btn-flat-small absolute-center'><i class='fa fa-check'></i>OK</button>");
|
||||
btn.on("click",selectAreaOkBtnHandler);
|
||||
currentDragBox.append(btn);
|
||||
currentDragBox.hover(function(){
|
||||
|
|
@ -98,13 +131,15 @@
|
|||
}else{
|
||||
currentDragBox.remove();
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var selectAreaOkBtnHandler = function(event){
|
||||
$(this).remove();
|
||||
var deleteBtn = $("<button class='btn btn-small btn-danger selection-box-delete-btn' for='temp_unit_id_" + dragAreaCount + "'><i class='fa fa-times'></i></button>"),
|
||||
btnHolder = $("<div class='selection-box-btn-holder'></div>");
|
||||
if(parseInt(currentDragBox.css("left")) < 195){
|
||||
positionClass = "float-box-right";
|
||||
}
|
||||
var deleteBtn = $("<button class='btn-flat btn-flat-small btn-flat-danger btn-flat-has-icon btn-flat-has-margin selection-box-delete-btn btn-flat-block' for='temp_unit_id_" + dragAreaCount + "'><i class='fa fa-trash-o'></i>Delete</button>"),
|
||||
btnHolder = $("<div class='selection-box-btn-holder float-box " + positionClass + "'></div>");
|
||||
btnHolder.append(deleteBtn);
|
||||
currentDragBox.append(btnHolder);
|
||||
currentDragBox.css({
|
||||
|
|
@ -122,9 +157,9 @@
|
|||
|
||||
var makeNewForm = function(box,edit){
|
||||
formDisplay = true;
|
||||
var formWrapper = $("<div class='selection-form-wrapper' />"),
|
||||
form = $("<form class='selection-box-form form-horizontal' />"),
|
||||
field = "<div class='control-group'> <label calss='control-label muted' for='floor_unit_title'>Unit name : </label><img src='/assets/preloader.gif' style='width:50px; height:50px; display:none;' /><div class='form-unit-title'><input id='floor_unit_title' type='text' name='floor_unit[title]' placeholder='New unit title' /><select style='display:none;'>";
|
||||
var formWrapper = $("<div class='selection-form-wrapper float-box " + positionClass + "' />"),
|
||||
form = $("<form class='selection-box-form form-horizontal form-horizontal-flat' />"),
|
||||
field = "<div class='control-group control-group-flat'> <label class='control-label muted control-label-flat floor-unit-title' for='floor_unit_title'><i class='fa fa-cube'></i>Unit name : </label><img src='/assets/preloader.gif' style='width:50px; height:50px; display:none;' /><div class='form-unit-title'><input class='input-flat' id='floor_unit_title' type='text' name='floor_unit[title]' placeholder='New unit title' /><select class='select-flat' style='display:none;'>";
|
||||
|
||||
for(index = 0; index < subUnits.length; index++){
|
||||
var unit = subUnits[index];
|
||||
|
|
@ -132,7 +167,7 @@
|
|||
}
|
||||
|
||||
field += "</select></div></div>";
|
||||
var checkbox = $("<div class='control-group'><div><input type='checkbox' id='toggle-select-text' /> Select existing units</div></div>"),
|
||||
var checkbox = $("<div class='control-group control-group-flat'><div class='toggle-select-wrap'><input class='checkbox-flat' type='checkbox' id='toggle-select-text' /><label class='control-label-flat' for='toggle-select-text'>Select existing units</label></div></div>"),
|
||||
type = (edit ? "existing" : "new");
|
||||
checkbox.find("input[type=checkbox]").on("click",function(){
|
||||
if($(this).is(":checked")){
|
||||
|
|
@ -146,7 +181,19 @@
|
|||
}
|
||||
})
|
||||
|
||||
var submitBtn = $("<div class='control-group'><div class='form-action-btn-holder'><button class='btn btn-small btn-primary'>Save</button></div>");
|
||||
var submitBtn = $("<div class='control-group control-group-flat control-group-flat-last'><div class='form-action-btn-holder no-wrap'><button class='btn-flat btn-flat-small btn-flat-primary btn-flat-has-icon btn-flat-has-margin'><i class='fa fa-floppy-o'></i>Save</button></div>");
|
||||
|
||||
if(type == "new"){
|
||||
var deleteBtn = $("<button class='btn-flat btn-flat-small btn-flat-danger btn-flat-has-icon btn-flat-has-margin' ><i class='fa fa-trash-o'></i>Delete</button>");
|
||||
deleteBtn.one("click",function(){
|
||||
formDisplay = false;
|
||||
changesMade--;
|
||||
box.remove();
|
||||
return false;
|
||||
})
|
||||
submitBtn.find(".form-action-btn-holder").append(deleteBtn);
|
||||
}
|
||||
|
||||
submitBtn.find("button").on("click",function(){
|
||||
if(type == "existing"){
|
||||
var id = form.find("select").val(),
|
||||
|
|
@ -154,12 +201,12 @@
|
|||
box.attr("data-unit-id",id);
|
||||
box.find(".selection-box-delete-btn").attr("for",id);
|
||||
if(box.find(".selection-box-label").length == 0){
|
||||
box.append("<div class='selection-box-label'>" + unit[0].title + "</div>");
|
||||
box.append("<div class='selection-box-label absolute-bottom'>" + unit[0].title + "</div>");
|
||||
}else{
|
||||
box.find(".selection-box-label").text(unit[0].title);
|
||||
}
|
||||
if(box.find(".selection-box-btn-holder button.selection-box-edit-btn").length == 0){
|
||||
box.find(".selection-box-btn-holder").append("<button class='selection-box-edit-btn btn btn-small' for='" + id + "'>E</button>")
|
||||
box.find(".selection-box-btn-holder").prepend("<button class='selection-box-edit-btn btn-flat btn-flat-primary btn-flat-has-icon btn-flat-small btn-flat-block' for='" + id + "'><i class='fa fa-pencil'></i>Edit</button>");
|
||||
}else{
|
||||
box.find(".selection-box-btn-holder button.selection-box-edit-btn").prop("disabled",false).attr("for",id);
|
||||
box.find(".selection-box-btn-holder button.selection-box-delete-btn").attr("for",id);
|
||||
|
|
@ -184,12 +231,12 @@
|
|||
formDisplay = false;
|
||||
formWrapper.remove();
|
||||
if(box.find(".selection-box-label").length == 0){
|
||||
box.append("<div class='selection-box-label'>" + data.unit.title + "</div>");
|
||||
box.append("<div class='selection-box-label absolute-center'>" + data.unit.title + "</div>");
|
||||
}else{
|
||||
box.find(".selection-box-label").text(data.unit.title);
|
||||
}
|
||||
if(box.find(".selection-box-btn-holder button.selection-box-edit-btn").length == 0){
|
||||
box.find(".selection-box-btn-holder").append("<button class='selection-box-edit-btn btn btn-small' for='" + data.unit.id + "'>E</button>")
|
||||
box.find(".selection-box-btn-holder").prepend("<button class='selection-box-edit-btn btn-flat btn-flat-primary btn-flat-has-icon btn-flat-small btn-flat-block' for='" + data.unit.id + "'><i class='fa fa-pencil'></i>Edit</button>")
|
||||
}else{
|
||||
box.find(".selection-box-btn-holder button.selection-box-edit-btn").prop("disabled",false).attr("for",data.unit.id);
|
||||
box.find(".selection-box-btn-holder button.selection-box-delete-btn").attr("for",data.unit.id);
|
||||
|
|
@ -223,13 +270,14 @@
|
|||
id = el.attr("for"),
|
||||
box = el.parents(".selection-box[data-unit-id=" + id + "]"),
|
||||
form = makeNewForm(box,true),
|
||||
cancelBtn = $("<button class='cancel-button btn btn-small'>Cancel</button>");
|
||||
cancelBtn = $("<button class='cancel-button btn-flat btn-flat-warning btn-flat-has-icon btn-flat-small'><i class='fa fa-times'></i>Cancel</button>");
|
||||
|
||||
cancelBtn.one("click",function(){
|
||||
el.prop("disabled",false);
|
||||
box.find(".selection-form-wrapper").remove();
|
||||
formDisplay = false;
|
||||
changesMade--;
|
||||
return false;
|
||||
})
|
||||
|
||||
el.prop("disabled",true);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,12 @@
|
|||
<% content_for :page_specific_css do %>
|
||||
<%= stylesheet_link_tag "space" %>
|
||||
<%= stylesheet_link_tag "https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" %>
|
||||
<%= stylesheet_link_tag "//cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css" %>
|
||||
<%= stylesheet_link_tag "spaces" %>
|
||||
<% end %>
|
||||
<ul class="apartments-area">
|
||||
<% content_for :page_specific_javascript do %>
|
||||
<%= javascript_include_tag "space/space" %>
|
||||
<% end %>
|
||||
<ul class="apartments-area card-container list-unstyled clearfix row">
|
||||
<%= render :partial => "floor_unit", :collection => @floor.floor_units.asc(:title) %>
|
||||
</ul>
|
||||
<div class="bottomnav clearfix">
|
||||
|
|
|
|||
|
|
@ -1,2 +1,2 @@
|
|||
<% OrbitHelper.render_css_in_head(["space.scss"]) %>
|
||||
<% OrbitHelper.render_css_in_head(["space-frontend.scss"]) %>
|
||||
<%= render_view %>
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
<% OrbitHelper.render_css_in_head(["space.scss"]) %>
|
||||
<% OrbitHelper.render_css_in_head(["space-frontend.scss"]) %>
|
||||
<%= render_view %>
|
||||
|
|
@ -28,6 +28,7 @@ Rails.application.routes.draw do
|
|||
|
||||
get "spaces/unit/:unit_id/add_sub_unit", to: 'spaces#add_sub_unit'
|
||||
get "spaces/sub_unit/:sub_unit_id/edit", to: 'spaces#edit_sub_unit'
|
||||
delete "spaces/sub_unit/:sub_unit_id/delete", to: 'spaces#destroy_sub_unit'
|
||||
|
||||
delete "spaces/unit/:unit_id/delete", to: 'spaces#delete_floor_unit'
|
||||
delete "spaces/floor/:floor_id/delete", to: 'spaces#delete_floor'
|
||||
|
|
|
|||
Loading…
Reference in New Issue