Select what we want to display in the toolbar

pull/1/head
yflory 8 years ago
parent 2afdc11327
commit 767ba8b549

@ -380,6 +380,7 @@
padding: 5px;
margin: 0;
white-space: normal;
text-align: left;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;

@ -67,6 +67,7 @@
padding: 5px;
margin: 0;
white-space: normal;
text-align: left;
&.cryptpad-dropdown-users {
text-align:baseline;
.yourself, .anonymous, .viewer {

@ -49,6 +49,7 @@
padding: 5px;
margin: 0;
white-space: normal;
text-align: left;
}
.dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users {
text-align: baseline;

@ -375,6 +375,7 @@ define([
});
var config = {
displayed: ['useradmin', 'language', 'spinner', 'lag', 'state', 'share', 'userlist'],
userData: userData,
readOnly: readOnly,
ifrw: ifrw,

@ -39,10 +39,6 @@ define([
var TITLE_CLS = Bar.constants.title = "cryptpad-title";
var USER_CLS = Bar.constants.userAdmin = "cryptpad-user";
/** Key in the localStore which indicates realtime activity should be disallowed. */
// TODO remove? will never be used in cryptpad
var LOCALSTORAGE_DISALLOW = Bar.constants.localstorageDisallow = 'cryptpad-disallow';
var SPINNER_DISAPPEAR_TIME = 3000;
var uid = function () {
@ -79,16 +75,19 @@ define([
return $toolbar;
};
var createSpinner = function ($container) {
var createSpinner = function ($container, config) {
if (config.displayed.indexOf('spinner') !== -1) {
var $spinner = $('<span>', {
id: uid(),
'class': SPINNER_CLS + ' fa fa fa-spinner fa-pulse',
}).hide();
$container.prepend($spinner);
return $spinner[0];
}
};
var kickSpinner = function (spinnerElement) {
if (!spinnerElement) { return; }
$(spinnerElement).show();
if (spinnerElement.timeout) { clearTimeout(spinnerElement.timeout); }
spinnerElement.timeout = setTimeout(function () {
@ -96,8 +95,12 @@ define([
}, SPINNER_DISAPPEAR_TIME);
};
var createUserButtons = function ($userlistElement, readOnly, Cryptpad) {
var createUserButtons = function ($userlistElement, config, readOnly, Cryptpad) {
// User list button
if (config.displayed.indexOf('userlist') !== -1) {
if (!config.userData) {
throw new Error("You must provide a `userData` object to display the userlist");
}
var dropdownConfig = {
options: [{
tag: 'p',
@ -107,8 +110,10 @@ define([
var $block = Cryptpad.createDropdown(dropdownConfig);
$block.attr('id', 'userButtons');
$userlistElement.append($block);
}
// Share button
if (config.displayed.indexOf('share') !== -1) {
var $shareIcon = $('<span>', {'class': 'fa fa-share-alt'});
var $span = $('<span>', {'class': 'large'}).append($shareIcon.clone()).append(' ' +Messages.shareButton);
var $spanSmall = $('<span>', {'class': 'small'}).append($shareIcon.clone());
@ -119,14 +124,16 @@ define([
var $shareBlock = Cryptpad.createDropdown(dropdownConfigShare);
$shareBlock.find('.dropdown-bar-content').addClass(SHARE_CLS).addClass(EDITSHARE_CLS).addClass(VIEWSHARE_CLS);
$userlistElement.append($shareBlock);
}
};
var createUserList = function ($container, readOnly, Cryptpad) {
var createUserList = function ($container, config, readOnly, Cryptpad) {
if (config.displayed.indexOf('userlist') === -1 && config.displayed.indexOf('share') === -1) { return; }
var $userlist = $('<div>', {
'class': USER_LIST_CLS,
id: uid(),
});
createUserButtons($userlist, readOnly, Cryptpad);
createUserButtons($userlist, config, readOnly, Cryptpad);
$container.append($userlist);
return $userlist[0];
};
@ -167,11 +174,12 @@ define([
$stateElement.text('');
};
var updateUserList = function (myUserName, userlistElement, userList, userData, readOnly, $userAdminElement) {
var updateUserList = function (config, myUserName, userlistElement, userList, userData, readOnly, $userAdminElement) {
// Make sure the elements are displayed
var $userButtons = $(userlistElement).find("#userButtons");
$userButtons.attr('display', 'inline');
if (config.displayed.indexOf('userlist') !== -1) {
var numberOfUsers = userList.length;
// If we are using old pads (readonly unavailable), only editing users are in userList.
@ -223,28 +231,25 @@ define([
var fa_viewusers = '<span class="fa fa-eye" style="font-family:FontAwesome;"></span>';
var viewersText = numberOfViewUsers > 1 ? Messages.viewers : Messages.viewer;
var editorsText = numberOfEditUsers > 1 ? Messages.editors : Messages.editor;
// $userButtons.find('.userlist.edit').html(fa_editusers + ' ' + numberOfEditUsers + ' ' + editorsText + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + viewersText + ' ' + fa_caretdown);
var $span = $('<span>', {'class': 'large'}).html(fa_editusers + ' ' + numberOfEditUsers + ' ' + editorsText + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + viewersText);
// $userButtons.find('.userlist.edit.small').html(fa_editusers + ' ' + numberOfEditUsers + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + fa_caretdown);
var $spansmall = $('<span>', {'class': 'small'}).html(fa_editusers + ' ' + numberOfEditUsers + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers);
$userButtons.find('.buttonTitle').html('').append($span).append($spansmall);
}
// Change username button
if (config.displayed.indexOf('useradmin') !== -1) {
// Change username in useradmin dropdown
var $userElement = $userAdminElement.find('.' + USERNAME_CLS);
$userElement.show();
if (readOnly === 1) {
//$userElement.html('<span class="' + READONLY_CLS + '">' + Messages.readonly + '</span>');
$userElement.addClass('ro').text(Messages.readonly);
$userElement.addClass(READONLY_CLS).text(Messages.readonly);
}
else {
var name = userData[myUserName] && userData[myUserName].name;
//var icon = '<span class="fa fa-user" style="font-family:FontAwesome;"></span>';
if (!name) {
name = Messages.anonymous;
}
// $userElement.find("button").show();
// $userElement.find("button").html(icon + ' ' + name);
$userElement.removeClass('ro').text(name);
$userElement.removeClass(READONLY_CLS).text(name);
}
}
};
@ -321,6 +326,7 @@ define([
};
var createUserAdmin = function ($topContainer, config, lagElement, Cryptpad) {
if (config.displayed.indexOf('useradmin') === -1 && config.displayed.indexOf('share') === -1) { return; }
var $lag = $(lagElement);
//TODO check if we should displayed that button and if we can (userName.setName, userName.lastName and userdata required)
@ -328,16 +334,27 @@ define([
'class': USER_CLS
}).appendTo($topContainer);
if (config.displayed.indexOf('state') !== -1) {
var $state = $('<span>', {
'class': STATE_CLS
}).text(Messages.synchronizing).appendTo($userContainer);
}
if (config.displayed.indexOf('lag') !== -1) {
$userContainer.append($lag);
}
if (config.displayed.indexOf('language') !== -1) {
// Dropdown language selector
Cryptpad.createLanguageSelector($userContainer);
}
// User dropdown
if (config.displayed.indexOf('useradmin') !== -1) {
if (!config.userName || !config.userName.setName || !config.userName.lastName) {
throw new Error("You must provide a `userName` object containing `setName` (function) " +
"and `lastName` (object) if you want to display the user admin menu.")
}
var $displayedName = $('<span>', {'class': USERNAME_CLS});
var accountName = null; //TODO Cryptpad.getStore().getAccountName()
var account = typeof accountName === "string";
@ -388,6 +405,7 @@ define([
});
});
}
}
return $userContainer;
};
@ -474,19 +492,20 @@ define([
config = config || {};
var readOnly = (typeof config.readOnly !== "undefined") ? (config.readOnly ? 1 : 0) : -1;
var Cryptpad = config.common;
config.displayed = config.displayed || [];
var toolbar = createRealtimeToolbar($container);
var userListElement = config.userData ? createUserList(toolbar.find('.' + LEFTSIDE_CLS), readOnly, Cryptpad) : undefined;
var userListElement = createUserList(toolbar.find('.' + LEFTSIDE_CLS), config, readOnly, Cryptpad);
var $titleElement = createTitle(toolbar.find('.' + TOP_CLS), readOnly, config.title, Cryptpad);
var $linkElement = createLinkToMain(toolbar.find('.' + TOP_CLS));
var lagElement = createLagElement();
var $userAdminElement = createUserAdmin(toolbar.find('.' + TOP_CLS), config, lagElement, Cryptpad);
var spinner = createSpinner($userAdminElement);
var spinner = createSpinner($userAdminElement, config);
var userData = config.userData;
// readOnly = 1 (readOnly enabled), 0 (disabled), -1 (old pad without readOnly mode)
var saveElement;
var loadElement;
var $stateElement = $userAdminElement.find('.' + STATE_CLS);
var $stateElement = toolbar.find('.' + STATE_CLS);
var connected = false;
@ -524,7 +543,7 @@ define([
if (users.indexOf(myUserName) !== -1) { connected = true; }
if (!connected) { return; }
checkSynchronizing(users, myUserName, $stateElement);
updateUserList(myUserName, userListElement, users, userData, readOnly, $userAdminElement);
updateUserList(config, myUserName, userListElement, users, userData, readOnly, $userAdminElement);
});
} else {
userList.change.push(function () {

@ -1747,6 +1747,7 @@ define([
var userList = APP.userList = info.userList;
APP.userName = {};
var config = {
displayed: ['useradmin', 'language', 'spinner', 'lag', 'state'],
readOnly: readOnly,
ifrw: window,
common: Cryptpad,

@ -568,6 +568,7 @@ define([
});
var config = {
displayed: ['useradmin', 'language', 'spinner', 'lag', 'state', 'share', 'userlist'],
userData: userData,
readOnly: readOnly,
ifrw: ifrw,

@ -652,6 +652,7 @@ define([
});
var config = {
displayed: ['useradmin', 'language', 'spinner', 'lag', 'state', 'share', 'userlist'],
userData: userData,
readOnly: readOnly,
title: {

@ -418,6 +418,7 @@ define([
});
var config = {
displayed: ['useradmin', 'language', 'spinner', 'lag', 'state', 'share', 'userlist'],
userData: userData,
readOnly: readOnly,
ifrw: ifrw,

Loading…
Cancel
Save