web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Make loading screen come much earlier on pad2

Browse Source
This commit is contained in:
Caleb James DeLisle 2017-08-23 12:14:51 +02:00
parent ec64ac485d
commit cbac5e417c
5 changed files with 207 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
www/common/loading.js
View File

@ -1,5 +1,5 @@
define([ define([
'less!/customize/src/less/cryptpad.less' 'less!/customize/src/less/loading.less'
], function () { ], function () {
var urlArgs = window.location.href.replace(/^.*\?([^\?]*)$/, function (all, x) { return x; }); var urlArgs = window.location.href.replace(/^.*\?([^\?]*)$/, function (all, x) { return x; });
var elem = document.createElement('div'); var elem = document.createElement('div');

21
www/common/sframe-boot.js
View File

@ -9,11 +9,22 @@ if (req.pfx) {
}; };
} }
require.config(req.cfg); require.config(req.cfg);
if (req.req) { require(req.req, function () { }); } var txid = Math.random().toString(16).replace('0.', '');
window.addEventListener('message', function (msg) { var intr;
var ready = function () {
intr = setInterval(function () {
if (typeof(txid) !== 'string') { return; }
window.parent.postMessage(JSON.stringify({ q: 'READY', txid: txid }), '*');
}, 1);
};
if (req.req) { require(req.req, ready); } else { ready(); }
var onReply = function (msg) {
var data = JSON.parse(msg.data); var data = JSON.parse(msg.data);
if (data.q !== 'INIT') { return; } if (data.txid !== txid) { return; }
msg.source.postMessage(JSON.stringify({ txid: data.txid, content: 'OK' }), '*'); clearInterval(intr);
txid = {};
window.removeEventListener('message', onReply);
require(['/common/sframe-boot2.js'], function () { }); require(['/common/sframe-boot2.js'], function () { });
}); };
window.addEventListener('message', onReply);
}()); }());

18
www/common/sframe-channel.js
View File

@ -105,7 +105,6 @@ define([
insideHandlers.push(content); insideHandlers.push(content);
}, true); }, true);
var intr;
var txid; var txid;
window.addEventListener('message', function (msg) { window.addEventListener('message', function (msg) {
var data = JSON.parse(msg.data); var data = JSON.parse(msg.data);
@ -113,12 +112,8 @@ define([
console.log("DROP Message from unexpected source"); console.log("DROP Message from unexpected source");
console.log(msg); console.log(msg);
} else if (!otherWindow) { } else if (!otherWindow) {
if (data.txid !== txid) {
console.log("DROP Message with weird txid");
return;
}
clearInterval(intr);
otherWindow = ow; otherWindow = ow;
ow.postMessage(JSON.stringify({ txid: data.txid }), '*');
cb(chan); cb(chan);
} else if (typeof(data.q) === 'string' && handlers[data.q]) { } else if (typeof(data.q) === 'string' && handlers[data.q]) {
handlers[data.q].forEach(function (f) { handlers[data.q].forEach(function (f) {
@ -139,17 +134,6 @@ define([
// we're in the sandbox // we're in the sandbox
otherWindow = ow; otherWindow = ow;
cb(chan); cb(chan);
} else {
require(['/common/requireconfig.js'], function (RequireConfig) {
txid = mkTxid();
intr = setInterval(function () {
ow.postMessage(JSON.stringify({
txid: txid,
content: { requireConf: RequireConfig() },
q: 'INIT'
}), '*');
}, 1);
});
} }
}; };

2
www/pad2/inner.html
View File

@ -2,7 +2,7 @@
<html class="cp pad"> <html class="cp pad">
<head> <head>
<meta content="text/html; charset=utf-8" http-equiv="content-type"/> <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
<script async data-bootload="/pad2/main.js" data-main="/common/sframe-boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script> <script async data-bootload="/pad2/main.js" data-main="/common/sframe-boot.js?ver=1.1" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
<style> <style>
html, body { html, body {
margin: 0px; margin: 0px;

350
www/pad2/outer.js
View File

@ -1,11 +1,25 @@
// Load #1, load as little as possible because we are in a race to get the loading screen up.
define([ define([
'/bower_components/nthen/index.js',
'/api/config', '/api/config',
'jquery', 'jquery',
'/common/requireconfig.js', '/common/requireconfig.js'
'/common/cryptget.js' ], function (nThen, ApiConfig, $, RequireConfig) {
], function (ApiConfig, $, RequireConfig, Cryptget) {
var requireConfig = RequireConfig(); var requireConfig = RequireConfig();
$(function () {
// Loaded in load #3
var CpNfOuter;
var Cryptpad;
var Crypto;
var Cryptget;
var sframeChan;
var secret;
var hashes;
nThen(function (waitFor) {
$(waitFor());
}).nThen(function (waitFor) {
var req = { var req = {
cfg: requireConfig, cfg: requireConfig,
req: [ '/common/loading.js' ], req: [ '/common/loading.js' ],
@ -16,183 +30,195 @@ define([
$('#sbox-iframe').attr('src', $('#sbox-iframe').attr('src',
ApiConfig.httpSafeOrigin + '/pad2/inner.html?' + requireConfig.urlArgs + ApiConfig.httpSafeOrigin + '/pad2/inner.html?' + requireConfig.urlArgs +
'#' + encodeURIComponent(JSON.stringify(req))); '#' + encodeURIComponent(JSON.stringify(req)));
});
require([ // This is a cheap trick to avoid loading sframe-channel in parallel with the
'/common/sframe-channel.js', // loading screen setup.
'/common/sframe-chainpad-netflux-outer.js', var done = waitFor();
'/bower_components/nthen/index.js', var onMsg = function (msg) {
'/common/cryptpad-common.js', var data = JSON.parse(msg.data);
'/bower_components/chainpad-crypto/crypto.js' if (data.q !== 'READY') { return; }
], function (SFrameChannel, CpNfOuter, nThen, Cryptpad, Crypto) { window.removeEventListener('message', onMsg);
var sframeChan; var _done = done;
var hashes; done = function () { };
var secret; _done();
nThen(function (waitFor) { };
$(waitFor()); window.addEventListener('message', onMsg);
}).nThen(function (waitFor) {
}).nThen(function (waitFor) {
// Load #3, the loading screen is up so grab whatever you need...
require([
'/common/sframe-chainpad-netflux-outer.js',
'/common/cryptpad-common.js',
'/bower_components/chainpad-crypto/crypto.js',
'/common/cryptget.js',
'/common/sframe-channel.js',
], waitFor(function (_CpNfOuter, _Cryptpad, _Crypto, _Cryptget, SFrameChannel) {
CpNfOuter = _CpNfOuter;
Cryptpad = _Cryptpad;
Crypto = _Crypto;
Cryptget = _Cryptget;
SFrameChannel.create($('#sbox-iframe')[0].contentWindow, waitFor(function (sfc) { SFrameChannel.create($('#sbox-iframe')[0].contentWindow, waitFor(function (sfc) {
sframeChan = sfc; sframeChan = sfc;
console.log('sframe initialized');
})); }));
Cryptpad.ready(waitFor()); Cryptpad.ready(waitFor());
}).nThen(function (waitFor) { }));
secret = Cryptpad.getSecrets(); }).nThen(function (waitFor) {
if (!secret.channel) { secret = Cryptpad.getSecrets();
// New pad: create a new random channel id if (!secret.channel) {
secret.channel = Cryptpad.createChannelId(); // New pad: create a new random channel id
} secret.channel = Cryptpad.createChannelId();
Cryptpad.getShareHashes(secret, waitFor(function (err, h) { hashes = h; })); }
}).nThen(function (/*waitFor*/) { Cryptpad.getShareHashes(secret, waitFor(function (err, h) { hashes = h; }));
var readOnly = secret.keys && !secret.keys.editKeyStr; }).nThen(function (/*waitFor*/) {
if (!secret.keys) { secret.keys = secret.key; } var readOnly = secret.keys && !secret.keys.editKeyStr;
var parsed = Cryptpad.parsePadUrl(window.location.href); if (!secret.keys) { secret.keys = secret.key; }
parsed.type = parsed.type.replace('pad2', 'pad'); var parsed = Cryptpad.parsePadUrl(window.location.href);
if (!parsed.type) { throw new Error(); } parsed.type = parsed.type.replace('pad2', 'pad');
var defaultTitle = Cryptpad.getDefaultName(parsed); if (!parsed.type) { throw new Error(); }
var updateMeta = function () { var defaultTitle = Cryptpad.getDefaultName(parsed);
//console.log('EV_METADATA_UPDATE'); var updateMeta = function () {
var name; //console.log('EV_METADATA_UPDATE');
nThen(function (waitFor) { var name;
Cryptpad.getLastName(waitFor(function (err, n) { nThen(function (waitFor) {
if (err) { console.log(err); } Cryptpad.getLastName(waitFor(function (err, n) {
name = n; if (err) { console.log(err); }
})); name = n;
}).nThen(function (/*waitFor*/) { }));
sframeChan.event('EV_METADATA_UPDATE', { }).nThen(function (/*waitFor*/) {
doc: { sframeChan.event('EV_METADATA_UPDATE', {
defaultTitle: defaultTitle, doc: {
type: parsed.type defaultTitle: defaultTitle,
}, type: parsed.type
user: { },
name: name, user: {
uid: Cryptpad.getUid(), name: name,
avatar: Cryptpad.getAvatarUrl(), uid: Cryptpad.getUid(),
profile: Cryptpad.getProfileUrl(), avatar: Cryptpad.getAvatarUrl(),
curvePublic: Cryptpad.getProxy().curvePublic, profile: Cryptpad.getProfileUrl(),
netfluxId: Cryptpad.getNetwork().webChannels[0].myID, curvePublic: Cryptpad.getProxy().curvePublic,
}, netfluxId: Cryptpad.getNetwork().webChannels[0].myID,
priv: { },
accountName: Cryptpad.getAccountName(), priv: {
origin: window.location.origin, accountName: Cryptpad.getAccountName(),
pathname: window.location.pathname, origin: window.location.origin,
readOnly: readOnly, pathname: window.location.pathname,
availableHashes: hashes, readOnly: readOnly,
isTemplate: Cryptpad.isTemplate(window.location.href), availableHashes: hashes,
feedbackAllowed: Cryptpad.isFeedbackAllowed() isTemplate: Cryptpad.isTemplate(window.location.href),
} feedbackAllowed: Cryptpad.isFeedbackAllowed()
});
});
};
Cryptpad.onDisplayNameChanged(updateMeta);
sframeChan.onReg('EV_METADATA_UPDATE', updateMeta);
Cryptpad.onError(function (info) {
console.log('error');
console.log(info);
if (info && info.type === "store") {
//onConnectError();
}
});
sframeChan.on('Q_ANON_RPC_MESSAGE', function (data, cb) {
Cryptpad.anonRpcMsg(data.msg, data.content, function (err, response) {
cb({error: err, response: response});
});
});
sframeChan.on('Q_SET_PAD_TITLE_IN_DRIVE', function (newTitle, cb) {
Cryptpad.renamePad(newTitle, undefined, function (err) {
if (err) { cb('ERROR'); } else { cb(); }
});
});
sframeChan.on('Q_SETTINGS_SET_DISPLAY_NAME', function (newName, cb) {
Cryptpad.setAttribute('username', newName, function (err) {
if (err) {
console.log("Couldn't set username");
console.error(err);
cb('ERROR');
return;
} }
Cryptpad.changeDisplayName(newName, true);
cb();
}); });
}); });
};
Cryptpad.onDisplayNameChanged(updateMeta);
sframeChan.onReg('EV_METADATA_UPDATE', updateMeta);
sframeChan.on('Q_LOGOUT', function (data, cb) { Cryptpad.onError(function (info) {
Cryptpad.logout(cb); console.log('error');
console.log(info);
if (info && info.type === "store") {
//onConnectError();
}
});
sframeChan.on('Q_ANON_RPC_MESSAGE', function (data, cb) {
Cryptpad.anonRpcMsg(data.msg, data.content, function (err, response) {
cb({error: err, response: response});
}); });
});
sframeChan.on('Q_SET_LOGIN_REDIRECT', function (data, cb) { sframeChan.on('Q_SET_PAD_TITLE_IN_DRIVE', function (newTitle, cb) {
sessionStorage.redirectTo = window.location.href; Cryptpad.renamePad(newTitle, undefined, function (err) {
if (err) { cb('ERROR'); } else { cb(); }
});
});
sframeChan.on('Q_SETTINGS_SET_DISPLAY_NAME', function (newName, cb) {
Cryptpad.setAttribute('username', newName, function (err) {
if (err) {
console.log("Couldn't set username");
console.error(err);
cb('ERROR');
return;
}
Cryptpad.changeDisplayName(newName, true);
cb(); cb();
}); });
});
sframeChan.on('Q_GET_PIN_LIMIT_STATUS', function (data, cb) { sframeChan.on('Q_LOGOUT', function (data, cb) {
Cryptpad.isOverPinLimit(function (e, overLimit, limits) { Cryptpad.logout(cb);
cb({ });
error: e,
overLimit: overLimit, sframeChan.on('Q_SET_LOGIN_REDIRECT', function (data, cb) {
limits: limits sessionStorage.redirectTo = window.location.href;
}); cb();
});
sframeChan.on('Q_GET_PIN_LIMIT_STATUS', function (data, cb) {
Cryptpad.isOverPinLimit(function (e, overLimit, limits) {
cb({
error: e,
overLimit: overLimit,
limits: limits
}); });
}); });
});
sframeChan.on('Q_MOVE_TO_TRASH', function (data, cb) { sframeChan.on('Q_MOVE_TO_TRASH', function (data, cb) {
Cryptpad.moveToTrash(cb); Cryptpad.moveToTrash(cb);
}); });
sframeChan.on('Q_SAVE_AS_TEMPLATE', function (data, cb) { sframeChan.on('Q_SAVE_AS_TEMPLATE', function (data, cb) {
Cryptpad.saveAsTemplate(Cryptget.put, data, cb); Cryptpad.saveAsTemplate(Cryptget.put, data, cb);
}); });
sframeChan.on('Q_GET_FULL_HISTORY', function (data, cb) { sframeChan.on('Q_GET_FULL_HISTORY', function (data, cb) {
var network = Cryptpad.getNetwork(); var network = Cryptpad.getNetwork();
var hkn = network.historyKeeper; var hkn = network.historyKeeper;
var crypto = Crypto.createEncryptor(secret.keys); var crypto = Crypto.createEncryptor(secret.keys);
// Get the history messages and send them to the iframe // Get the history messages and send them to the iframe
var parse = function (msg) { var parse = function (msg) {
try { try {
return JSON.parse(msg); return JSON.parse(msg);
} catch (e) { } catch (e) {
return null; return null;
}
};
var onMsg = function (msg) {
var parsed = parse(msg);
if (parsed[0] === 'FULL_HISTORY_END') {
console.log('END');
cb();
return;
}
if (parsed[0] !== 'FULL_HISTORY') { return; }
if (parsed[1] && parsed[1].validateKey) { // First message
secret.keys.validateKey = parsed[1].validateKey;
return;
}
msg = parsed[1][4];
if (msg) {
msg = msg.replace(/^cp\|/, '');
var decryptedMsg = crypto.decrypt(msg, secret.keys.validateKey);
sframeChan.event('EV_RT_HIST_MESSAGE', decryptedMsg);
}
};
network.on('message', onMsg);
network.sendto(hkn, JSON.stringify(['GET_FULL_HISTORY', secret.channel, secret.keys.validateKey]));
});
CpNfOuter.start({
sframeChan: sframeChan,
channel: secret.channel,
network: Cryptpad.getNetwork(),
validateKey: secret.keys.validateKey || undefined,
readOnly: readOnly,
crypto: Crypto.createEncryptor(secret.keys),
onConnect: function (wc) {
if (readOnly) { return; }
Cryptpad.replaceHash(Cryptpad.getEditHashFromKeys(wc.id, secret.keys));
} }
}); };
var onMsg = function (msg) {
var parsed = parse(msg);
if (parsed[0] === 'FULL_HISTORY_END') {
console.log('END');
cb();
return;
}
if (parsed[0] !== 'FULL_HISTORY') { return; }
if (parsed[1] && parsed[1].validateKey) { // First message
secret.keys.validateKey = parsed[1].validateKey;
return;
}
msg = parsed[1][4];
if (msg) {
msg = msg.replace(/^cp\|/, '');
var decryptedMsg = crypto.decrypt(msg, secret.keys.validateKey);
sframeChan.event('EV_RT_HIST_MESSAGE', decryptedMsg);
}
};
network.on('message', onMsg);
network.sendto(hkn, JSON.stringify(['GET_FULL_HISTORY', secret.channel, secret.keys.validateKey]));
});
CpNfOuter.start({
sframeChan: sframeChan,
channel: secret.channel,
network: Cryptpad.getNetwork(),
validateKey: secret.keys.validateKey || undefined,
readOnly: readOnly,
crypto: Crypto.createEncryptor(secret.keys),
onConnect: function (wc) {
if (readOnly) { return; }
Cryptpad.replaceHash(Cryptpad.getEditHashFromKeys(wc.id, secret.keys));
}
}); });
}); });
}); });