blitzwing/cryptpad
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Loading message and loading bar for migration

Browse source
This commit is contained in:
yflory 2018-05-04 18:41:54 +02:00
parent d6d53e4068
commit 2d2701596a
12 changed files with 178 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
customize.dist/loading.js
View file

@ -151,6 +151,24 @@ define([], function () {
max-width: 60%;
display: inline-block;
}
.cp-loading-progress {
width: 100%;
margin: 20px;
}
.cp-loading-progress p {
margin: 5px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.cp-loading-progress-bar {
height: 5px;
background: white;
}
.cp-loading-progress-bar-value {
height: 100%;
background: #00ff37;
}
*/}).toString().slice(14, -3);
var urlArgs = window.location.href.replace(/^.*\?([^\?]*)$/, function (all, x) { return x; });
var elem = document.createElement('div');

2
customize.dist/src/less2/include/creation.less
View file

@ -334,7 +334,7 @@
width: 95%;
margin: 10px auto;
}
.cp-creation-expire{
.cp-creation-expire {
&.active {
label {
flex: 1;

7
customize.dist/translations/messages.fr.js
View file

@ -1120,5 +1120,12 @@ define(function () {
out.share_embedCategory = "Intégration";
out.share_mediatagCopy = "Copier le mediatag";
// Loading info
out.loading_pad_1 = "Initialisation du pad";
out.loading_pad_2 = "Chargement du contenu du pad";
out.loading_drive_1 = "Préparation des données de l'utilisateur";
out.loading_drive_2 = "Mise à jour des données de l'utilisateur";
out.loading_drive_3 = "Vérification des données de l'utilisateur";
return out;
});

6
customize.dist/translations/messages.js
View file

@ -1166,6 +1166,12 @@ define(function () {
out.share_embedCategory = "Embed";
out.share_mediatagCopy = "Copy mediatag to clipboard";
// Loading info
out.loading_pad_1 = "Initializing pad";
out.loading_pad_2 = "Loading pad content";
out.loading_drive_1 = "Preparing user data";
out.loading_drive_2 = "Upgrading user data to the latest version";
out.loading_drive_3 = "Checking user data integrity";
return out;
});

89
www/common/common-interface.js
View file

@ -590,6 +590,11 @@ define([
var rdm = Math.floor(Math.random() * keys.length);
return Messages.tips[keys[rdm]];
};*/
var loading = {
error: false,
driveState: 0,
padState: 0
};
UI.addLoadingScreen = function (config) {
config = config || {};
var loadingText = config.loadingText;
@ -598,11 +603,21 @@ define([
$loading.css('display', '');
$loading.removeClass('cp-loading-hidden');
$('.cp-loading-spinner-container').show();
if (loadingText) {
$('#' + LOADING).find('p').show().text(loadingText);
} else {
$('#' + LOADING).find('p').hide().text('');
if (config.progress && !$loading.find('.cp-loading-progress').length) {
var progress = h('div.cp-loading-progress', [
h('p.cp-loading-progress-drive'),
h('p.cp-loading-progress-pad')
]);
$loading.find('.cp-loading-container').append(progress);
} else if (!config.progress) {
$loading.find('.cp-loading-progress').remove();
}
if (loadingText) {
$('#' + LOADING).find('#cp-loading-message').show().text(loadingText);
} else {
$('#' + LOADING).find('#cp-loading-message').hide().text('');
}
loading.error = false;
};
if ($('#' + LOADING).length) {
todo();
@ -611,6 +626,59 @@ define([
todo();
}
};
UI.updateLoadingProgress = function (data, isDrive) {
var $loading = $('#' + LOADING);
if (!$loading.length || loading.error) { return; }
var $progress;
if (isDrive) {
console.log(data);
// Drive state
if (loading.driveState === -1) { return; } // Already loaded
$progress = $loading.find('.cp-loading-progress-drive');
if (!$progress.length) { return; } // Can't find the box to display data
// If state is -1, remove the box, drive is loaded
if (data.state === -1) {
loading.driveState = -1;
$progress.remove();
} else {
if (data.state < loading.driveState) { return; } // We should not display old data
// Update the current state
loading.driveState = data.state;
data.progress = data.progress || 100;
data.msg = Messages['loading_drive_'+data.state] || '';
$progress.html(data.msg);
if (data.progress) {
$progress.append(h('div.cp-loading-progress-bar', [
h('div.cp-loading-progress-bar-value', {style: 'width:'+data.progress+'%;'})
]));
}
}
} else {
// Pad state
if (loading.padState === -1) { return; } // Already loaded
$progress = $loading.find('.cp-loading-progress-pad');
if (!$progress.length) { return; } // Can't find the box to display data
// If state is -1, remove the box, pad is loaded
if (data.state === -1) {
loading.padState = -1;
$progress.remove();
} else {
if (data.state < loading.padState) { return; } // We should not display old data
// Update the current state
loading.padState = data.state;
data.progress = data.progress || 100;
data.msg = Messages['loading_pad_'+data.state] || '';
$progress.html(data.msg);
if (data.progress) {
$progress.append(h('div.cp-loading-progress-bar', [
h('div.cp-loading-progress-bar-value', {style: 'width:'+data.progress+'%;'})
]));
}
}
}
};
UI.removeLoadingScreen = function (cb) {
// Release the test blocker, hopefully every test has been registered.
// This test is created in sframe-boot2.js
@ -619,6 +687,7 @@ define([
$('#' + LOADING).addClass("cp-loading-hidden");
setTimeout(cb, 750);
loading.error = false;
var $tip = $('#cp-loading-tip').css('top', '')
// loading.less sets transition-delay: $wait-time
// and transition: opacity $fadeout-time
@ -632,13 +701,16 @@ define([
// jquery.fadeout can get stuck
};
UI.errorLoadingScreen = function (error, transparent, exitable) {
if (!$('#' + LOADING).is(':visible') || $('#' + LOADING).hasClass('cp-loading-hidden')) {
var $loading = $('#' + LOADING);
if (!$loading.is(':visible') || $loading.hasClass('cp-loading-hidden')) {
UI.addLoadingScreen({hideTips: true});
}
loading.error = true;
$loading.find('.cp-loading-progress').remove();
$('.cp-loading-spinner-container').hide();
$('#cp-loading-tip').remove();
if (transparent) { $('#' + LOADING).css('opacity', 0.9); }
var $error = $('#' + LOADING).find('p').show();
if (transparent) { $loading.css('opacity', 0.9); }
var $error = $loading.find('#cp-loading-message').show();
if (error instanceof Element) {
$error.html('').append(error);
} else {
@ -648,7 +720,8 @@ define([
$(window).focus();
$(window).keydown(function (e) {
if (e.which === 27) {
$('#' + LOADING).hide();
$loading.hide();
loading.error = false;
if (typeof(exitable) === "function") { exitable(); }
}
});

8
www/common/cryptpad-common.js
View file

@ -562,6 +562,10 @@ define([
pad.onDisconnectEvent = Util.mkEvent();
pad.onErrorEvent = Util.mkEvent();
// Loading events
common.loading = {};
common.loading.onDriveEvent = Util.mkEvent();
common.getFullHistory = function (data, cb) {
postMessage("GET_FULL_HISTORY", data, cb);
};
@ -726,6 +730,10 @@ define([
case 'DELETE_ACCOUNT': {
common.startAccountDeletion(cb); break;
}
// Loading
case 'LOADING_DRIVE': {
common.loading.onDriveEvent.fire(data); break;
}
}
};

16
www/common/migrate-user-object.js
View file

@ -9,7 +9,7 @@ define([
// 1: migrate pad attributes
// 2: migrate indent settings (codemirror)
return function (userObject, cb) {
return function (userObject, cb, progress) {
var version = userObject.version || 0;
nThen(function () {
@ -107,7 +107,8 @@ define([
var data = userObject.drive.filesData;
var el, parsed;
var n = nThen(function () {});
Object.keys(data).forEach(function (k) {
var padsLength = Object.keys(data).length;
Object.keys(data).forEach(function (k, i) {
n = n.nThen(function (w) {
setTimeout(w(function () {
el = data[k];
@ -121,6 +122,7 @@ define([
var secret = Hash.getSecrets(parsed.type, parsed.hash, el.password);
el.channel = secret.channel;
}
progress(6, Math.round(100*i/padsLength));
console.log('Adding missing channel in filesData ', el.channel);
}
}));
@ -133,6 +135,16 @@ define([
Feedback.send('Migrate-6', true);
userObject.version = version = 6;
}
/*}).nThen(function (waitFor) {
// Test progress bar in the loading screen
var i = 0;
var w = waitFor();
var it = setInterval(function () {
i += 5;
if (i >= 100) { w(); clearInterval(it); i = 100;}
progress(0, i);
}, 500);
progress(0, 0);*/
}).nThen(function () {
cb();
});

15
www/common/outer/async-store.js
View file

@ -694,7 +694,6 @@ define([
expire = +Store.channel.data.expire || undefined;
}
console.log(owners, expire);
var allPads = Util.find(store.proxy, ['drive', 'filesData']) || {};
var isStronger;
@ -1053,10 +1052,21 @@ define([
}
});
nThen(function (waitFor) {
postMessage('LOADING_DRIVE', {
state: 2
});
userObject.migrate(waitFor());
}).nThen(function (waitFor) {
Migrate(proxy, waitFor());
Migrate(proxy, waitFor(), function (version, progress) {
postMessage('LOADING_DRIVE', {
state: 2,
progress: progress
});
});
}).nThen(function () {
postMessage('LOADING_DRIVE', {
state: 3
});
userObject.fixFiles();
var requestLogin = function () {
@ -1164,6 +1174,7 @@ define([
&& !drive['filesData']) {
drive[Constants.oldStorageKey] = [];
}
postMessage('LOADING_DRIVE', { state: 1 });
// Drive already exist: return the existing drive, don't load data from legacy store
onReady(returned, cb);
})

16
www/common/sframe-app-framework.js
View file

@ -279,6 +279,8 @@ define([
var newContentStr = cpNfInner.chainpad.getUserDoc();
if (state === STATE.DELETED) { return; }
UI.updateLoadingProgress({ state: -1 }, false);
var newPad = false;
if (newContentStr === '') { newPad = true; }
@ -429,8 +431,11 @@ define([
};
nThen(function (waitFor) {
UI.addLoadingScreen();
UI.addLoadingScreen({progress: true});
SFCommon.create(waitFor(function (c) { common = c; }));
UI.updateLoadingProgress({
state: 1
}, false);
}).nThen(function (waitFor) {
common.getSframeChannel().onReady(waitFor());
}).nThen(function (waitFor) {
@ -442,7 +447,7 @@ define([
patchTransformer: options.patchTransformer || ChainPad.SmartJSONTransformer,
// cryptpad debug logging (default is 1)
logLevel: 2,
logLevel: 1,
validateContent: options.validateContent || function (content) {
try {
JSON.parse(content);
@ -456,7 +461,12 @@ define([
},
onRemote: onRemote,
onLocal: onLocal,
onInit: function () { stateChange(STATE.INITIALIZING); },
onInit: function () {
UI.updateLoadingProgress({
state: 2
}, false);
stateChange(STATE.INITIALIZING);
},
onReady: function () { evStart.reg(onReady); },
onConnectionChange: onConnectionChange,
onError: onError

11
www/common/sframe-common-outer.js
View file

@ -90,7 +90,16 @@ define([
SFrameChannel.create($('#sbox-iframe')[0].contentWindow, waitFor(function (sfc) {
sframeChan = sfc;
}), false, { cache: cache, localStore: localStore, language: Cryptpad.getLanguage() });
Cryptpad.ready(waitFor(), {
Cryptpad.loading.onDriveEvent.reg(function (data) {
if (sframeChan) { sframeChan.event('EV_LOADING_INFO', data); }
});
Cryptpad.ready(waitFor(function () {
if (sframeChan) {
sframeChan.event('EV_LOADING_INFO', {
state: -1
});
}
}), {
messenger: cfg.messaging,
driveEvents: cfg.driveEvents
});

4
www/common/sframe-common.js
View file

@ -433,6 +433,10 @@ define([
UIElements.displayPasswordPrompt(funcs);
});
ctx.sframeChan.on('EV_LOADING_INFO', function (data) {
UI.updateLoadingProgress(data, true);
});
ctx.metadataMgr.onReady(waitFor());
}).nThen(function () {
try {

3
www/common/sframe-protocol.js
View file

@ -234,4 +234,7 @@ define({
// Ask for the pad password when a pad is protected
'EV_PAD_PASSWORD': true,
'Q_PAD_PASSWORD_VALUE': true,
// Loading events to display in the loading screen
'EV_LOADING_INFO': true,
});