110 lines
3.8 KiB
JavaScript
110 lines
3.8 KiB
JavaScript
|
const _ = require('underscore');
|
||
|
const $ = require('jquery');
|
||
|
const checkAndBuildOpts = require('builder/helpers/required-opts');
|
||
|
const DropdownAdminView = require('dashboard/components/dropdown/dropdown-admin-view');
|
||
|
const Utils = require('builder/helpers/utils');
|
||
|
const template = require('./settings-dropdown.tpl');
|
||
|
|
||
|
const REQUIRED_OPTS = [
|
||
|
'model',
|
||
|
'configModel'
|
||
|
];
|
||
|
|
||
|
/**
|
||
|
* The content of the dropdown menu opened by the user avatar in the top-right of the header, e.g.:
|
||
|
* Explore, Learn, ♞
|
||
|
* ______/\____
|
||
|
* | |
|
||
|
* | this |
|
||
|
* |____________|
|
||
|
*/
|
||
|
|
||
|
module.exports = DropdownAdminView.extend({
|
||
|
className: 'Dropdown',
|
||
|
|
||
|
initialize: function (options) {
|
||
|
checkAndBuildOpts(options, REQUIRED_OPTS, this);
|
||
|
DropdownAdminView.prototype.initialize.apply(this, arguments);
|
||
|
},
|
||
|
|
||
|
shortDisplayName: function (user) {
|
||
|
// This changes should also be done in Central, ./app/assets/javascripts/dashboard/users/views/user_avatar.js
|
||
|
var accountTypeDisplayName = user.get('account_type_display_name');
|
||
|
var displayName = _.isUndefined(accountTypeDisplayName) ? user.get('account_type') : accountTypeDisplayName;
|
||
|
|
||
|
if (_.isUndefined(displayName)) {
|
||
|
return displayName;
|
||
|
}
|
||
|
|
||
|
displayName = displayName.toLowerCase();
|
||
|
|
||
|
if (displayName === 'organization user') {
|
||
|
return 'org. user';
|
||
|
} else {
|
||
|
return displayName.replace(/lump-sum/gi, '- A')
|
||
|
.replace(/academic/gi, 'aca.')
|
||
|
.replace(/ - Monthly/i, ' - M')
|
||
|
.replace(/ - Annual/i, ' - A')
|
||
|
.replace(/Non-Profit/i, 'NP')
|
||
|
.replace(/On-premises/i, 'OP')
|
||
|
.replace(/Internal use engine/i, 'engine')
|
||
|
.replace(/Lite/i, 'L')
|
||
|
.replace(/Cloud Engine &/i, 'C. Engine &')
|
||
|
.replace(/& Enterprise Builder/i, '& E. Builder')
|
||
|
.replace(/CARTO for /i, '')
|
||
|
.replace(/CARTO /i, '');
|
||
|
}
|
||
|
},
|
||
|
|
||
|
render: function () {
|
||
|
var user = this.model;
|
||
|
var usedDataBytes = user.get('db_size_in_bytes');
|
||
|
var quotaInBytes = user.get('quota_in_bytes');
|
||
|
var usedDataPct = Math.round(usedDataBytes / quotaInBytes * 100);
|
||
|
var progressBarClass = '';
|
||
|
|
||
|
if (usedDataPct > 80 && usedDataPct < 90) {
|
||
|
progressBarClass = 'is--inAlert';
|
||
|
} else if (usedDataPct > 89) {
|
||
|
progressBarClass = 'is--inDanger';
|
||
|
}
|
||
|
|
||
|
var accountType = this.shortDisplayName(user);
|
||
|
|
||
|
var userUrl = this.model.viewUrl();
|
||
|
var upgradeUrl = window.upgrade_url || this._configModel.get('upgrade_url') || '';
|
||
|
|
||
|
this.$el.html(template({
|
||
|
name: user.fullName() || user.get('username'),
|
||
|
email: user.get('email'),
|
||
|
accountType: accountType,
|
||
|
isOrgAdmin: user.isOrgAdmin(),
|
||
|
usedDataStr: Utils.readablizeBytes(usedDataBytes),
|
||
|
usedDataPct: usedDataPct,
|
||
|
progressBarClass: progressBarClass,
|
||
|
availableDataStr: Utils.readablizeBytes(quotaInBytes),
|
||
|
showUpgradeLink: upgradeUrl && (user.isOrgOwner() || !user.isInsideOrg()) && !this._configModel.get('cartodb_com_hosted'),
|
||
|
upgradeUrl: upgradeUrl,
|
||
|
publicProfileUrl: userUrl.publicProfile(),
|
||
|
apiKeysUrl: userUrl.apiKeys(),
|
||
|
organizationUrl: userUrl.organization(),
|
||
|
accountProfileUrl: userUrl.accountProfile(),
|
||
|
logoutUrl: userUrl.logout(),
|
||
|
isViewer: user.isViewer(),
|
||
|
isBuilder: user.isBuilder(),
|
||
|
orgDisplayEmail: user.isInsideOrg() ? user.organization.display_email : null,
|
||
|
engineEnabled: user.get('actions').engine_enabled,
|
||
|
mobileAppsEnabled: user.get('actions').mobile_sdk_enabled
|
||
|
}));
|
||
|
|
||
|
// Necessary to hide dialog on click outside popup, for example.
|
||
|
// TODO: Handle closeDialogs
|
||
|
// cdb.god.bind('closeDialogs', this.hide, this);
|
||
|
|
||
|
// TODO: taken from existing code, how should dropdowns really be added to the DOM?
|
||
|
$('body').append(this.el);
|
||
|
|
||
|
return this;
|
||
|
}
|
||
|
});
|