Add the history mode to the CryptDrive

pull/1/head
yflory 8 years ago
parent afb0061d7b
commit f414d480a9

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

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

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

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

@ -173,6 +173,10 @@ define([
var $closeIcon = $('<span>', {"class": "fa fa-window-close"}); var $closeIcon = $('<span>', {"class": "fa fa-window-close"});
var $backupIcon = $('<span>', {"class": "fa fa-life-ring"}); var $backupIcon = $('<span>', {"class": "fa fa-life-ring"});
var history = {
isHistoryMode: false,
};
var init = function (proxy) { var init = function (proxy) {
var files = proxy.drive; var files = proxy.drive;
var isOwnDrive = function () { var isOwnDrive = function () {
@ -1646,7 +1650,8 @@ define([
module.resetTree(); 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].selectionStart = getSearchCursor();
$tree.find('#searchInput')[0].selectionEnd = getSearchCursor(); $tree.find('#searchInput')[0].selectionEnd = getSearchCursor();
@ -1829,7 +1834,7 @@ define([
var keys = Object.keys(root).sort(); var keys = Object.keys(root).sort();
keys.forEach(function (key) { keys.forEach(function (key) {
// Do not display files in the menu // Do not display files in the menu
if (filesOp.isFile(root[key])) { return; } if (!filesOp.isFolder(root[key])) { return; }
var newPath = path.slice(); var newPath = path.slice();
newPath.push(key); newPath.push(key);
var isCurrentFolder = filesOp.comparePath(newPath, currentPath); var isCurrentFolder = filesOp.comparePath(newPath, currentPath);
@ -2263,6 +2268,7 @@ define([
} }
}; };
proxy.on('change', [], function (o, n, p) { proxy.on('change', [], function (o, n, p) {
if (history.isHistoryMode) { return; }
var path = arguments[2]; var path = arguments[2];
if (path[0] !== 'drive') { return false; } if (path[0] !== 'drive') { return false; }
path = path.slice(1); path = path.slice(1);
@ -2277,6 +2283,7 @@ define([
module.resetTree(); module.resetTree();
return false; return false;
}).on('remove', [], function (o, p) { }).on('remove', [], function (o, p) {
if (history.isHistoryMode) { return; }
var path = arguments[1]; var path = arguments[1];
if (path[0] !== 'drive') { return false; } if (path[0] !== 'drive') { return false; }
path = path.slice(1); path = path.slice(1);
@ -2302,6 +2309,17 @@ define([
window.clearInterval(APP.resizeTree); window.clearInterval(APP.resizeTree);
APP.resizeTree = undefined; 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) { var createReadme = function (proxy, cb) {
if (sessionStorage.createReadme) { 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) { var setName = APP.setName = function (newName) {
if (typeof(newName) !== 'string') { return; } if (typeof(newName) !== 'string') { return; }
var myUserNameTemp = newName.trim(); var myUserNameTemp = newName.trim();
@ -2434,6 +2461,37 @@ define([
$linkToMain.off('click'); $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) { if (!readOnly && !APP.loggedIn) {
var $backupButton = Cryptpad.createButton('', true).removeClass('fa').removeClass('fa-question'); var $backupButton = Cryptpad.createButton('', true).removeClass('fa').removeClass('fa-question');
$backupButton.append($backupIcon.clone().css('marginRight', '0px')); $backupButton.append($backupIcon.clone().css('marginRight', '0px'));

Loading…
Cancel
Save