vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Upgrade button in sidebar, cleanup usage page (#4227)

Browse source 
* upgrade button in sidebar, cleanup usage page

* [fix] check if in trial for sidebar

* make upgrade box dismissable

* Update list_sidebar.js
This commit is contained in:
Prateeksha Singh 2017-10-05 11:22:51 +05:30 • committed by Rushabh Mehta
parent d20f9e2895
commit a9783a2e98
4 changed files with 85 additions and 102 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

129
frappe/core/page/usage_info/usage_info.html
View file

@ -1,114 +1,75 @@
<div class="padding" style="max-width: 800px;">
<div>
{% if limits.expiry %}
<h3>{{ __("Expires in {0} days", [days_to_expiry]) }}</h3>
{{ __("Renew before: {0}", [expires_on]) }}
<br><br>
<div class="upgrade-message padding" style="border-bottom: 1px solid #d0d8dc;">
<h4>{{ __("You have {0} days left in your trial", [days_to_expiry]) }}</h4>
{% if limits.upgrade_url %}
<p>Upgrade to a premium plan with more users, storage and priority support.</p>
<button class="btn btn-primary btn-sm primary-action">Upgrade</button>
{% endif %}
</div>
{% endif %}
{% if limits.users %}
{% var users_percent = ((enabled_users / limits.users) * 100); %}
<h3>{{ __("Users") }}</h3>
<div class="usage-info-section" style="margin: 30px;">
<h4>{{ __("Users") }}</h4>
<div class="progress">
<div class="progress-bar progress-bar-{%= (users_percent < 75 ? "success" : "warning") %}" style="width: {{ users_percent }}%">
</div>
</div>
<div class="progress" style="margin-bottom: 0;">
<div class="progress-bar progress-bar-{%= (users_percent < 75 ? "success" : "warning") %}" style="width: {{ users_percent }}%">
</div>
</div>
<table class="table table-bordered">
<thead>
<tr>
<th style="width: 33%">{{ __("Current Users") }}</th>
<th style="width: 33%">{{ __("Max Users") }}</th>
<th style="width: 33%">{{ __("Remaining") }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{%= enabled_users %}</td>
<td>{%= limits.users %}</td>
<td class="{%= users_percent < 75 ? "" : "text-warning" %}">{%= limits.users - enabled_users %}</td>
</tr>
</tbody>
</table>
<br>
<p>{%= enabled_users %} out of {%= limits.users %} enabled</p>
</div>
{% endif %}
{% if limits.emails %}
<h3>{{ __("Emails sent this month") }}</h3>
<div class="usage-info-section" style="margin: 30px;">
<h4>{{ __("Emails") }}</h4>
{% var email_percent = (( emails_sent / limits.emails ) * 100); %}
{% var emails_remaining = (limits.emails - emails_sent) %}
<div class="progress">
<div class="progress" style="margin-bottom: 0;">
<div class="progress-bar progress-bar-{%= (email_percent < 75 ? "success" : "warning") %}" style="width: {{ email_percent }}%">
</div>
</div>
<table class="table table-bordered">
<thead>
<tr>
<th style="width: 33%">{{ __("Emails Sent") }}</th>
<th style="width: 33%">{{ __("Max Emails") }}</th>
<th style="width: 33%">{{ __("Remaining") }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{%= emails_sent %}</td>
<td>{%= limits.emails %}</td>
<td class="{%= (email_percent < 75) ? "" : "text-warning" %}">{%= emails_remaining %}</td>
</tr>
</tbody>
</table>
<br>
<p>{%= emails_sent %} out of {%= limits.emails %} sent this month</p>
</div>
{% endif %}
{% if limits.space %}
<h3>{{ __("Space usage") }}</h3>
<div class="usage-info-section" style="margin: 30px;">
<h4>{{ __("Space") }}</h4>
{% var database_percent = ((limits.space_usage.database_size / limits.space) * 100); %}
{% var files_percent = ((limits.space_usage.files_size / limits.space) * 100); %}
{% var backup_percent = ((limits.space_usage.backup_size / limits.space) * 100); %}
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {%= database_percent %}%">
</div>
<div class="progress-bar progress-bar-info" style="width: {%= files_percent %}%">
</div>
<div class="progress-bar progress-bar-warning" style="width: {%= backup_percent %}%">
</div>
<div class="progress" style="margin-bottom: 0;">
<div class="progress-bar" style="width: {%= database_percent %}%; background-color: #5e64ff"></div>
<div class="progress-bar" style="width: {%= files_percent %}%; background-color: #743ee2"></div>
<div class="progress-bar" style="width: {%= backup_percent %}%; background-color: #7CD6FD"></div>
</div>
<table class="table table-bordered">
<thead>
<tr>
<th style="width: 50%">{{ __("Type") }} </th>
<th style="width: 50%">{{ __("Size (MB)") }}</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="indicator-right green">{{ __("Database Size") }}</span></td>
<td>{%= limits.space_usage.database_size %} MB</td>
</tr>
<tr>
<td><span class="indicator-right purple">{{ __("Files Size") }}</span></td>
<td>{%= limits.space_usage.files_size %} MB</td>
</tr>
<tr>
<td><span class="indicator-right orange">{{ __("Backup Size") }}</span></td>
<td>{%= limits.space_usage.backup_size %} MB</td>
</tr>
<tr>
<td><b>{{ __("Total") }}</b></td>
<td><b>{%= limits.space_usage.total %} MB</b></td>
</tr>
<tr>
<td><b>{{ __("Remaining") }}</b></td>
<td class="{%= ((limits.space - limits.space_usage.total) > 50) ? "" : "text-warning" %}">
<b>{%= flt(limits.space - limits.space_usage.total, 2) %} MB</b></td>
</tr>
</tbody>
</table>
<span class="indicator blue" style="margin-right: 20px;">
{{ __("Database Size:") }} {%= limits.space_usage.files_size %} MB
</span>
<span class="indicator purple" style="margin-right: 20px;">
{{ __("Files Size:") }} {%= limits.space_usage.files_size %} MB
</span>
<span class="indicator lightblue" style="margin-right: 20px;">
{{ __("Backup Size:") }} {%= limits.space_usage.backup_size %} MB
</span>
<p>
<span class="{%= ((limits.space - limits.space_usage.total) > 50) ? "" : "text-warning" %}">
<b>{%= flt(limits.space - limits.space_usage.total, 2) %} MB</b></span>
available out of
<span><b>{%= limits.space %} MB</b></span>
</p>
</div>
{% endif %}
</div>

9
frappe/core/page/usage_info/usage_info.js
View file

@ -18,12 +18,9 @@ frappe.pages['usage-info'].on_page_load = function(wrapper) {
$(frappe.render_template("usage_info", usage_info)).appendTo(page.main);
var btn_text = usage_info.limits.users == 1 ? __("Upgrade") : __("Renew / Upgrade");
if(usage_info.upgrade_url) {
page.set_primary_action(btn_text, function() {
window.open(usage_info.upgrade_url);
});
}
$(page.main).find('.btn-primary').html(btn_text).on('click', () => {
window.open(usage_info.upgrade_url);
});
}
});

42
frappe/public/js/frappe/list/list_sidebar.js
View file

@ -28,6 +28,12 @@ frappe.views.ListSidebar = Class.extend({
this.setup_views();
this.setup_kanban_boards();
this.setup_email_inbox();
let limits = frappe.boot.limits;
if(limits.upgrade_url && limits.expiry && !frappe.flags.upgrade_dismissed) {
this.setup_upgrade_box();
}
},
setup_views: function() {
var show_list_link = false;
@ -66,7 +72,7 @@ frappe.views.ListSidebar = Class.extend({
//enable link for Kanban view
this.sidebar.find('.list-link[data-view="Kanban"] a, .list-link[data-view="Inbox"] a')
.attr('disabled', null).removeClass('disabled')
.attr('disabled', null).removeClass('disabled');
// show image link if image_view
if(this.list_view.meta.image_field) {
@ -97,7 +103,7 @@ frappe.views.ListSidebar = Class.extend({
added.push(route);
if(!divider) {
$('<li role="separator" class="divider"></li>').appendTo(dropdown);
me.get_divider().appendTo(dropdown);
divider = true;
}
@ -129,7 +135,7 @@ frappe.views.ListSidebar = Class.extend({
boards.forEach(function(board) {
var route = ["List", board.reference_doctype, "Kanban", board.name].join('/');
if(!divider) {
$('<li role="separator" class="divider"></li>').appendTo($dropdown);
me.get_divider().appendTo($dropdown);
divider = true;
}
$(`<li><a href="#${route}">
@ -284,7 +290,7 @@ frappe.views.ListSidebar = Class.extend({
var email_account = (account.email_id == "All Accounts")? "All Accounts": account.email_account;
var route = ["List", "Communication", "Inbox", email_account].join('/');
if(!divider) {
$('<li role="separator" class="divider"></li>').appendTo($dropdown);
this.get_divider().appendTo($dropdown);
divider = true;
}
$('<li><a href="#'+ route + '">'+account.email_id+'</a></li>').appendTo($dropdown);
@ -293,7 +299,7 @@ frappe.views.ListSidebar = Class.extend({
});
$dropdown.find('.new-email-account').click(function() {
frappe.new_doc("Email Account")
frappe.new_doc("Email Account");
});
},
setup_assigned_to_me: function() {
@ -302,11 +308,32 @@ frappe.views.ListSidebar = Class.extend({
me.list_view.assigned_to_me();
});
},
setup_upgrade_box: function() {
let upgrade_list = $(`<ul class="list-unstyled sidebar-menu"></ul>`).appendTo(this.sidebar);
let upgrade_box = $(`<div class="border" style="
padding: 0px 10px;
border-radius: 3px;
">
<a><i class="octicon octicon-x pull-right close" style="margin-top: 10px;"></i></a>
<h5>Go Premium</h5>
<p>Upgrade to a premium plan with more users, storage and priority support.</p>
<button class="btn btn-sm btn-default" style="margin-bottom: 10px;">Upgrade</button>
</div>`).appendTo(upgrade_list);
upgrade_box.find('.btn-primary').on('click', () => {
window.open(frappe.boot.limits.upgrade_url);
});
upgrade_box.find('.close').on('click', () => {
upgrade_list.remove();
frappe.flags.upgrade_dismissed = 1;
});
},
get_cat_tags:function(){
return this.cat_tags;
},
get_stats: function() {
var me = this
var me = this;
frappe.call({
method: 'frappe.desk.reportview.get_sidebar_stats',
args: {
@ -421,4 +448,7 @@ frappe.views.ListSidebar = Class.extend({
this.sidebar.find(".sidebar-stat").remove();
this.get_stats();
},
get_divider: function() {
return $('<li role="separator" class="divider"></li>');
}
});

7
frappe/public/js/frappe/toolbar.js
View file

@ -17,15 +17,10 @@ $(document).on("toolbar_setup", function() {
}
}
if(limits.support_email || limits.support_chat) {
if(limits.support_chat) {
help_links.push('<li class="divider"></li>');
}
if(limits.support_email) {
var support_link = 'mailto:'+frappe.boot.limits.support_email;
help_links.push('<li><a href="'+support_link+'">' + frappe._('Email Support') + '</a></li>');
}
if(limits.support_chat) {
help_links.push('<li><a href="'+limits.support_chat+'" target="_blank">' + frappe._('Chat Support') + '</a></li>');
}