1
0
mirror of https://github.com/beestat/app.git synced 2025-07-31 14:33:51 -04:00

Made new contribute page live

This commit is contained in:
Jon Ziebell 2022-10-19 21:15:33 -04:00
parent cb66d0439c
commit 019abf7187
11 changed files with 122 additions and 428 deletions

View File

@ -33,7 +33,7 @@ beestat.user.stripe_is_active = function() {
}; };
/** /**
* Determine whether or not hte current user is an active contributor. * Determine whether or not the current user is an active contributor.
* *
* @return {boolean} * @return {boolean}
*/ */

View File

@ -222,7 +222,7 @@ beestat.component.card.contribute.prototype.decorate_contents_ = function(parent
.set_background_color(beestat.style.color.bluegray.light) .set_background_color(beestat.style.color.bluegray.light)
.set_background_hover_color(beestat.style.color.lightblue.base) .set_background_hover_color(beestat.style.color.lightblue.base)
.set_text_color('#fff') .set_text_color('#fff')
.set_text('Pay ' + frequency.charAt(0).toUpperCase() + frequency.slice(1) + 'ly'); .set_text('Give ' + frequency.charAt(0).toUpperCase() + frequency.slice(1) + 'ly');
tile_group_frequency.add_tile(tile_frequency); tile_group_frequency.add_tile(tile_frequency);
if (frequency === self.state_.contribute_interval) { if (frequency === self.state_.contribute_interval) {

View File

@ -26,7 +26,8 @@ beestat.component.card.contribute_benefits.prototype.decorate_contents_ = functi
const benefits = [ const benefits = [
'Early access to new features', 'Early access to new features',
'Private Discord membership', 'Private Discord membership',
'More frequent data syncing' 'More frequent data syncing',
'Removed contribute banner'
]; ];
benefits.forEach(function(benefit) { benefits.forEach(function(benefit) {
new beestat.component.tile() new beestat.component.tile()
@ -35,7 +36,7 @@ beestat.component.card.contribute_benefits.prototype.decorate_contents_ = functi
.set_icon('octagram') .set_icon('octagram')
.set_text(benefit) .set_text(benefit)
.style({ .style({
'margin-bottom': `${beestat.style.size.gutter}px` 'margin-bottom': `${beestat.style.size.gutter / 2}px`
}) })
.render($(benefit_container)); .render($(benefit_container));
}); });

View File

@ -1,91 +1,91 @@
/** /**
* Green Patreon banner asking people for money. $_$ * Green banner asking people for money. $_$
*/ */
beestat.component.card.patreon = function() { beestat.component.card.contribute_reminder = function() {
var self = this; var self = this;
beestat.dispatcher.addEventListener([ beestat.dispatcher.addEventListener([
'cache.user', 'cache.user',
'setting.patreon_hide_until' 'setting.contribute_reminder_hide_until'
], function() { ], function() {
self.rerender(); self.rerender();
}); });
beestat.component.card.apply(this, arguments); beestat.component.card.apply(this, arguments);
}; };
beestat.extend(beestat.component.card.patreon, beestat.component.card); beestat.extend(beestat.component.card.contribute_reminder, beestat.component.card);
beestat.component.card.patreon.prototype.decorate_contents_ = function(parent) { beestat.component.card.contribute_reminder.prototype.decorate_contents_ = function(parent) {
var self = this; var self = this;
// Don't render anything if the user is an active Patron. // Don't render anything if the user is an active Patron.
if (beestat.component.card.patreon.should_show() === false) { if (beestat.component.card.contribute_reminder.should_show() === false) {
window.setTimeout(function() { window.setTimeout(function() {
self.dispose(); self.dispose();
}, 0); }, 0);
return; return;
} }
parent.style('background', beestat.style.color.green.base); parent.style('background', beestat.style.color.green.base);
new beestat.component.tile() new beestat.component.tile()
.set_icon('heart') .set_icon('heart')
.set_size('large') .set_size('large')
.set_text([ .set_text([
'Support this project on Patreon!', 'Support this project!',
'Your contribution matters' 'Your contribution matters'
]) ])
.set_background_color(beestat.style.color.green.dark) .set_background_color(beestat.style.color.green.dark)
.set_background_hover_color(beestat.style.color.green.light) .set_background_hover_color(beestat.style.color.green.light)
.addEventListener('click', function() { .addEventListener('click', function() {
window.open('https://www.patreon.com/beestat'); new beestat.layer.contribute().render();
}) })
.render(parent); .render(parent);
}; };
/** /**
* Get the title of the card. * Get the title of the card.
* *
* @return {string} The title. * @return {string} The title.
*/ */
beestat.component.card.patreon.prototype.get_title_ = function() { beestat.component.card.contribute_reminder.prototype.get_title_ = function() {
return 'Enjoy beestat?'; return 'Enjoy beestat?';
}; };
/** /**
* Decorate the close button. * Decorate the close button.
* *
* @param {rocket.Elements} parent * @param {rocket.Elements} parent
*/ */
beestat.component.card.patreon.prototype.decorate_top_right_ = function(parent) { beestat.component.card.contribute_reminder.prototype.decorate_top_right_ = function(parent) {
new beestat.component.tile() new beestat.component.tile()
.set_type('pill') .set_type('pill')
.set_shadow(false) .set_shadow(false)
.set_icon('close') .set_icon('close')
.set_text_color('#fff') .set_text_color('#fff')
.set_background_hover_color(beestat.style.color.green.light) .set_background_hover_color(beestat.style.color.green.light)
.addEventListener('click', function() { .addEventListener('click', function() {
(new beestat.component.modal.enjoy_beestat()).render(); (new beestat.component.modal.enjoy_beestat()).render();
}) })
.render(parent); .render(parent);
}; };
/** /**
* Determine whether or not this card should be shown. * Determine whether or not this card should be shown.
* *
* @return {boolean} Whether or not to show the card. * @return {boolean} Whether or not to show the card.
*/ */
beestat.component.card.patreon.should_show = function() { beestat.component.card.contribute_reminder.should_show = function() {
if ( if (
beestat.user.patreon_is_active() === true || beestat.user.contribution_is_active() === true ||
window.is_demo === true || window.is_demo === true ||
( (
beestat.setting('patreon_hide_until') !== undefined && beestat.setting('contribute_reminder_hide_until') !== undefined &&
moment.utc(beestat.setting('patreon_hide_until')).isAfter(moment.utc()) moment.utc(beestat.setting('contribute_reminder_hide_until')).isAfter(moment.utc())
) )
) { ) {
return false; return false;
} }
return true; return true;
}; };

View File

@ -336,11 +336,4 @@ beestat.component.card.settings.prototype.decorate_top_right_ = function(parent)
.set_callback(function() { .set_callback(function() {
window.open('https://doc.beestat.io/9d01e7256390473ca8121d4098d91c9d'); window.open('https://doc.beestat.io/9d01e7256390473ca8121d4098d91c9d');
})); }));
menu.add_menu_item(new beestat.component.menu_item()
.set_text('Contribute (New)')
.set_icon('credit_card_lock')
.set_callback(function() {
new beestat.layer.contribute().render();
}));
}; };

View File

@ -54,13 +54,13 @@ beestat.component.card.visualize_intro.prototype.decorate_contents_ = function(p
.set_icon('heart') .set_icon('heart')
.set_size('large') .set_size('large')
.set_text([ .set_text([
'Support this project on Patreon!', 'Support this project!',
'Your contribution matters' 'Your contribution matters'
]) ])
.set_background_color(beestat.style.color.green.dark) .set_background_color(beestat.style.color.green.dark)
.set_background_hover_color(beestat.style.color.green.light) .set_background_hover_color(beestat.style.color.green.light)
.addEventListener('click', function() { .addEventListener('click', function() {
window.open('https://www.patreon.com/beestat'); new beestat.layer.contribute().render();
}) })
.render(parent); .render(parent);
} }

View File

@ -155,6 +155,15 @@ beestat.component.header.prototype.decorate_ = function(parent) {
})); }));
} }
if (window.is_demo === false) {
menu.add_menu_item(new beestat.component.menu_item()
.set_text('Support beestat')
.set_icon('heart')
.set_callback(function() {
new beestat.layer.contribute().render();
}));
}
var announcements_menu_item = new beestat.component.menu_item() var announcements_menu_item = new beestat.component.menu_item()
.set_text('Announcements') .set_text('Announcements')
.set_icon('bullhorn') .set_icon('bullhorn')
@ -176,25 +185,6 @@ beestat.component.header.prototype.decorate_ = function(parent) {
(new beestat.component.modal.download_data()).render(); (new beestat.component.modal.download_data()).render();
})); }));
if (window.is_demo === false) {
if (beestat.user.patreon_is_connected() === false) {
menu.add_menu_item(new beestat.component.menu_item()
.set_text('Link Patreon')
.set_icon('patreon')
.set_callback(function() {
(new beestat.component.modal.patreon_status()).render();
window.open('../api/?resource=patreon&method=authorize&arguments={}&api_key=ER9Dz8t05qUdui0cvfWi5GiVVyHP6OB8KPuSisP2');
}));
} else {
menu.add_menu_item(new beestat.component.menu_item()
.set_text('Patreon Status')
.set_icon('patreon')
.set_callback(function() {
(new beestat.component.modal.patreon_status()).render();
}));
}
}
menu.add_menu_item(new beestat.component.menu_item() menu.add_menu_item(new beestat.component.menu_item()
.set_text('Settings') .set_text('Settings')
.set_icon('cog') .set_icon('cog')

View File

@ -1,5 +1,5 @@
/** /**
* Options for hiding the patreon card. * Options for hiding the contribute reminder.
*/ */
beestat.component.modal.enjoy_beestat = function() { beestat.component.modal.enjoy_beestat = function() {
beestat.component.modal.apply(this, arguments); beestat.component.modal.apply(this, arguments);
@ -12,15 +12,8 @@ beestat.extend(beestat.component.modal.enjoy_beestat, beestat.component.modal);
* @param {rocket.Elements} parent * @param {rocket.Elements} parent
*/ */
beestat.component.modal.enjoy_beestat.prototype.decorate_contents_ = function(parent) { beestat.component.modal.enjoy_beestat.prototype.decorate_contents_ = function(parent) {
if ( parent.appendChild($.createElement('p').innerHTML('Beestat is completely free to use and does not run ads or sell your data. If you want to help, <strong>consider supporting the project</strong>. Among other benefits, it will hide this banner permanently.'));
beestat.user.patreon_is_connected() === true && parent.appendChild($.createElement('p').innerHTML('If you prefer not to give, you can hide this banner. Please keep using and enjoying beestat! :)'));
beestat.user.patreon_is_active() === false
) {
parent.appendChild($.createElement('p').innerText('Your Patreon account is connected but you\'re not currently a supporter. If you recently became a supporter it could take up to 24 hours to update.'));
} else {
parent.appendChild($.createElement('p').innerHTML('Beestat is completely free to use and does not run ads or sell your data. If you want to help, <strong>consider supporting the project on <a href="https://patreon.com/beestat" target="_blank" class="inverted">Patreon</a></strong>. Among other benefits, it will hide this banner permanently.'));
parent.appendChild($.createElement('p').innerHTML('Not into Patreon or can\'t afford to give? <a href="https://doc.beestat.io/bf7f099eb8de486bad51aa6245c00891" target="_blank" class="inverted">Here are some other ways to help</a>.'));
}
}; };
/** /**
@ -33,14 +26,14 @@ beestat.component.modal.enjoy_beestat.prototype.get_title_ = function() {
}; };
/** /**
* Hide the Patreon card for some amount of time. * Hide the contribute reminder for some amount of time.
* *
* @param {number} amount How long. * @param {number} amount How long.
* @param {string} unit The unit (day, month, etc). * @param {string} unit The unit (day, month, etc).
*/ */
beestat.component.modal.enjoy_beestat.prototype.hide_patreon_card_for_ = function(amount, unit) { beestat.component.modal.enjoy_beestat.prototype.hide_contribute_reminder_ = function(amount, unit) {
beestat.setting( beestat.setting(
'patreon_hide_until', 'contribute_reminder_hide_until',
moment().utc() moment().utc()
.add(amount, unit) .add(amount, unit)
.format('YYYY-MM-DD HH:mm:ss') .format('YYYY-MM-DD HH:mm:ss')
@ -62,39 +55,22 @@ beestat.component.modal.enjoy_beestat.prototype.get_buttons_ = function() {
.set_text_hover_color(beestat.style.color.bluegray.base) .set_text_hover_color(beestat.style.color.bluegray.base)
.set_text('Hide for one month') .set_text('Hide for one month')
.addEventListener('click', function() { .addEventListener('click', function() {
self.hide_patreon_card_for_(1, 'month'); self.hide_contribute_reminder_(1, 'month');
self.dispose(); self.dispose();
}); });
if (beestat.user.patreon_is_connected() === false) { var link = new beestat.component.tile()
var link = new beestat.component.tile() .set_text('Support beestat')
.set_text('Link Patreon') .set_icon('heart')
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')
.addEventListener('click', function() {
self.dispose();
(new beestat.component.modal.patreon_status()).render();
window.open('../api/?resource=patreon&method=authorize&arguments={}&api_key=ER9Dz8t05qUdui0cvfWi5GiVVyHP6OB8KPuSisP2');
});
return [
hide,
link
];
}
var ok = new beestat.component.tile()
.set_background_color(beestat.style.color.green.base) .set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light) .set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff') .set_text_color('#fff')
.set_text('OK')
.addEventListener('click', function() { .addEventListener('click', function() {
self.dispose(); new beestat.layer.contribute().render();
}); });
return [ return [
hide, hide,
ok link
]; ];
}; };

View File

@ -1,265 +0,0 @@
/**
* Patreon Status.
*/
beestat.component.modal.patreon_status = function() {
var self = this;
beestat.dispatcher.addEventListener(
'cache.user',
function() {
self.rerender();
}
);
beestat.component.modal.apply(this, arguments);
};
beestat.extend(beestat.component.modal.patreon_status, beestat.component.modal);
beestat.component.modal.patreon_status.prototype.decorate_contents_ = function(parent) {
var user = beestat.user.get();
if (user.patreon_status === null) {
this.decorate_wait_(parent);
} else {
this.decorate_status_(parent);
}
};
/**
* Do some wait logic and get an updated user every 5 seconds.
*
* @param {rocket.Elements} parent
*/
beestat.component.modal.patreon_status.prototype.decorate_wait_ = function(parent) {
parent.appendChild(
$.createElement('div')
.style({
'margin-top': beestat.style.size.gutter
})
.innerText('Waiting for Patreon to connect...')
);
var api = new beestat.api();
api.add_call('user', 'read_id');
api.set_callback(function(response) {
beestat.cache.set('user', response);
});
window.setTimeout(function() {
api.send();
}, 5000);
};
/**
* Decorate the patreon details if they exist.
*
* @param {rocket.Elements} parent
*/
beestat.component.modal.patreon_status.prototype.decorate_status_ = function(parent) {
var user = beestat.user.get();
// Create our number formatter.
var formatter = new Intl.NumberFormat(
'en-US',
{
'style': 'currency',
'currency': 'USD'
}
);
var container = $.createElement('div')
.style({
'display': 'grid',
'grid-template-columns': 'repeat(auto-fill, minmax(150px, 1fr))',
'margin': '0 0 16px -16px'
});
parent.appendChild(container);
let patron_status;
switch (user.patreon_status.patron_status) {
case 'active_patron':
patron_status = 'Active Patron';
break;
case 'declined_patron':
patron_status = 'Declined Patron';
break;
case 'former_patron':
patron_status = 'Former Patron';
break;
case 'not_patron':
patron_status = 'Not Patron';
break;
default:
patron_status = 'Unknown';
break;
}
let last_charged;
switch (user.patreon_status.last_charge_date) {
case undefined:
last_charged = 'Unknown';
break;
case null:
last_charged = 'Never';
break;
default:
last_charged = moment.utc(user.patreon_status.last_charge_date).local()
.format('MMM Do, YYYY');
break;
}
let current_pledge;
switch (user.patreon_status.will_pay_amount_cents) {
case undefined:
current_pledge = 'Unknown';
break;
case null:
current_pledge = formatter.format(0);
break;
default:
current_pledge = formatter.format(user.patreon_status.will_pay_amount_cents / 100);
break;
}
let lifetime_support;
switch (user.patreon_status.lifetime_support_cents) {
case undefined:
lifetime_support = 'Unknown';
break;
case null:
lifetime_support = formatter.format(0);
break;
default:
lifetime_support = formatter.format(user.patreon_status.lifetime_support_cents / 100);
break;
}
var fields = [
{
'name': 'Status',
'value': patron_status
},
{
'name': 'Last Charged',
'value': last_charged
},
{
'name': 'Current Pledge',
'value': current_pledge
},
{
'name': 'Lifetime Support',
'value': lifetime_support
}
];
fields.forEach(function(field) {
var div = $.createElement('div')
.style({
'padding': '16px 0 0 16px'
});
container.appendChild(div);
div.appendChild($.createElement('div')
.style({
'font-weight': beestat.style.font_weight.bold,
'margin-bottom': (beestat.style.size.gutter / 4)
})
.innerText(field.name));
div.appendChild($.createElement('div').innerText(field.value));
});
if (beestat.user.patreon_is_connected() === true) {
const last_update = moment.utc(beestat.user.get().sync_status.patreon)
.local()
.fromNow();
parent.appendChild(
$.createElement('div')
.innerText('Patreon status is automatically updated every 24 hours. Your last update was ' + last_update + '.')
);
}
};
/**
* Get the modal title.
*
* @return {string} The modal title.
*/
beestat.component.modal.patreon_status.prototype.get_title_ = function() {
return 'Patreon Status';
};
/**
* Get the buttons on the modal.
*
* @return {[beestat.component.button]} The buttons.
*/
beestat.component.modal.patreon_status.prototype.get_buttons_ = function() {
const self = this;
if (beestat.user.patreon_is_connected() === true) {
const unlink = new beestat.component.tile()
.set_text('Unlink')
.set_icon('link_off')
.set_shadow(false)
.set_background_color('#fff')
.set_text_color(beestat.style.color.gray.base)
.set_text_hover_color(beestat.style.color.red.base)
.addEventListener('click', function() {
this
.removeEventListener('click');
new beestat.api()
.add_call(
'user',
'unlink_patreon_account',
{},
'unlink_patreon_account'
)
.add_call('user', 'read_id', {}, 'user')
.set_callback(function(response) {
// Update the cache.
self.dispose();
beestat.cache.set('user', response.user);
})
.send();
});
const refresh = new beestat.component.tile()
.set_text('Refresh Status')
.set_icon('refresh')
.set_background_color(beestat.style.color.green.base)
.set_background_hover_color(beestat.style.color.green.light)
.set_text_color('#fff')
.addEventListener('click', function() {
this
.set_background_color(beestat.style.color.gray.base)
.set_background_hover_color()
.removeEventListener('click');
new beestat.api()
.add_call(
'user',
'sync_patreon_status',
{},
'sync_patreon_status'
)
.add_call('user', 'read_id', {}, 'user')
.set_callback(function(response) {
// Update the cache.
beestat.cache.set('user', response.user);
})
.send();
});
return [
unlink,
refresh
];
}
return [];
};

View File

@ -72,7 +72,7 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
echo '<script src="/js/component/card/demo.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/demo.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/footer.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/footer.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/my_home.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/my_home.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/patreon.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/contribute_reminder.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/runtime_thermostat_detail.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/runtime_thermostat_detail.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/runtime_sensor_detail.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/runtime_sensor_detail.js"></script>' . PHP_EOL;
echo '<script src="/js/component/card/sensors.js"></script>' . PHP_EOL; echo '<script src="/js/component/card/sensors.js"></script>' . PHP_EOL;
@ -126,7 +126,6 @@ if($setting->get('environment') === 'dev' || $setting->get('environment') === 'd
echo '<script src="/js/component/modal/runtime_sensor_detail_custom.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/runtime_sensor_detail_custom.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/thermostat_info.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/thermostat_info.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/weather.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/weather.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/patreon_status.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/newsletter.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/newsletter.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/air_quality_detail_custom.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/air_quality_detail_custom.js"></script>' . PHP_EOL;
echo '<script src="/js/component/modal/create_floor_plan.js"></script>' . PHP_EOL; echo '<script src="/js/component/modal/create_floor_plan.js"></script>' . PHP_EOL;

View File

@ -48,10 +48,10 @@ beestat.layer.detail.prototype.decorate_ = function(parent) {
} }
]); ]);
if (beestat.component.card.patreon.should_show() === true) { if (beestat.component.card.contribute_reminder.should_show() === true) {
cards.push([ cards.push([
{ {
'card': new beestat.component.card.patreon(), 'card': new beestat.component.card.contribute_reminder(),
'size': 12 'size': 12
} }
]); ]);