[ZEPPELIN-1745] View revisions in non-editable mode

### What is this PR for?
This is to make view of revisions non-editable

### What type of PR is it?
Improvement

### Todos
* [x] - disable action bar buttons
* [x] - disable per paragraph editing actions
* [x] - disable hotkeys

### What is the Jira issue?
[ZEPPELIN-1745](https://issues.apache.org/jira/browse/ZEPPELIN-1745)

### How should this be tested?
1. initialize `GitNotebookRepo` by adding
```
export ZEPPELIN_NOTEBOOK_STORAGE="org.apache.zeppelin.notebook.repo.GitNotebookRepo"
```
in your `conf/zeppelin-env.sh`
2. go to any note and create few revisions using commit menu
3. then switch between revisions, during which you shouldn't be able to modify note

### Screenshots (if appropriate)
![revision_view](https://cloud.githubusercontent.com/assets/1642088/21340828/53131054-c6cc-11e6-960b-abf5db905194.gif)

### Questions:
* Does the licenses files need update? no
* Is there breaking changes for older versions? no
* Does this needs documentation? no

Author: Khalid Huseynov <khalidhnv@gmail.com>

Closes #1775 from khalidhuseynov/feat/revision-view and squashes the following commits:

59a92ea [Khalid Huseynov] Merge branch 'master' into feat/revision-view
bbaf286 [Khalid Huseynov] initialize looknfeel
efe09c0 [Khalid Huseynov] enable report view without save
b3a78c7 [Khalid Huseynov] dont show bingings, perms, hotkeys
843abf4 [Khalid Huseynov] remove escaped single quote inside console
84d2c5a [Khalid Huseynov] disable personalized mode button
fa05bdb [Khalid Huseynov] Merge branch 'master' into feat/revision-view
1a5a6a7 [Khalid Huseynov] render result change without commit
06e2977 [Khalid Huseynov] check newValue for undefined
2823142 [Khalid Huseynov] add group span for ng-if
4bfe560 [Khalid Huseynov] gray out editor on revision view
e9d3ceb [Khalid Huseynov] disable edit on db click md interpreter
aff02b9 [Khalid Huseynov] don't show paragraph level hide output buttton
1eea8ce [Khalid Huseynov] don't show paragraph level hide editor button
46d67af [Khalid Huseynov] disable show/hide output in note action bar
0946377 [Khalid Huseynov] disable show/hide code in note action-bar
81346e9 [Khalid Huseynov] disable editing note name
7751b69 [Khalid Huseynov] disable hotkeys
9b85e05 [Khalid Huseynov] disable editor editing
00fb556 [Khalid Huseynov] make paragraph title non-editable
c55de95 [Khalid Huseynov] don't show run/cancel on paragraph
19cacbd [Khalid Huseynov] don't show paragraph settings menu
7d115b8 [Khalid Huseynov] disable + new paragraph
711c0b3 [Khalid Huseynov] disable scheduler
ab8ab4d [Khalid Huseynov] disable remove note
5d9f877 [Khalid Huseynov] disable revision commit
50d40ad [Khalid Huseynov] disable export note
46238e8 [Khalid Huseynov] disable clone note
8e97800 [Khalid Huseynov] disable clear output
fa1397d [Khalid Huseynov] disable run all
4c83895 [Khalid Huseynov] change var name revisionDisabled -> revisionView

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

@@ -18,36 +18,40 @@ <h3>
       <input type="text" pu-elastic-input class="form-control2" placeholder="New name" style="min-width: 0px; max-width: 95%;"
            ng-if="input.showEditor" ng-model="input.value" ng-escape="input.showEditor = false" focus-if="input.showEditor"
            ng-blur="updateNoteName(input.value);input.showEditor = false;" ng-enter="updateNoteName(input.value);input.showEditor = false;" />
-      <p class="form-control-static2" ng-click="input.showEditor = true; input.value = note.name" ng-show="!input.showEditor">{{noteName(note)}}</p>
+      <p class="form-control-static2" ng-click="input.showEditor = !revisionView; input.value = note.name" ng-show="!input.showEditor">{{noteName(note)}}</p>
     </div>
     <div style="float: left; padding-bottom: 10px">
       <span class="labelBtn btn-group">
       <button type="button"
               class="btn btn-default btn-xs"
               ng-click="runNote()"
               ng-class="{'disabled':isNoteRunning()}"
-              tooltip-placement="bottom" tooltip="Run all paragraphs">
+              tooltip-placement="bottom" tooltip="Run all paragraphs"
+              ng-disabled="revisionView">
         <i class="icon-control-play"></i>
       </button>
       <button type="button"
               class="btn btn-default btn-xs"
               ng-click="toggleAllEditor()"
               ng-hide="viewOnly"
-              tooltip-placement="bottom" tooltip="Show/hide the code">
+              tooltip-placement="bottom" tooltip="Show/hide the code"
+              ng-disabled="revisionView">
         <i ng-class="editorToggled ?  'fa icon-size-fullscreen' :'fa icon-size-actual'"></i></button>
       <button type="button"
               class="btn btn-default btn-xs"
               ng-click="toggleAllTable()"
               ng-hide="viewOnly"
-              tooltip-placement="bottom" tooltip="Show/hide the output">
+              tooltip-placement="bottom" tooltip="Show/hide the output"
+              ng-disabled="revisionView">
         <i ng-class="tableToggled ? 'fa icon-notebook' : 'fa icon-book-open'"></i>
       </button>
       <button type="button"
               class="btn btn-default btn-xs"
               ng-click="clearAllParagraphOutput(note.id)"
               ng-hide="viewOnly"
               ng-class="{'disabled':isNoteRunning()}"
-              tooltip-placement="bottom" tooltip="Clear output">
+              tooltip-placement="bottom" tooltip="Clear output"
+              ng-disabled="revisionView">
         <i class="fa fa-eraser"></i>
       </button>
 
@@ -56,14 +60,15 @@ <h3>
               ng-hide="viewOnly"
               tooltip-placement="bottom" tooltip="Clone this note" data-source-note-name="{{note.name}}"
               data-toggle="modal" data-target="#noteNameModal" data-clone="true"
-              >
+              ng-disabled="revisionView">
         <i class="fa fa-copy"></i>
       </button>
       <button type="button"
               class="btn btn-default btn-xs"
               ng-hide="viewOnly"
               ng-click="exportNote()"
-              tooltip-placement="bottom" tooltip="Export this note">
+              tooltip-placement="bottom" tooltip="Export this note"
+              ng-disabled="revisionView">
         <i class="fa fa-download"></i>
       </button>
 
@@ -72,15 +77,17 @@ <h3>
               ng-if="ticket.principal && ticket.principal !== 'anonymous'"
               ng-hide="viewOnly || note.config.personalizedMode !== 'true'"
               ng-click="toggleNotePersonalizedMode()"
-              tooltip-placement="bottom" tooltip="Personal mode {{isOwner ? '' : '(owner can change)'}}">
+              tooltip-placement="bottom" tooltip="Personal mode {{isOwner ? '' : '(owner can change)'}}"
+              ng-disabled="revisionView">
         <i class="fa fa-user"></i>
       </button>
       <button type="button"
               class="btn btn-default btn-xs"
               ng-if="ticket.principal && ticket.principal !== 'anonymous'"
               ng-hide="viewOnly || note.config.personalizedMode === 'true'"
               ng-click="toggleNotePersonalizedMode()"
-              tooltip-placement="bottom" tooltip="Collaboration mode {{isOwner ? '' : '(owner can change)'}}">
+              tooltip-placement="bottom" tooltip="Collaboration mode {{isOwner ? '' : '(owner can change)'}}"
+              ng-disabled="revisionView">
         <i class="fa fa-users"></i>
       </button>
     </span>
@@ -92,15 +99,16 @@ <h3>
                 id="versionControlDropdown"
                 ng-hide="viewOnly"
                 data-toggle="dropdown"
-                tooltip-placement="bottom" tooltip="Version control">
+                tooltip-placement="bottom" tooltip="Version control"
+                ng-disabled="revisionView">
           <i class="fa fa-file-code-o"></i>
         </button>
         <button type="button"
                 class="btn btn-default btn-xs"
                 id="setRevision"
                 ng-hide="viewOnly"
                 ng-click="setNoteRevision()"
-                ng-disabled="revisionDisabled"
+                ng-disabled="!revisionView"
                 tooltip-placement="bottom" tooltip="Set revision">
           <i class="fa fa-arrow-circle-o-right"></i>
         </button>
@@ -159,7 +167,8 @@ <h3>
                 class="btn btn-default btn-xs"
                 ng-click="removeNote(note.id)"
                 ng-hide="viewOnly"
-                tooltip-placement="bottom" tooltip="Remove this note permanently">
+                tooltip-placement="bottom" tooltip="Remove this note permanently"
+                ng-disabled="revisionView">
           <i class="icon-trash"></i>
         </button>
         <!-- if the note is not in the trash, move to trash -->
@@ -168,7 +177,8 @@ <h3>
                 class="btn btn-default btn-xs"
                 ng-click="moveNoteToTrash(note.id)"
                 ng-hide="viewOnly"
-                tooltip-placement="bottom" tooltip="Move this note to trash">
+                tooltip-placement="bottom" tooltip="Move this note to trash"
+                ng-disabled="revisionView">
           <i class="icon-trash"></i>
         </button>
       </span>
@@ -179,7 +189,8 @@ <h3>
              type="button"
              data-toggle="dropdown"
              ng-class="{ 'btn-info' : note.config.cron, 'btn-danger' : note.info.cron, 'btn-default' : !note.config.cron}"
-             tooltip-placement="bottom" tooltip="Run scheduler">
+             tooltip-placement="bottom" tooltip="Run scheduler"
+             ng-disabled="revisionView">
           <span class="fa fa-clock-o"></span> {{getCronOptionNameFromValue(note.config.cron)}}
         </div>
         <ul class="dropdown-menu" role="menu" style="width:300px">
@@ -224,27 +235,30 @@ <h3>
     </span>
     </div>
 
+
     <div class="pull-right" style="margin-top:15px; margin-right:15px; margin-left: 15px; margin-bottom: 13px; font-size:15px;">
-      <span class="setting-btn"
-            type="button"
-            data-toggle="modal"
-            data-target="#shortcutModal"
-            tooltip-placement="bottom" tooltip="List of shortcut">
-        <i class="fa fa-keyboard-o"></i>
-      </span>
-      <span class="setting-btn"
-            type="button"
-            ng-click="toggleSetting()"
-            tooltip-placement="bottom" tooltip="Interpreter binding">
-        <i class="fa fa-cog" ng-style="{color: showSetting ? '#3071A9' : 'black' }"></i>
+      <span ng-if="!revisionView">
+        <span class="setting-btn"
+              type="button"
+              data-toggle="modal"
+              data-target="#shortcutModal"
+              tooltip-placement="bottom" tooltip="List of shortcut">
+          <i class="fa fa-keyboard-o"></i>
+        </span>
+        <span class="setting-btn"
+              type="button"
+              ng-click="toggleSetting()"
+              tooltip-placement="bottom" tooltip="Interpreter binding">
+          <i class="fa fa-cog" ng-style="{color: showSetting ? '#3071A9' : 'black' }"></i>
+        </span>
+        <span class="setting-btn"
+              type="button"
+              ng-click="togglePermissions()"
+              tooltip-placement="bottom" tooltip="Note permissions">
+          <i class="fa fa-lock" ng-style="{color: showPermissions ? '#3071A9' : 'black' }"></i>
+        </span>
       </span>
-      <span class="setting-btn"
-            type="button"
-            ng-click="togglePermissions()"
-            tooltip-placement="bottom" tooltip="Note permissions">
-        <i class="fa fa-lock" ng-style="{color: showPermissions ? '#3071A9' : 'black' }"></i>
-      </span>
-
+
       <span class="btn-group">
         <button type="button" class="btn btn-default btn-xs dropdown-toggle"
                 data-toggle="dropdown">

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

@@ -69,7 +69,7 @@
 
     $scope.noteRevisions = [];
     $scope.currentRevision = 'Head';
-    $scope.revisionDisabled = !isRevisionPath($location.path());
+    $scope.revisionView = isRevisionPath($location.path());
 
     $scope.$on('setConnectedStatus', function(event, param) {
       if (connectedOnce && param) {
@@ -165,7 +165,7 @@
 
     $scope.keyboardShortcut = function(keyEvent) {
       // handle keyevent
-      if (!$scope.viewOnly) {
+      if (!$scope.viewOnly && !$scope.revisionView) {
         $scope.$broadcast('keyEvent', keyEvent);
       }
     };
@@ -260,6 +260,7 @@
       console.log('received note revision %o', data);
       if (data.note) {
         $scope.note = data.note;
+        initializeLookAndFeel();
       } else {
         $location.path('/');
       }
@@ -385,7 +386,11 @@
 
     $scope.setLookAndFeel = function(looknfeel) {
       $scope.note.config.looknfeel = looknfeel;
-      $scope.setConfig();
+      if ($scope.revisionView === true) {
+        $rootScope.$broadcast('setLookAndFeel', $scope.note.config.looknfeel);
+      } else {
+        $scope.setConfig();
+      }
     };
 
     /** Set cron expression for this note **/

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

@@ -113,7 +113,7 @@ <h4>Note Permissions (Only note owners can change)</h4>
        ng-init="init(currentParagraph, note)"
        ng-class="columnWidthClass(currentParagraph.config.colWidth)"
        class="paragraph-col">
-    <div class="new-paragraph" ng-click="insertNew('above')" ng-hide="viewOnly || asIframe">
+    <div class="new-paragraph" ng-click="insertNew('above')" ng-hide="viewOnly || asIframe || revisionView">
       <h4 class="plus-sign">&#43;</h4>
     </div>
     <div id="{{currentParagraph.id}}_paragraphColumn"
@@ -123,7 +123,7 @@ <h4 class="plus-sign">&#43;</h4>
          ng-hide="currentParagraph.config.tableHide && viewOnly"
          ng-dblclick="paragraphOnDoubleClick(currentParagraph.id);">
     </div>
-    <div class="new-paragraph" ng-click="insertNew('below');" ng-hide="!$last || viewOnly || asIframe ">
+    <div class="new-paragraph" ng-click="insertNew('below');" ng-hide="!$last || viewOnly || asIframe || revisionView">
       <h4 class="plus-sign">&#43;</h4>
     </div>
   </div>