From e43833fdbd75d0b08d1f7f0bf10298a1536b9578 Mon Sep 17 00:00:00 2001
From: Malay Majithia <malay.majithia@gmail.com>
Date: Mon, 14 Aug 2017 16:35:43 +0530
Subject: [PATCH 1/2] ZEPPELIN-2834 Show Interpreter list as expand collapse
 blocks

---
 .../src/app/interpreter/interpreter.css       | 24 +++++++++++++++++++
 .../src/app/interpreter/interpreter.html      | 13 ++++++----
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/zeppelin-web/src/app/interpreter/interpreter.css b/zeppelin-web/src/app/interpreter/interpreter.css
index bc4dc061b3e..931b2b1c0f4 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.css
+++ b/zeppelin-web/src/app/interpreter/interpreter.css
@@ -130,3 +130,27 @@
   margin-left: 2px;
   text-decoration: none !important;
 }
+
+.interpreter-box .interpreter-title .fa-caret-down {
+    display: none;
+}
+
+.interpreter-box > .expanded .interpreter-title .fa-caret-right {
+    display: none;
+}
+
+.interpreter-box > .expanded .interpreter-title .fa-caret-down {
+    display: inline;
+}
+
+.interpreter-box .interpreter:not(.interpreter-header) {
+    display: none;
+}
+
+.interpreter-box > .expanded .interpreter:not(.interpreter-header) {
+    display: block
+}
+
+a.toggle-interpreter {
+    text-decoration: none;
+}
\ No newline at end of file
diff --git a/zeppelin-web/src/app/interpreter/interpreter.html b/zeppelin-web/src/app/interpreter/interpreter.html
index f9d425261ef..96e484044cf 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.html
+++ b/zeppelin-web/src/app/interpreter/interpreter.html
@@ -86,13 +86,18 @@ <h4>Repositories</h4>
   <div ng-include src="'app/interpreter/interpreter-create/interpreter-create.html'"></div>
 </div>
 
-<div class="box width-full"
+<div class="box width-full interpreter-box"
      ng-repeat="setting in interpreterSettings | orderBy: 'name' | filter: {name:searchInterpreter} " interpreter-directive>
-  <div id="{{setting.name | lowercase}}">
-    <div class="row interpreter">
+  <div id="{{setting.name | lowercase}}" ng-class="{'expanded': setting.isExpanded}">
+    <div class="row interpreter interpreter-header">
 
       <div class="col-md-12">
-        <h3 class="interpreter-title">{{setting.name}}
+        <h3 class="interpreter-title">
+          <a class="toggle-interpreter" href="javascript: void(0);" ng-click="setting.isExpanded = !setting.isExpanded">
+            <i class="fa fa-caret-right"></i>
+            <i class="fa fa-caret-down"></i>
+            {{setting.name}}
+          </a>
           <small>
             <span style="display:inline-block" ng-repeat="interpreter in setting.interpreterGroup"
                   title="{{interpreter.class}}">

From 75bebd8cc15eec97f61f2ae14760ed5ec7139387 Mon Sep 17 00:00:00 2001
From: Malay Majithia <malay.majithia@gmail.com>
Date: Fri, 18 Aug 2017 15:33:44 +0530
Subject: [PATCH 2/2] Added Expand all / Collapse all as per review after
 having internal UX review

---
 .../src/app/interpreter/interpreter.controller.js   |  6 ++++++
 zeppelin-web/src/app/interpreter/interpreter.css    | 13 +++++++++++--
 zeppelin-web/src/app/interpreter/interpreter.html   |  5 ++++-
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/zeppelin-web/src/app/interpreter/interpreter.controller.js b/zeppelin-web/src/app/interpreter/interpreter.controller.js
index df2b2162edf..3d4ef50de8d 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.controller.js
+++ b/zeppelin-web/src/app/interpreter/interpreter.controller.js
@@ -743,5 +743,11 @@ function InterpreterCtrl ($rootScope, $scope, $http, baseUrlSrv, ngToast, $timeo
     return `https://zeppelin.apache.org/docs/${currentVersion}/usage/interpreter/interpreter_binding_mode.html`
   }
 
+  $scope.toggleAllInterpreters = function(state) {
+    for (let setting = 0; setting < $scope.interpreterSettings.length; setting++) {
+      $scope.interpreterSettings[setting].isExpanded = (state === 'expand') ? true : false
+    }
+  }
+
   init()
 }
diff --git a/zeppelin-web/src/app/interpreter/interpreter.css b/zeppelin-web/src/app/interpreter/interpreter.css
index 931b2b1c0f4..834d2f2516b 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.css
+++ b/zeppelin-web/src/app/interpreter/interpreter.css
@@ -143,7 +143,8 @@
     display: inline;
 }
 
-.interpreter-box .interpreter:not(.interpreter-header) {
+.interpreter-box .interpreter:not(.interpreter-header),
+.interpreter-box .edit-interpreter-settings {
     display: none;
 }
 
@@ -151,6 +152,14 @@
     display: block
 }
 
+.interpreter-box > .expanded .edit-interpreter-settings {
+    display: inline-block;
+}
+
 a.toggle-interpreter {
     text-decoration: none;
-}
\ No newline at end of file
+}
+
+.expand-collapse-all > a {
+  text-decoration: none;
+}
diff --git a/zeppelin-web/src/app/interpreter/interpreter.html b/zeppelin-web/src/app/interpreter/interpreter.html
index 96e484044cf..79bfe9e0237 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.html
+++ b/zeppelin-web/src/app/interpreter/interpreter.html
@@ -52,6 +52,9 @@ <h3 class="new_h3">
           </span>
         </div>
       </div>
+      <div class="col-md-4 pull-right expand-collapse-all" style="text-align: right;">
+        <a href="javascript: void(0);" ng-click="toggleAllInterpreters('expand')">Expand all</a> / <a href="javascript: void(0);" ng-click="toggleAllInterpreters('collapse')">Collapse all</a>
+      </div>
     </div>
   </div>
 
@@ -133,7 +136,7 @@ <h3 class="interpreter-title">
                   ng-click="showSparkUI(setting.id)"
                   ng-show="setting.group == 'spark'">
             <span class="fa fa-external-link"></span> spark ui</button>
-          <button class="btn btn-default btn-xs"
+          <button class="btn btn-default btn-xs edit-interpreter-settings"
                   ng-click="valueform.$show();
                   copyOriginInterpreterSettingProperties(setting.id)">
             <span class="fa fa-pencil"></span> edit</button>