Add the history mode to the CryptDrive

This commit is contained in:
yflory 2017-04-28 18:23:41 +02:00
parent afb0061d7b
commit f414d480a9
5 changed files with 82 additions and 22 deletions

View file

@ -42,7 +42,7 @@
}
button {
&#shareButton, &.btn.btn-success {
&#shareButton, &.buttonSuccess {
// Bootstrap 4 colors
color: #fff;
background: @toolbar-green;
@ -58,7 +58,7 @@
margin-left: 5px;
}
}
&#newdoc, &.btn.btn-primary {
&#newdoc, &.buttonPrimary {
// Bootstrap 4 colors
color: #fff;
background: #0275d8;
@ -443,7 +443,7 @@
display: inline-block;
vertical-align: middle;
text-align: center;
input { width: 50px; }
input { width: 75px; }
}
.gotoInput {
vertical-align: middle;

View file

@ -125,41 +125,41 @@
border-color: #ccc;
}
.cryptpad-toolbar button#shareButton,
.cryptpad-toolbar button.btn.btn-success {
.cryptpad-toolbar button.buttonSuccess {
color: #fff;
background: #5cb85c;
border-color: #5cb85c;
}
.cryptpad-toolbar button#shareButton:hover,
.cryptpad-toolbar button.btn.btn-success:hover {
.cryptpad-toolbar button.buttonSuccess:hover {
background: #449d44;
border: 1px solid #419641;
}
.cryptpad-toolbar button#shareButton span,
.cryptpad-toolbar button.btn.btn-success span {
.cryptpad-toolbar button.buttonSuccess span {
color: #fff;
}
.cryptpad-toolbar button#shareButton .large,
.cryptpad-toolbar button.btn.btn-success .large {
.cryptpad-toolbar button.buttonSuccess .large {
margin-left: 5px;
}
.cryptpad-toolbar button#newdoc,
.cryptpad-toolbar button.btn.btn-primary {
.cryptpad-toolbar button.buttonPrimary {
color: #fff;
background: #0275d8;
border-color: #0275d8;
}
.cryptpad-toolbar button#newdoc:hover,
.cryptpad-toolbar button.btn.btn-primary:hover {
.cryptpad-toolbar button.buttonPrimary:hover {
background: #025aa5;
border: 1px solid #01549b;
}
.cryptpad-toolbar button#newdoc span,
.cryptpad-toolbar button.btn.btn-primary span {
.cryptpad-toolbar button.buttonPrimary span {
color: #fff;
}
.cryptpad-toolbar button#newdoc .large,
.cryptpad-toolbar button.btn.btn-primary .large {
.cryptpad-toolbar button.buttonPrimary .large {
margin-left: 5px;
}
.cryptpad-toolbar button.hidden {
@ -516,7 +516,7 @@
text-align: center;
}
.cryptpad-toolbar-history .goto input {
width: 50px;
width: 75px;
}
.cryptpad-toolbar-history .gotoInput {
vertical-align: middle;

View file

@ -18,12 +18,13 @@ define([
return states;
};
var loadHistory = function (common, cb) {
var loadHistory = function (config, common, cb) {
var network = common.getNetwork();
var hkn = network.historyKeeper;
var wcId = common.hrefToHexChannelId(window.location.href);
var wcId = common.hrefToHexChannelId(config.href || window.location.href);
console.log(wcId);
var createRealtime = function(chan) {
return ChainPad.create({
userName: 'history',
@ -35,7 +36,8 @@ define([
};
var realtime = createRealtime();
var secret = common.getSecrets();
var hash = config.href ? common.parsePadUrl(config.href).hash : undefined;
var secret = common.getSecrets(hash);
var crypto = Crypto.createEncryptor(secret.keys);
var to = window.setTimeout(function () {
@ -134,12 +136,12 @@ define([
$right.hide();
$cke.hide();
var $prev =$('<button>', {
'class': 'previous fa fa-step-backward btn btn-primary',
'class': 'previous fa fa-step-backward buttonPrimary',
title: Messages.history_prev
}).appendTo($hist);
var $nav = $('<div>', {'class': 'goto'}).appendTo($hist);
var $next = $('<button>', {
'class': 'next fa fa-step-forward btn btn-primary',
'class': 'next fa fa-step-forward buttonPrimary',
title: Messages.history_next
}).appendTo($hist);
@ -160,7 +162,7 @@ define([
title: Messages.history_closeTitle
}).text(Messages.history_close).appendTo($nav);
var $rev = $('<button>', {
'class':'revertHistory btn btn-success',
'class':'revertHistory buttonSuccess',
title: Messages.history_restoreTitle
}).text(Messages.history_restore).appendTo($nav);
@ -211,7 +213,7 @@ define([
};
// Load all the history messages into a new chainpad object
loadHistory(common, function (err, newRt) {
loadHistory(config, common, function (err, newRt) {
History.loading = false;
if (err) { throw new Error(err); }
realtime = newRt;

View file

@ -69,7 +69,7 @@ define([
};
var isFolder = exp.isFolder = function (element) {
return typeof(element) !== "string";
return typeof(element) === "object";
};
var isFolderEmpty = exp.isFolderEmpty = function (element) {
if (typeof(element) !== "object") { return false; }

View file

@ -173,6 +173,10 @@ define([
var $closeIcon = $('<span>', {"class": "fa fa-window-close"});
var $backupIcon = $('<span>', {"class": "fa fa-life-ring"});
var history = {
isHistoryMode: false,
};
var init = function (proxy) {
var files = proxy.drive;
var isOwnDrive = function () {
@ -1646,7 +1650,8 @@ define([
module.resetTree();
$tree.find('#searchInput').focus();
// in history mode we want to focus the version number input
if (!history.isHistoryMode) { $tree.find('#searchInput').focus(); }
$tree.find('#searchInput')[0].selectionStart = getSearchCursor();
$tree.find('#searchInput')[0].selectionEnd = getSearchCursor();
@ -1829,7 +1834,7 @@ define([
var keys = Object.keys(root).sort();
keys.forEach(function (key) {
// Do not display files in the menu
if (filesOp.isFile(root[key])) { return; }
if (!filesOp.isFolder(root[key])) { return; }
var newPath = path.slice();
newPath.push(key);
var isCurrentFolder = filesOp.comparePath(newPath, currentPath);
@ -2263,6 +2268,7 @@ define([
}
};
proxy.on('change', [], function (o, n, p) {
if (history.isHistoryMode) { return; }
var path = arguments[2];
if (path[0] !== 'drive') { return false; }
path = path.slice(1);
@ -2277,6 +2283,7 @@ define([
module.resetTree();
return false;
}).on('remove', [], function (o, p) {
if (history.isHistoryMode) { return; }
var path = arguments[1];
if (path[0] !== 'drive') { return false; }
path = path.slice(1);
@ -2302,6 +2309,17 @@ define([
window.clearInterval(APP.resizeTree);
APP.resizeTree = undefined;
});
console.log(files);
history.onEnterHistory = function (obj) {
var files = obj.drive;
filesOp = FO.init(files, config);
refresh();
};
history.onLeaveHistory = function () {
var files = proxy.drive;
filesOp = FO.init(files, config);
refresh();
};
var createReadme = function (proxy, cb) {
if (sessionStorage.createReadme) {
@ -2332,6 +2350,15 @@ define([
});
};
var setHistory = function (bool, update) {
history.isHistoryMode = bool;
setEditable(!bool);
if (!bool && update) {
history.onLeaveHistory();
//init(); //TODO real proxy here
}
};
var setName = APP.setName = function (newName) {
if (typeof(newName) !== 'string') { return; }
var myUserNameTemp = newName.trim();
@ -2434,6 +2461,37 @@ define([
$linkToMain.off('click');
}
/* add a history button */
var histConfig = {};
histConfig.onRender = function (val) {
if (typeof val === "undefined") { return; }
try {
var obj = JSON.parse(val || '{}');
history.currentObj = obj;
history.onEnterHistory(obj);
} catch (e) {
// Probably a parse error
console.error(e);
}
};
histConfig.onClose = function () {
// Close button clicked
setHistory(false, true);
};
histConfig.onRevert = function (val) {
// Revert button clicked
setHistory(false, false);
proxy.drive = history.currentObj.drive;
};
histConfig.onReady = function () {
// Called when the history is loaded and the UI displayed
setHistory(true);
};
histConfig.$toolbar = $bar;
histConfig.href = window.location.origin + window.location.pathname + APP.hash;
var $hist = Cryptpad.createButton('history', true, {histConfig: histConfig});
$rightside.append($hist);
if (!readOnly && !APP.loggedIn) {
var $backupButton = Cryptpad.createButton('', true).removeClass('fa').removeClass('fa-question');
$backupButton.append($backupIcon.clone().css('marginRight', '0px'));