mirror of https://github.com/xwiki-labs/cryptpad
Switched cryptpad to use common/toolbar.js which is shared with cryptsheet
This commit is contained in:
Caleb James DeLisle
parent
50c10f818e
commit
c13bfe978a
|
|
@ -22,6 +22,7 @@ define([
|
|||
'/pad/rangy.js',
|
||||
'/common/chainpad.js',
|
||||
'/common/otaml.js',
|
||||
'/common/toolbar.js',
|
||||
'/bower_components/jquery/dist/jquery.min.js',
|
||||
'/bower_components/tweetnacl/nacl-fast.min.js'
|
||||
], function (HTMLPatcher, ErrorBox, Messages, ReconnectingWebSocket) {
|
||||
|
|
@ -98,28 +99,6 @@ window.ErrorBox = ErrorBox;
|
|||
unbind);
|
||||
};
|
||||
|
||||
var SPINNER = [ '-', '\\', '|', '/' ];
|
||||
var kickSpinner = function (spinnerElement, reversed) {
|
||||
var txt = spinnerElement.textContent || '-';
|
||||
var inc = (reversed) ? -1 : 1;
|
||||
spinnerElement.textContent = SPINNER[(SPINNER.indexOf(txt) + inc) % SPINNER.length];
|
||||
spinnerElement.timeout && clearTimeout(spinnerElement.timeout);
|
||||
spinnerElement.timeout = setTimeout(function () {
|
||||
spinnerElement.textContent = '';
|
||||
}, SPINNER_DISAPPEAR_TIME);
|
||||
};
|
||||
|
||||
var checkLag = function (realtime, lagElement) {
|
||||
var lag = realtime.getLag();
|
||||
var lagSec = lag.lag/1000;
|
||||
lagElement.textContent = "Lag: ";
|
||||
if (lag.waiting && lagSec > 1) {
|
||||
lagElement.textContent += "?? " + Math.floor(lagSec);
|
||||
} else {
|
||||
lagElement.textContent += lagSec;
|
||||
}
|
||||
};
|
||||
|
||||
var isSocketDisconnected = function (socket, realtime) {
|
||||
var sock = socket._socket;
|
||||
return sock.readyState === sock.CLOSING
|
||||
|
|
@ -127,28 +106,6 @@ window.ErrorBox = ErrorBox;
|
|||
|| (realtime.getLag().waiting && realtime.getLag().lag > MAX_LAG_BEFORE_DISCONNECT);
|
||||
};
|
||||
|
||||
var updateUserList = function (myUserName, listElement, userList) {
|
||||
var meIdx = userList.indexOf(myUserName);
|
||||
if (meIdx === -1) {
|
||||
listElement.textContent = Messages.synchronizing;
|
||||
return;
|
||||
}
|
||||
if (userList.length === 1) {
|
||||
listElement.textContent = Messages.editingAlone;
|
||||
} else if (userList.length === 2) {
|
||||
listElement.textContent = Messages.editingWithOneOtherPerson;
|
||||
} else {
|
||||
listElement.textContent = Messages.editingWith + ' ' + (userList.length - 1) +
|
||||
Messages.otherPeople;
|
||||
}
|
||||
};
|
||||
|
||||
var createUserList = function (container) {
|
||||
var id = uid();
|
||||
$(container).prepend('<div class="' + USER_LIST_CLS + '" id="'+id+'"></div>');
|
||||
return $('#'+id)[0];
|
||||
};
|
||||
|
||||
var abort = function (socket, realtime) {
|
||||
realtime.abort();
|
||||
try { socket._socket.close(); } catch (e) { }
|
||||
|
|
@ -284,89 +241,6 @@ window.ErrorBox = ErrorBox;
|
|||
return docText;
|
||||
};
|
||||
|
||||
var uid = function () {
|
||||
return 'rtwysiwyg-uid-' + String(Math.random()).substring(2);
|
||||
};
|
||||
|
||||
var checkLag = function (realtime, lagElement) {
|
||||
var lag = realtime.getLag();
|
||||
var lagSec = lag.lag/1000;
|
||||
var lagMsg = Messages.lag + ' ';
|
||||
if (lag.waiting && lagSec > 1) {
|
||||
lagMsg += "?? " + Math.floor(lagSec);
|
||||
} else {
|
||||
lagMsg += lagSec;
|
||||
}
|
||||
lagElement.textContent = lagMsg;
|
||||
};
|
||||
|
||||
var createLagElement = function (container) {
|
||||
var id = uid();
|
||||
$(container).append('<div class="' + LAG_ELEM_CLS + '" id="'+id+'"></div>');
|
||||
return $('#'+id)[0];
|
||||
};
|
||||
|
||||
var createSpinner = function (container) {
|
||||
var id = uid();
|
||||
$(container).append('<div class="rtwysiwyg-spinner" id="'+id+'"></div>');
|
||||
return $('#'+id)[0];
|
||||
};
|
||||
|
||||
var createRealtimeToolbar = function (container) {
|
||||
var id = uid();
|
||||
$(container).prepend(
|
||||
'<div class="' + TOOLBAR_CLS + '" id="' + id + '">' +
|
||||
'<div class="rtwysiwyg-toolbar-leftside"></div>' +
|
||||
'<div class="rtwysiwyg-toolbar-rightside"></div>' +
|
||||
'</div>'
|
||||
);
|
||||
var toolbar = $('#'+id);
|
||||
toolbar.append([
|
||||
'<style>',
|
||||
'.' + TOOLBAR_CLS + ' {',
|
||||
' color: #666;',
|
||||
' font-weight: bold;',
|
||||
// ' background-color: #f0f0ee;',
|
||||
// ' border-bottom: 1px solid #DDD;',
|
||||
// ' border-top: 3px solid #CCC;',
|
||||
// ' border-right: 2px solid #CCC;',
|
||||
// ' border-left: 2px solid #CCC;',
|
||||
' height: 26px;',
|
||||
' margin-bottom: -3px;',
|
||||
' display: inline-block;',
|
||||
' width: 100%;',
|
||||
'}',
|
||||
'.' + TOOLBAR_CLS + ' div {',
|
||||
' padding: 0 10px;',
|
||||
' height: 1.5em;',
|
||||
// ' background: #f0f0ee;',
|
||||
' line-height: 25px;',
|
||||
' height: 22px;',
|
||||
'}',
|
||||
'.rtwysiwyg-toolbar-leftside {',
|
||||
' float: left;',
|
||||
'}',
|
||||
'.rtwysiwyg-toolbar-rightside {',
|
||||
' float: right;',
|
||||
'}',
|
||||
'.rtwysiwyg-lag {',
|
||||
' float: right;',
|
||||
'}',
|
||||
'.rtwysiwyg-spinner {',
|
||||
' float: left;',
|
||||
'}',
|
||||
'.gwt-TabBar {',
|
||||
' display:none;',
|
||||
'}',
|
||||
'.' + DEBUG_LINK_CLS + ':link { color:transparent; }',
|
||||
'.' + DEBUG_LINK_CLS + ':link:hover { color:blue; }',
|
||||
'.gwt-TabPanelBottom { border-top: 0 none; }',
|
||||
|
||||
'</style>'
|
||||
].join('\n'));
|
||||
return toolbar;
|
||||
};
|
||||
|
||||
var makeWebsocket = function (url) {
|
||||
var socket = new ReconnectingWebSocket(url);
|
||||
var out = {
|
||||
|
|
@ -450,8 +324,6 @@ window.ErrorBox = ErrorBox;
|
|||
var socket = makeWebsocket(websocketUrl);
|
||||
var onEvent = function () { };
|
||||
|
||||
var toolbar = createRealtimeToolbar('#cke_1_toolbox');
|
||||
|
||||
var allMessages = [];
|
||||
var isErrorState = false;
|
||||
var initializing = true;
|
||||
|
|
@ -498,16 +370,7 @@ console.log(new Error().stack);
|
|||
getDocHTML(doc),
|
||||
{ transformFunction: Otaml.transform });
|
||||
|
||||
//createDebugLink(realtime, doc, allMessages, toolbar);
|
||||
|
||||
var userListElement = createUserList(toolbar.find('.rtwysiwyg-toolbar-leftside'));
|
||||
var spinner = createSpinner(toolbar.find('.rtwysiwyg-toolbar-rightside'));
|
||||
var lagElement = createLagElement(toolbar.find('.rtwysiwyg-toolbar-rightside'));
|
||||
|
||||
setInterval(function () {
|
||||
if (initializing || isSocketDisconnected(socket, realtime)) { return; }
|
||||
checkLag(realtime, lagElement);
|
||||
}, 3000);
|
||||
var toolbar = Toolbar($, $('#cke_1_toolbox'), Messages, userName, realtime);
|
||||
|
||||
onEvent = function () {
|
||||
if (isErrorState) { return; }
|
||||
|
|
@ -533,9 +396,7 @@ console.log(new Error().stack);
|
|||
|
||||
var userDocBeforePatch;
|
||||
var incomingPatch = function () {
|
||||
if (isErrorState) { return; }
|
||||
kickSpinner(spinner);
|
||||
if (initializing) { return; }
|
||||
if (isErrorState || initializing) { return; }
|
||||
userDocBeforePatch = userDocBeforePatch || getFixedDocText(doc, ifr.contentWindow);
|
||||
if (PARANOIA && userDocBeforePatch != getFixedDocText(doc, ifr.contentWindow)) {
|
||||
error(false, "userDocBeforePatch != getFixedDocText(doc, ifr.contentWindow)");
|
||||
|
|
@ -547,7 +408,6 @@ console.log(new Error().stack);
|
|||
};
|
||||
|
||||
realtime.onUserListChange(function (userList) {
|
||||
updateUserList(userName, userListElement, userList);
|
||||
if (!initializing || userList.indexOf(userName) === -1) { return; }
|
||||
// if we spot ourselves being added to the document, we'll switch
|
||||
// 'initializing' off because it means we're fully synced.
|
||||
|
|
@ -581,12 +441,12 @@ console.log(new Error().stack);
|
|||
|
||||
setInterval(function () {
|
||||
if (isErrorState || checkSocket()) {
|
||||
userListElement.textContent = Messages.reconnecting;
|
||||
lagElement.textContent = '';
|
||||
toolbar.reconnecting();
|
||||
}
|
||||
}, 200);
|
||||
|
||||
realtime.start();
|
||||
toolbar.connected();
|
||||
|
||||
//console.log('started');
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue