From f414d480a9541a849b06fffbe42b6cef1b120a4b Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Fri, 28 Apr 2017 18:23:41 +0200
Subject: [PATCH] Add the history mode to the CryptDrive

---
 customize.dist/src/less/toolbar.less |  6 +--
 customize.dist/toolbar.css           | 18 ++++----
 www/common/common-history.js         | 16 +++----
 www/common/userObject.js             |  2 +-
 www/drive/main.js                    | 62 +++++++++++++++++++++++++++-
 5 files changed, 82 insertions(+), 22 deletions(-)

diff --git a/customize.dist/src/less/toolbar.less b/customize.dist/src/less/toolbar.less
index 40f895c24..055bb14ed 100644
--- a/customize.dist/src/less/toolbar.less
+++ b/customize.dist/src/less/toolbar.less
@@ -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;
diff --git a/customize.dist/toolbar.css b/customize.dist/toolbar.css
index 76eeb5b4d..37cdd8501 100644
--- a/customize.dist/toolbar.css
+++ b/customize.dist/toolbar.css
@@ -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;
diff --git a/www/common/common-history.js b/www/common/common-history.js
index 2cd5b7707..3d98a9797 100644
--- a/www/common/common-history.js
+++ b/www/common/common-history.js
@@ -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;
diff --git a/www/common/userObject.js b/www/common/userObject.js
index 8ce772f50..c05ac3021 100644
--- a/www/common/userObject.js
+++ b/www/common/userObject.js
@@ -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; }
diff --git a/www/drive/main.js b/www/drive/main.js
index 429cecb03..22da5c09b 100644
--- a/www/drive/main.js
+++ b/www/drive/main.js
@@ -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'));