[ZEPPELIN-1190] [WIP] Visit Notebook Revision

zeppelin-web/src/app/app.js

@@ -63,6 +63,10 @@
               templateUrl: 'app/notebook/notebook.html',
               controller: 'NotebookCtrl'
             })
+            .when('/notebook/:noteId/revision/:revisionId', {
+              templateUrl: 'app/notebook/notebook.html',
+              controller: 'NotebookCtrl'
+            })
             .when('/jobmanager', {
               templateUrl: 'app/jobmanager/jobmanager.html',
               controller: 'JobmanagerCtrl'

zeppelin-web/src/app/notebook/notebook-actionBar.html

@@ -101,8 +101,8 @@ <h3>
         </ul>
       </div>
       <div class="btn-group" role="group">
-        <button type="button" class="btn btn-default btn-xs revisionName">
-          Head
+        <button type="button" class="btn btn-default btn-xs revisionName" title="{{currentRevision}}">
+          <div style="overflow: hidden">{{currentRevision}}</div>
         </button>
         <button type="button" ng-if="noteRevisions.length > 0"
           class="btn btn-default dropdown-toggle caretSeparator"
@@ -111,7 +111,7 @@ <h3>
         </button>
         <ul class="dropdown-menu pull-right" aria-labelledby="revisionsDropdown">
           <li ng-repeat="revision in noteRevisions | orderBy:'time':true" class="revision">
-            <a style="cursor:pointer">
+            <a style="cursor:pointer" ng-click="visitRevision(revision)">
               <span style="display: block;">
                 <strong>{{revision.message}}</strong>
               </span>

zeppelin-web/src/app/notebook/notebook.controller.js

@@ -15,7 +15,7 @@
 
 angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $route, $routeParams, $location,
                                                                      $rootScope, $http, websocketMsgSrv,
-                                                                     baseUrlSrv, $timeout, saveAsService) {
+                                                                     baseUrlSrv, $timeout, saveAsService, ngToast) {
   $scope.note = null;
   $scope.moment = moment;
   $scope.editorToggled = false;
@@ -41,8 +41,8 @@ angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $ro
 
   var connectedOnce = false;
 
-  // user auto complete related
   $scope.noteRevisions = [];
+  $scope.currentRevision = 'Head';
 
   $scope.$on('setConnectedStatus', function(event, param) {
     if (connectedOnce && param) {
@@ -66,7 +66,11 @@ angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $ro
 
   /** Init the new controller */
   var initNotebook = function() {
-    websocketMsgSrv.getNotebook($routeParams.noteId);
+    if ($routeParams.revisionId) {
+      websocketMsgSrv.getNoteByRevision($routeParams.noteId, $routeParams.revisionId);
+    } else {
+      websocketMsgSrv.getNotebook($routeParams.noteId);
+    }
     websocketMsgSrv.listRevisionHistory($routeParams.noteId);
     var currentRoute = $route.current;
     if (currentRoute) {
@@ -171,17 +175,6 @@ angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $ro
     document.getElementById('note.checkpoint.message').value = '';
   };
 
-  $scope.$on('listRevisionHistory', function(event, data) {
-    console.log('We got the revisions %o', data);
-    $scope.noteRevisions = data.revisionList;
-  });
-
-  // receive certain revision of note
-  $scope.$on('noteRevision', function(event, data) {
-    console.log('received note revision %o', data);
-    //TODO(xxx): render it
-  });
-
   $scope.runNote = function() {
     BootstrapDialog.confirm({
       closable: true,
@@ -685,6 +678,19 @@ angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $ro
     }
   };
 
+  $scope.visitRevision = function(revision) {
+    if (revision.id) {
+      if (revision.id === 'Head') {
+        $location.path('/notebook/' + $routeParams.noteId);
+      } else {
+        $location.path('/notebook/' + $routeParams.noteId + '/revision/' + revision.id);
+      }
+    } else {
+      ngToast.danger({content: 'There is a problem with this Revision',
+        verticalPosition: 'top', dismissOnTimeout: false});
+    }
+  };
+
   var isSettingDirty = function() {
     if (angular.equals($scope.interpreterBindings, $scope.interpreterBindingsOrig)) {
       return false;
@@ -709,6 +715,30 @@ angular.module('zeppelinWebApp').controller('NotebookCtrl', function($scope, $ro
   ** $scope.$on functions below
   */
 
+  $scope.$on('listRevisionHistory', function(event, data) {
+    console.log('We got the revisions %o', data);
+    $scope.noteRevisions = data.revisionList;
+    $scope.noteRevisions.splice(0, 0, {
+      id: 'Head',
+      message: 'Head'
+    });
+    if ($routeParams.revisionId) {
+      var index = _.findIndex($scope.noteRevisions, {'id': $routeParams.revisionId});
+      if (index > -1) {
+        $scope.currentRevision = $scope.noteRevisions[index].message;
+      }
+    }
+  });
+
+  $scope.$on('noteRevision', function(event, note) {
+    console.log('received note revision %o', note);
+    if (note) {
+      $scope.note = note;
+    } else {
+      $location.path('/');
+    }
+  });
+
   $scope.$on('setConnectedStatus', function(event, param) {
     if (connectedOnce && param) {
       initNotebook();

zeppelin-web/src/components/websocketEvents/websocketEvents.factory.js

@@ -114,7 +114,7 @@ angular.module('zeppelinWebApp').factory('websocketEvents',
     } else if (op === 'LIST_REVISION_HISTORY') {
       $rootScope.$broadcast('listRevisionHistory', data);
     } else if (op === 'NOTE_REVISION') {
-      $rootScope.$broadcast('noteRevision', data);
+      $rootScope.$broadcast('noteRevision', data.data);
     } else if (op === 'INTERPRETER_BINDINGS') {
       $rootScope.$broadcast('interpreterBindings', data);
     } else if (op === 'ERROR_INFO') {