|
|
@ -56,7 +56,6 @@ define([
|
|
|
|
|
|
|
|
|
|
|
|
var styleToolbar = function ($container, href) {
|
|
|
|
var styleToolbar = function ($container, href) {
|
|
|
|
href = href || '/customize/toolbar.css';
|
|
|
|
href = href || '/customize/toolbar.css';
|
|
|
|
|
|
|
|
|
|
|
|
$.ajax({
|
|
|
|
$.ajax({
|
|
|
|
url: href,
|
|
|
|
url: href,
|
|
|
|
dataType: 'text',
|
|
|
|
dataType: 'text',
|
|
|
@ -163,11 +162,10 @@ define([
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
var createUserList = function ($container, readOnly) {
|
|
|
|
var createUserList = function ($container, readOnly) {
|
|
|
|
var $state = $('<span>', {'class': STATE_CLS}).text(Messages.synchronizing);
|
|
|
|
|
|
|
|
var $userlist = $('<div>', {
|
|
|
|
var $userlist = $('<div>', {
|
|
|
|
'class': USER_LIST_CLS,
|
|
|
|
'class': USER_LIST_CLS,
|
|
|
|
id: uid(),
|
|
|
|
id: uid(),
|
|
|
|
}).append($state);
|
|
|
|
});
|
|
|
|
createUserButtons($userlist, readOnly);
|
|
|
|
createUserButtons($userlist, readOnly);
|
|
|
|
$container.append($userlist);
|
|
|
|
$container.append($userlist);
|
|
|
|
return $userlist[0];
|
|
|
|
return $userlist[0];
|
|
|
@ -199,14 +197,17 @@ define([
|
|
|
|
if (n === 1) { return '; + ' + Messages.oneViewer; }
|
|
|
|
if (n === 1) { return '; + ' + Messages.oneViewer; }
|
|
|
|
return '; + ' + Messages._getKey('viewers', [n]);
|
|
|
|
return '; + ' + Messages._getKey('viewers', [n]);
|
|
|
|
};
|
|
|
|
};
|
|
|
|
var updateUserList = function (myUserName, userlistElement, userList, userData, readOnly, $stateElement, $userAdminElement) {
|
|
|
|
|
|
|
|
|
|
|
|
var checkSynchronizing = function (userList, myUserName, $stateElement) {
|
|
|
|
var meIdx = userList.indexOf(myUserName);
|
|
|
|
var meIdx = userList.indexOf(myUserName);
|
|
|
|
if (meIdx === -1) {
|
|
|
|
if (meIdx === -1) {
|
|
|
|
console.log('nok');
|
|
|
|
|
|
|
|
$stateElement.text(Messages.synchronizing);
|
|
|
|
$stateElement.text(Messages.synchronizing);
|
|
|
|
return;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
$stateElement.text('');
|
|
|
|
$stateElement.text('');
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var updateUserList = function (myUserName, userlistElement, userList, userData, readOnly, $userAdminElement) {
|
|
|
|
// Make sure the elements are displayed
|
|
|
|
// Make sure the elements are displayed
|
|
|
|
var $userButtons = $(userlistElement).find("#userButtons");
|
|
|
|
var $userButtons = $(userlistElement).find("#userButtons");
|
|
|
|
$userButtons.attr('display', 'inline');
|
|
|
|
$userButtons.attr('display', 'inline');
|
|
|
@ -283,11 +284,11 @@ define([
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
var createLagElement = function ($container) {
|
|
|
|
var createLagElement = function ($container) {
|
|
|
|
var $lag = $('<div>', {
|
|
|
|
var $lag = $('<span>', {
|
|
|
|
'class': LAG_ELEM_CLS,
|
|
|
|
'class': LAG_ELEM_CLS,
|
|
|
|
id: uid(),
|
|
|
|
id: uid(),
|
|
|
|
});
|
|
|
|
});
|
|
|
|
$container.before($lag);
|
|
|
|
$container.prepend($lag);
|
|
|
|
return $lag[0];
|
|
|
|
return $lag[0];
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
@ -332,8 +333,7 @@ define([
|
|
|
|
}).appendTo($topContainer);
|
|
|
|
}).appendTo($topContainer);
|
|
|
|
var $imgTag = $('<img>', {
|
|
|
|
var $imgTag = $('<img>', {
|
|
|
|
src: "/customize/cryptofist_mini.png",
|
|
|
|
src: "/customize/cryptofist_mini.png",
|
|
|
|
alt: "Cryptpad",
|
|
|
|
alt: "Cryptpad"
|
|
|
|
'class': "cryptofist"
|
|
|
|
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// We need to override the "a" tag action here because it is inside the iframe!
|
|
|
|
// We need to override the "a" tag action here because it is inside the iframe!
|
|
|
@ -361,6 +361,10 @@ define([
|
|
|
|
'class': USER_CLS
|
|
|
|
'class': USER_CLS
|
|
|
|
}).appendTo($topContainer);
|
|
|
|
}).appendTo($topContainer);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var $state = $('<span>', {
|
|
|
|
|
|
|
|
'class': STATE_CLS
|
|
|
|
|
|
|
|
}).text(Messages.synchronizing).appendTo($userContainer);
|
|
|
|
|
|
|
|
|
|
|
|
var $span = $('<span>' , {
|
|
|
|
var $span = $('<span>' , {
|
|
|
|
'class': 'cryptpad-language'
|
|
|
|
'class': 'cryptpad-language'
|
|
|
|
});
|
|
|
|
});
|
|
|
@ -388,21 +392,24 @@ define([
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
var createTitle = function ($container, readOnly, config, Cryptpad) {
|
|
|
|
var createTitle = function ($container, readOnly, config, Cryptpad) {
|
|
|
|
config = config || {};
|
|
|
|
var $titleContainer = $('<span>', {
|
|
|
|
|
|
|
|
id: 'toolbarTitle',
|
|
|
|
|
|
|
|
'class': TITLE_CLS
|
|
|
|
|
|
|
|
}).appendTo($container);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!config || typeof config !== "object") { return; }
|
|
|
|
|
|
|
|
|
|
|
|
var callback = config.onRename;
|
|
|
|
var callback = config.onRename;
|
|
|
|
var placeholder = config.defaultName;
|
|
|
|
var placeholder = config.defaultName;
|
|
|
|
var suggestName = config.suggestName;
|
|
|
|
var suggestName = config.suggestName;
|
|
|
|
|
|
|
|
|
|
|
|
// Buttons
|
|
|
|
// Buttons
|
|
|
|
var $titleContainer = $('<span>', {
|
|
|
|
|
|
|
|
id: 'toolbarTitle',
|
|
|
|
|
|
|
|
'class': TITLE_CLS
|
|
|
|
|
|
|
|
}).appendTo($container);
|
|
|
|
|
|
|
|
var $text = $('<span>', {
|
|
|
|
var $text = $('<span>', {
|
|
|
|
'class': 'title'
|
|
|
|
'class': 'title'
|
|
|
|
}).appendTo($titleContainer);
|
|
|
|
}).appendTo($titleContainer);
|
|
|
|
var $pencilIcon = $('<span>', {
|
|
|
|
var $pencilIcon = $('<span>', {
|
|
|
|
'class': 'pencilIcon'
|
|
|
|
'class': 'pencilIcon',
|
|
|
|
|
|
|
|
'title': Messages.clickToEdit
|
|
|
|
});
|
|
|
|
});
|
|
|
|
if (readOnly === 1 || typeof(Cryptpad) === "undefined") { return $titleContainer; }
|
|
|
|
if (readOnly === 1 || typeof(Cryptpad) === "undefined") { return $titleContainer; }
|
|
|
|
var $input = $('<input>', {
|
|
|
|
var $input = $('<input>', {
|
|
|
@ -439,19 +446,19 @@ define([
|
|
|
|
callback(null, newtitle);
|
|
|
|
callback(null, newtitle);
|
|
|
|
$input.hide();
|
|
|
|
$input.hide();
|
|
|
|
$text.show();
|
|
|
|
$text.show();
|
|
|
|
$pencilIcon.css('display', '');
|
|
|
|
//$pencilIcon.css('display', '');
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
else if (e.which === 27) {
|
|
|
|
else if (e.which === 27) {
|
|
|
|
$input.hide();
|
|
|
|
$input.hide();
|
|
|
|
$text.show();
|
|
|
|
$text.show();
|
|
|
|
$pencilIcon.css('display', '');
|
|
|
|
//$pencilIcon.css('display', '');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
var displayInput = function () {
|
|
|
|
var displayInput = function () {
|
|
|
|
$text.hide();
|
|
|
|
$text.hide();
|
|
|
|
$pencilIcon.css('display', 'none');
|
|
|
|
//$pencilIcon.css('display', 'none');
|
|
|
|
var inputVal = suggestName() || "";
|
|
|
|
var inputVal = suggestName() || "";
|
|
|
|
$input.val(inputVal);
|
|
|
|
$input.val(inputVal);
|
|
|
|
$input.show();
|
|
|
|
$input.show();
|
|
|
@ -468,17 +475,17 @@ define([
|
|
|
|
var Cryptpad = config.common;
|
|
|
|
var Cryptpad = config.common;
|
|
|
|
|
|
|
|
|
|
|
|
var toolbar = createRealtimeToolbar($container);
|
|
|
|
var toolbar = createRealtimeToolbar($container);
|
|
|
|
var userListElement = createUserList(toolbar.find('.' + LEFTSIDE_CLS), readOnly);
|
|
|
|
var userListElement = config.userData ? createUserList(toolbar.find('.' + LEFTSIDE_CLS), readOnly) : undefined;
|
|
|
|
var spinner = createSpinner(toolbar.find('.' + RIGHTSIDE_CLS));
|
|
|
|
|
|
|
|
var lagElement = createLagElement($(userListElement));
|
|
|
|
|
|
|
|
var $titleElement = createTitle(toolbar.find('.' + TOP_CLS), readOnly, config.title, Cryptpad);
|
|
|
|
var $titleElement = createTitle(toolbar.find('.' + TOP_CLS), readOnly, config.title, Cryptpad);
|
|
|
|
var $linkElement = createLinkToMain(toolbar.find('.' + TOP_CLS));
|
|
|
|
var $linkElement = createLinkToMain(toolbar.find('.' + TOP_CLS));
|
|
|
|
var $userAdminElement = createUserAdmin(toolbar.find('.' + TOP_CLS));
|
|
|
|
var $userAdminElement = createUserAdmin(toolbar.find('.' + TOP_CLS));
|
|
|
|
|
|
|
|
var lagElement = createLagElement($userAdminElement);
|
|
|
|
|
|
|
|
var spinner = createSpinner($userAdminElement);
|
|
|
|
var userData = config.userData;
|
|
|
|
var userData = config.userData;
|
|
|
|
// readOnly = 1 (readOnly enabled), 0 (disabled), -1 (old pad without readOnly mode)
|
|
|
|
// readOnly = 1 (readOnly enabled), 0 (disabled), -1 (old pad without readOnly mode)
|
|
|
|
var saveElement;
|
|
|
|
var saveElement;
|
|
|
|
var loadElement;
|
|
|
|
var loadElement;
|
|
|
|
var $stateElement = $(userListElement).find('.' + STATE_CLS);
|
|
|
|
var $stateElement = $userAdminElement.find('.' + STATE_CLS);
|
|
|
|
|
|
|
|
|
|
|
|
var connected = false;
|
|
|
|
var connected = false;
|
|
|
|
|
|
|
|
|
|
|
@ -490,7 +497,7 @@ define([
|
|
|
|
$container.find('.cryptpad-dropdown').hide();
|
|
|
|
$container.find('.cryptpad-dropdown').hide();
|
|
|
|
};
|
|
|
|
};
|
|
|
|
var cancelEditTitle = function (e) {
|
|
|
|
var cancelEditTitle = function (e) {
|
|
|
|
if ($(e.target).parents('.' + TITLE_CLS).length) {
|
|
|
|
if ($(e.target).parents('.' + TITLE_CLS).length || !$titleElement) {
|
|
|
|
return;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
$titleElement.find('input').hide();
|
|
|
|
$titleElement.find('input').hide();
|
|
|
@ -508,6 +515,7 @@ define([
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// Update user list
|
|
|
|
// Update user list
|
|
|
|
|
|
|
|
if (config.userData) {
|
|
|
|
userList.change.push(function (newUserData) {
|
|
|
|
userList.change.push(function (newUserData) {
|
|
|
|
var users = userList.users;
|
|
|
|
var users = userList.users;
|
|
|
|
if (users.indexOf(myUserName) !== -1) { connected = true; }
|
|
|
|
if (users.indexOf(myUserName) !== -1) { connected = true; }
|
|
|
@ -515,8 +523,17 @@ define([
|
|
|
|
/*if (newUserData) { // Someone has changed his name/color
|
|
|
|
/*if (newUserData) { // Someone has changed his name/color
|
|
|
|
userData = newUserData;
|
|
|
|
userData = newUserData;
|
|
|
|
}*/
|
|
|
|
}*/
|
|
|
|
updateUserList(myUserName, userListElement, users, userData, readOnly, $stateElement, $userAdminElement);
|
|
|
|
checkSynchronizing(users, myUserName, $stateElement);
|
|
|
|
|
|
|
|
updateUserList(myUserName, userListElement, users, userData, readOnly, $userAdminElement);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
userList.change.push(function () {
|
|
|
|
|
|
|
|
var users = userList.users;
|
|
|
|
|
|
|
|
if (users.indexOf(myUserName) !== -1) { connected = true; }
|
|
|
|
|
|
|
|
if (!connected) { return; }
|
|
|
|
|
|
|
|
checkSynchronizing(users, myUserName, $stateElement);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
// Display notifications when users are joining/leaving the session
|
|
|
|
// Display notifications when users are joining/leaving the session
|
|
|
|
var oldUserData;
|
|
|
|
var oldUserData;
|
|
|
|
if (typeof Cryptpad !== "undefined") {
|
|
|
|
if (typeof Cryptpad !== "undefined") {
|
|
|
|