infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

Use new history UI for onlyoffice

Browse Source
pull/1/head
yflory 4 years ago
parent 2287c81d86
commit a9d442a194
3 changed files with 139 additions and 86 deletions
Show Stats Download Patch File Download Diff File

17
customize.dist/src/less2/include/toolbar-history.less
Unescape Escape View File

@ -65,6 +65,17 @@
} }
} }
} }
&.cp-history-oo {
.cp-history-timeline-container {
height: 20px !important;
.cp-history-timeline-pos {
height: 20px !important;
}
}
.cp-history-timeline-actions {
margin-left: 0 !important;
}
}
.cp-history-timeline-line { .cp-history-timeline-line {
display: flex; display: flex;
.cp-history-timeline-legend { .cp-history-timeline-legend {
@ -149,6 +160,12 @@
margin-right: 5px; margin-right: 5px;
} }
} }
.cp-history-timeline-version:empty {
display: none;
}
.cp-history-timeline-time:empty {
display: none;
}
.cp-history-timeline-next { .cp-history-timeline-next {
button:last-child { button:last-child {
margin-right: 0; margin-right: 0;

206
www/common/onlyoffice/history.js
Unescape Escape View File

@ -12,13 +12,14 @@ define([
History.loading = true; History.loading = true;
var $toolbar = config.$toolbar; var $toolbar = config.$toolbar;
var sframeChan = common.getSframeChannel(); var sframeChan = common.getSframeChannel();
History.readOnly = common.getMetadataMgr().getPrivateData().readOnly || !common.isLoggedIn();
if (!config.onlyoffice || !config.setHistory || !config.onCheckpoint || !config.onPatch) { if (!config.onlyoffice || !config.setHistory || !config.onCheckpoint || !config.onPatch) {
throw new Error("Missing config element"); throw new Error("Missing config element");
} }
var cpIndex = -1; var cpIndex = -1;
var msgIndex = 0; var msgIndex = -1;
var ooMessages = {}; var ooMessages = {};
var loading = false; var loading = false;
var update = function () {}; var update = function () {};
@ -42,11 +43,13 @@ define([
var $version, $time, $share; var $version, $time, $share;
var $hist = $toolbar.find('.cp-toolbar-history'); var $hist = $toolbar.find('.cp-toolbar-history');
$hist.addClass('cp-smallpatch');
$hist.addClass('cp-history-oo');
var $bottom = $toolbar.find('.cp-toolbar-bottom'); var $bottom = $toolbar.find('.cp-toolbar-bottom');
var getVersion = function () { var getVersion = function () {
var major = sortedCp.length - cpIndex; var major = sortedCp.length - cpIndex;
return major + '.' + msgIndex; return major + '.' + (msgIndex+1);
}; };
var showVersion = function (initial) { var showVersion = function (initial) {
var v = getVersion(); var v = getVersion();
@ -55,15 +58,16 @@ define([
} }
$version.text("Version: " + v); // XXX $version.text("Version: " + v); // XXX
var $pos = $hist.find('.cp-toolbar-history-pos'); var $pos = $hist.find('.cp-history-timeline-pos');
var cps = sortedCp.length; var cps = sortedCp.length;
var id = sortedCp[cps - cpIndex -1] || -1; var id = sortedCp[cps - cpIndex -1] || -1;
if (!ooMessages[id]) { return; } if (!ooMessages[id]) { return; }
var msgs = ooMessages[id]; var msgs = ooMessages[id];
var p = 100*(msgIndex / (msgs.length)); console.log(ooMessages);
var p = 100*((msgIndex+1) / (msgs.length));
$pos.css('margin-left', p+'%'); $pos.css('margin-left', p+'%');
var time = msgs[msgIndex].time; var time = msgs[msgIndex] && msgs[msgIndex].time;
if (time) { $time.text(new Date(time).toLocaleString()); } if (time) { $time.text(new Date(time).toLocaleString()); }
else { $time.text(''); } else { $time.text(''); }
}; };
@ -93,7 +97,7 @@ define([
// Next cp or last hash // Next cp or last hash
var fromHash = nextId ? hashes[nextId].hash : config.onlyoffice.lastHash; var fromHash = nextId ? hashes[nextId].hash : config.onlyoffice.lastHash;
msgIndex = 0; msgIndex = -1;
showVersion(); showVersion();
if (ooMessages[id]) { if (ooMessages[id]) {
@ -129,25 +133,12 @@ define([
var Messages = common.Messages; var Messages = common.Messages;
var states = [];
$hist.html('').css('display', 'flex'); $hist.html('').css('display', 'flex');
$bottom.hide(); $bottom.hide();
UI.spinner($hist).get().show(); UI.spinner($hist).get().show();
var $fastPrev = $('<button>', { var $fastPrev, $fastNext, $next;
'class': 'cp-toolbar-history-fast-previous fa fa-fast-backward buttonPrimary',
title: Messages.history_prev
});
var $next = $('<button>', {
'class': 'cp-toolbar-history-next fa fa-step-forward buttonPrimary',
title: Messages.history_next
});
var $fastNext = $('<button>', {
'class': 'cp-toolbar-history-fast-next fa fa-fast-forward buttonPrimary',
title: Messages.history_next
});
var getId = function () { var getId = function () {
var cps = sortedCp.length; var cps = sortedCp.length;
@ -155,7 +146,9 @@ define([
}; };
update = function () { update = function () {
console.log($fastPrev, $next, $fastNext);
var cps = sortedCp.length; var cps = sortedCp.length;
console.log(cpIndex, msgIndex, cps);
$fastPrev.show(); $fastPrev.show();
$next.show(); $next.show();
$fastNext.show(); $fastNext.show();
@ -167,64 +160,109 @@ define([
} }
var id = getId(); var id = getId();
var msgs = (ooMessages[id] || []).length; var msgs = (ooMessages[id] || []).length;
if (msgIndex >= msgs) { if (msgIndex >= (msgs-1)) {
$next.hide(); $next.hide();
} }
}; };
var next = function () { var next = function () {
var id = getId(); var id = getId();
if (!ooMessages[id]) { return; } if (!ooMessages[id]) { loading = false; return; }
var msgs = ooMessages[id]; var msgs = ooMessages[id];
msgIndex++;
var patch = msgs[msgIndex]; var patch = msgs[msgIndex];
if (!patch) { loading = false; return; }
config.onPatch(patch); config.onPatch(patch);
loading = false;
msgIndex++;
showVersion(); showVersion();
setTimeout(function () { setTimeout(function () {
$('iframe').blur(); $('iframe').blur();
loading = false;
}, 200); }, 200);
}; };
// Create the history toolbar // Create the history toolbar
var display = function () { var display = function () {
$hist.html(''); $hist.html('');
var $rev = $('<button>', { var fastPrev = h('button.cp-toolbar-history-previous', { title: Messages.history_prev }, [
'class':'cp-toolbar-history-revert buttonSuccess fa fa-check-circle-o', h('i.fa.fa-fast-backward'),
title: Messages.history_restoreTitle ]);
}).appendTo($hist);//.text(Messages.history_restore); var fastNext = h('button.cp-toolbar-history-next', { title: Messages.history_next }, [
if (History.readOnly) { $rev.css('visibility', 'hidden'); } h('i.fa.fa-fast-forward'),
$('<span>', {'class': 'cp-history-filler'}).appendTo($hist); ]);
var _next = h('button.cp-toolbar-history-next', { title: Messages.history_next }, [
$fastPrev.appendTo($hist); h('i.fa.fa-step-forward')
//$prev.hide().appendTo($hist); ]);
var $nav = $('<div>', {'class': 'cp-toolbar-history-goto'}).appendTo($hist); $fastPrev = $(fastPrev);
$next.hide().appendTo($hist); $fastNext = $(fastNext).hide();
$fastNext.hide().appendTo($hist); $next = $(_next).hide();
$share = $('<button>', { var pos = h('span.cp-history-timeline-pos');
'class': 'fa fa-shhare-alt buttonPrimary', var time = h('div.cp-history-timeline-time');
title: Messages.shareButton var version = h('div.cp-history-timeline-version');
}).hide().appendTo($hist); $time = $(time);
$('<span>', {'class': 'cp-history-filler'}).appendTo($hist); $version = $(version);
$time = $(h('div')).appendTo($hist); var bar;
var $close = $('<button>', { var timeline = h('div.cp-toolbar-history-timeline', [
'class':'cp-toolbar-history-close fa fa-window-close', h('div.cp-history-timeline-line', [
title: Messages.history_closeTitle bar = h('span.cp-history-timeline-container')
}).appendTo($hist); ]),
h('div.cp-history-timeline-actions', [
var $bar = $('<div>', {'class': 'cp-toolbar-history-bar'}).appendTo($nav); h('span.cp-history-timeline-prev', [
var $container = $('<div>', {'class':'cp-toolbar-history-pos-container'}).appendTo($bar); fastPrev,
$('<div>', {'class': 'cp-toolbar-history-pos'}).appendTo($container); ]),
time,
$version = $('<span>', { version,
'class': 'cp-toolbar-history-version' h('span.cp-history-timeline-next', [
}).prependTo($bar); _next,
fastNext
])
])
]);
/*
var snapshot = h('button', {
title: Messages.snapshots_new,
}, [
h('i.fa.fa-camera')
]);
*/
var share = h('button', { title: Messages.history_shareTitle }, [
h('i.fa.fa-shhare-alt'),
h('span', Messages.shareButton)
]);
var restore = h('button', {
title: Messages.history_restoreTitle,
}, [
h('i.fa.fa-check'),
h('span', Messages.history_restore)
]);
var close = h('button', { title: Messages.history_closeTitle }, [
h('i.fa.fa-times'),
h('span', Messages.history_close)
]);
var actions = h('div.cp-toolbar-history-actions', [
h('span.cp-history-actions-first', [
//snapshot,
share
]),
h('span.cp-history-actions-last', [
restore,
close
])
]);
if (History.readOnly) {
//snapshot.disabled = true;
restore.disabled = true;
}
$share = $(share);
$hist.append([timeline, actions]);
$(bar).append(pos);
var onKeyDown, onKeyUp; var onKeyDown, onKeyUp;
var close = function () { var closeUI = function () {
History.loading = false;
$hist.hide(); $hist.hide();
$bottom.show(); $bottom.show();
$(window).trigger('resize'); $(window).trigger('resize');
@ -232,30 +270,6 @@ define([
$(window).off('keyup', onKeyUp); $(window).off('keyup', onKeyUp);
}; };
// Close & restore buttons
$close.click(function () {
states = [];
close();
onClose();
});
$rev.click(function () {
UI.confirm(Messages.history_restorePrompt, function (yes) {
if (!yes) { return; }
close();
History.loading = false;
onRevert();
UI.log(Messages.history_restoreDone);
});
});
// Versioned link
$share.click(function () {
// XXX
common.getSframeChannel().event('EV_SHARE_OPEN', {
versionHash: getVersion()
});
});
// Push one patch // Push one patch
$next.click(function () { $next.click(function () {
if (loading) { return; } if (loading) { return; }
@ -272,10 +286,10 @@ define([
update(); update();
}); });
// Go to next checkpoint // Go to next checkpoint
$fastPrev.click(function () { $fastPrev.click(function () {
if (loading) { return; } if (loading) { return; }
loading = true; loading = true;
if (msgIndex === 0) { if (msgIndex === -1) {
cpIndex++; cpIndex++;
} }
loadMoreOOHistory(); loadMoreOOHistory();
@ -286,11 +300,33 @@ define([
if ([38, 39].indexOf(e.which) >= 0) { p(); return $next.click(); } // Right if ([38, 39].indexOf(e.which) >= 0) { p(); return $next.click(); } // Right
if (e.which === 33) { p(); return $fastNext.click(); } // PageUp if (e.which === 33) { p(); return $fastNext.click(); } // PageUp
if (e.which === 34) { p(); return $fastPrev.click(); } // PageUp if (e.which === 34) { p(); return $fastPrev.click(); } // PageUp
if (e.which === 27) { p(); $close.click(); } if (e.which === 27) { p(); return $(close).click(); }
}; };
onKeyUp = function (e) { e.stopPropagation(); }; onKeyUp = function (e) { e.stopPropagation(); };
$(window).on('keydown', onKeyDown).on('keyup', onKeyUp).focus(); $(window).on('keydown', onKeyDown).on('keyup', onKeyUp).focus();
$(window).trigger('resize');
// Versioned link
$share.click(function () {
common.getSframeChannel().event('EV_SHARE_OPEN', {
versionHash: getVersion()
});
});
// Close & restore buttons
$(close).click(function () {
History.loading = false;
onClose();
closeUI();
});
$(restore).click(function () {
UI.confirm(Messages.history_restorePrompt, function (yes) {
if (!yes) { return; }
closeUI();
History.loading = false;
onRevert();
UI.log(Messages.history_restoreDone);
});
});
}; };
display(); display();

2
www/common/onlyoffice/inner.js
Unescape Escape View File

@ -1113,7 +1113,7 @@ define([
startOO = function (blob, file, force) { startOO = function (blob, file, force) {
if (APP.ooconfig && !force) { return void console.error('already started'); } if (APP.ooconfig && !force) { return void console.error('already started'); }
var url = URL.createObjectURL(blob); var url = URL.createObjectURL(blob);
var lock = readOnly || APP.migrate; var lock = !APP.history && (readOnly || APP.migrate);
// Starting from version 3, we can use the view mode again // Starting from version 3, we can use the view mode again
// defined but never used // defined but never used

Write Preview
Loading…
Cancel
Save