mirror of
https://github.com/beestat/app.git
synced 2025-05-24 02:14:03 -04:00
Made visualize semi-public
This commit is contained in:
Jon Ziebell
parent
37785fe1bc
commit
2c16f24c16
@ -18,30 +18,52 @@ beestat.extend(beestat.component.card.visualize_intro, beestat.component.card);
|
||||
beestat.component.card.visualize_intro.prototype.decorate_contents_ = function(parent) {
|
||||
const self = this;
|
||||
|
||||
const p1 = document.createElement('p');
|
||||
p1.innerText = 'You now have early access to the new Visualize features. This is a work-in-progress, but you should find it to be mostly stable. More features and improvements are in the works.';
|
||||
parent.appendChild(p1);
|
||||
if (beestat.user.has_early_access() === true) {
|
||||
const p1 = document.createElement('p');
|
||||
p1.innerText = 'You now have early access to the new Visualize features. This is a work-in-progress, but you should find it to be mostly stable. More features and improvements are in the works.';
|
||||
parent.appendChild(p1);
|
||||
|
||||
const p2 = document.createElement('p');
|
||||
p2.innerText = 'Please reach out on Discord or email contact@beestat.io with feedback. Thank you for your support!';
|
||||
parent.appendChild(p2);
|
||||
const p2 = document.createElement('p');
|
||||
p2.innerText = 'Please reach out on Discord or email contact@beestat.io with feedback. Thank you for your support!';
|
||||
parent.appendChild(p2);
|
||||
|
||||
const center_container = document.createElement('div');
|
||||
center_container.style.textAlign = 'center';
|
||||
parent.appendChild(center_container);
|
||||
const center_container = document.createElement('div');
|
||||
center_container.style.textAlign = 'center';
|
||||
parent.appendChild(center_container);
|
||||
|
||||
new beestat.component.tile()
|
||||
.set_icon('plus')
|
||||
.set_text('Create a floor plan')
|
||||
.set_size('large')
|
||||
.set_background_color(beestat.style.color.green.dark)
|
||||
.set_background_hover_color(beestat.style.color.green.light)
|
||||
.render($(center_container))
|
||||
.addEventListener('click', function() {
|
||||
new beestat.component.modal.create_floor_plan(
|
||||
self.thermostat_id_
|
||||
).render();
|
||||
});
|
||||
new beestat.component.tile()
|
||||
.set_icon('plus')
|
||||
.set_text('Create a floor plan')
|
||||
.set_size('large')
|
||||
.set_background_color(beestat.style.color.green.dark)
|
||||
.set_background_hover_color(beestat.style.color.green.light)
|
||||
.render($(center_container))
|
||||
.addEventListener('click', function() {
|
||||
new beestat.component.modal.create_floor_plan(
|
||||
self.thermostat_id_
|
||||
).render();
|
||||
});
|
||||
} else {
|
||||
parent.style('background', beestat.style.color.green.base);
|
||||
|
||||
const p3 = document.createElement('p');
|
||||
p3.innerText = 'This feature is still in early access! If you\'d like to try it out, become a supporter now. Expected public release date is November.';
|
||||
parent.appendChild(p3);
|
||||
|
||||
new beestat.component.tile()
|
||||
.set_icon('heart')
|
||||
.set_size('large')
|
||||
.set_text([
|
||||
'Support this project on Patreon!',
|
||||
'Your contribution matters'
|
||||
])
|
||||
.set_background_color(beestat.style.color.green.dark)
|
||||
.set_background_hover_color(beestat.style.color.green.light)
|
||||
.addEventListener('click', function() {
|
||||
window.open('https://www.patreon.com/beestat');
|
||||
})
|
||||
.render(parent);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
40
js/component/card/visualize_video.js
Normal file
40
js/component/card/visualize_video.js
Normal file
@ -0,0 +1,40 @@
|
||||
/**
|
||||
* Visualize video.
|
||||
*/
|
||||
beestat.component.card.visualize_video = function() {
|
||||
beestat.component.card.apply(this, arguments);
|
||||
};
|
||||
beestat.extend(beestat.component.card.visualize_video, beestat.component.card);
|
||||
|
||||
/**
|
||||
* Decorate.
|
||||
*
|
||||
* @param {rocket.Elements} parent
|
||||
*/
|
||||
beestat.component.card.visualize_video.prototype.decorate_ = function(parent) {
|
||||
const container = document.createElement('div');
|
||||
/**
|
||||
* The 16:9 aspect ratio corresponds to a height that is 56.25% of the width.
|
||||
* https://www.ankursheel.com/blog/full-width-you-tube-video-embed
|
||||
*/
|
||||
Object.assign(container.style, {
|
||||
'position': 'relative',
|
||||
'padding-bottom': '56.25%',
|
||||
'height': '0'
|
||||
});
|
||||
parent.appendChild(container);
|
||||
|
||||
const iframe = document.createElement('iframe');
|
||||
Object.assign(iframe.style, {
|
||||
'position': 'absolute',
|
||||
'top': '0',
|
||||
'left': '0',
|
||||
'width': '100%',
|
||||
'height': '100%'
|
||||
});
|
||||
iframe.setAttribute('src', 'https://player.vimeo.com/video/751478276?h=584bebb57b');
|
||||
iframe.setAttribute('frameborder', '0');
|
||||
iframe.setAttribute('allow', 'autoplay; fullscreen; picture-in-picture');
|
||||
iframe.setAttribute('allowfullscreen', 'allowfullscreen');
|
||||
container.appendChild(iframe);
|
||||
};
|
||||
@ -24,60 +24,33 @@ beestat.component.header.prototype.rerender_on_breakpoint_ = true;
|
||||
beestat.component.header.prototype.decorate_ = function(parent) {
|
||||
var self = this;
|
||||
|
||||
var pages;
|
||||
|
||||
if (beestat.user.has_early_access() === true) {
|
||||
pages = [
|
||||
{
|
||||
'layer': 'detail',
|
||||
'text': 'Detail',
|
||||
'icon': 'eye_circle'
|
||||
},
|
||||
{
|
||||
'layer': 'analyze',
|
||||
'text': 'Analyze',
|
||||
'icon': 'home_search'
|
||||
},
|
||||
{
|
||||
'layer': 'visualize',
|
||||
'text': 'Visualize',
|
||||
'icon': 'floor_plan'
|
||||
},
|
||||
{
|
||||
'layer': 'compare',
|
||||
'text': 'Compare',
|
||||
'icon': 'earth'
|
||||
},
|
||||
{
|
||||
'layer': 'air_quality',
|
||||
'text': 'Air Quality',
|
||||
'icon': 'weather_windy'
|
||||
}
|
||||
];
|
||||
} else {
|
||||
pages = [
|
||||
{
|
||||
'layer': 'detail',
|
||||
'text': 'Detail',
|
||||
'icon': 'eye_circle'
|
||||
},
|
||||
{
|
||||
'layer': 'analyze',
|
||||
'text': 'Analyze',
|
||||
'icon': 'home_search'
|
||||
},
|
||||
{
|
||||
'layer': 'compare',
|
||||
'text': 'Compare',
|
||||
'icon': 'earth'
|
||||
},
|
||||
{
|
||||
'layer': 'air_quality',
|
||||
'text': 'Air Quality',
|
||||
'icon': 'weather_windy'
|
||||
}
|
||||
];
|
||||
}
|
||||
var pages = [
|
||||
{
|
||||
'layer': 'detail',
|
||||
'text': 'Detail',
|
||||
'icon': 'eye_circle'
|
||||
},
|
||||
{
|
||||
'layer': 'analyze',
|
||||
'text': 'Analyze',
|
||||
'icon': 'home_search'
|
||||
},
|
||||
{
|
||||
'layer': 'visualize',
|
||||
'text': 'Visualize',
|
||||
'icon': 'floor_plan'
|
||||
},
|
||||
{
|
||||
'layer': 'compare',
|
||||
'text': 'Compare',
|
||||
'icon': 'earth'
|
||||
},
|
||||
{
|
||||
'layer': 'air_quality',
|
||||
'text': 'Air Quality',
|
||||
'icon': 'weather_windy'
|
||||
}
|
||||
];
|
||||
|
||||
pages.push();
|
||||
|
||||
|
||||
@ -89,6 +89,7 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
|
||||
echo '<script src="/js/component/card/visualize_intro.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/card/visualize_affiliate.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/card/contribute.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/card/visualize_video.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/chart.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/chart/runtime_thermostat_summary.js"></script>' . PHP_EOL;
|
||||
echo '<script src="/js/component/chart/temperature_profiles.js"></script>' . PHP_EOL;
|
||||
|
||||
@ -83,6 +83,12 @@ beestat.layer.visualize.prototype.decorate_ = function(parent) {
|
||||
'size': 12
|
||||
}
|
||||
]);
|
||||
cards.push([
|
||||
{
|
||||
'card': new beestat.component.card.visualize_video(),
|
||||
'size': 12
|
||||
}
|
||||
]);
|
||||
}
|
||||
|
||||
// Footer
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user