Repository: incubator-zeppelin
Updated Branches:
  refs/heads/master 28d30b4d4 -> 36f3549be


ZEPPELIN-418 Keep paragraph height the same with/without executionTime label

Addresses https://issues.apache.org/jira/browse/ZEPPELIN-418.

* [x] executionTime label ("took xx seconds") keeps it's space while paragraph 
is running
* [x] show executionTime label only on hover mouse in 'simple' look n feel

#### 'default' look n feel

Before
![image](https://cloud.githubusercontent.com/assets/1540981/11144800/d92565ba-8a42-11e5-9948-ec1dce8afb2a.png)

After
![image](https://cloud.githubusercontent.com/assets/1540981/11144767/988a2342-8a42-11e5-889f-988a3d3aefcb.png)

#### 'simple' look n feel

Before

![image](https://cloud.githubusercontent.com/assets/1540981/11144821/06c38510-8a43-11e5-9839-843861c97edd.png)

After

![image](https://cloud.githubusercontent.com/assets/1540981/11144834/27c86d84-8a43-11e5-9214-936cff901abe.png)

Author: Lee moon soo <[email protected]>

Closes #426 from Leemoonsoo/fixed_height and squashes the following commits:

c040c5c [Lee moon soo] botton-margin
974e613 [Lee moon soo] Keep paragraph height the same with/without scrollbar 
(and executionTime)


Project: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/repo
Commit: 
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/commit/36f3549b
Tree: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/tree/36f3549b
Diff: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/diff/36f3549b

Branch: refs/heads/master
Commit: 36f3549bee4be408a832b0857c32abd75920985e
Parents: 28d30b4
Author: Lee moon soo <[email protected]>
Authored: Fri Nov 13 20:11:58 2015 +0900
Committer: Lee moon soo <[email protected]>
Committed: Wed Nov 18 13:13:35 2015 +0900

----------------------------------------------------------------------
 .../notebook/paragraph/paragraph.controller.js   |  2 +-
 .../src/app/notebook/paragraph/paragraph.css     | 17 ++++++++++++++---
 .../src/app/notebook/paragraph/paragraph.html    |  9 +++++++--
 .../src/assets/styles/looknfeel/simple.css       | 19 +++++++++++++++++++
 4 files changed, 41 insertions(+), 6 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/36f3549b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js 
b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
index d90f710..57c432d 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
@@ -697,7 +697,7 @@ angular.module('zeppelinWebApp')
       }
       return '';
     }
-    var desc = 'Took ' + (timeMs/1000) + ' seconds.';
+    var desc = 'Took ' + (timeMs/1000) + ' seconds';
     if ($scope.isResultOutdated()){
       desc += ' (outdated)';
     }

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/36f3549b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.css 
b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
index 15be3d3..6d413c6 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.css
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
@@ -18,7 +18,8 @@
 
 .paragraph-space {
   margin-bottom: 5px !important;
-  padding: 10px !important;
+  padding: 10px 10px 10px 10px !important;
+  min-height : 30px;
 }
 
 .paragraph-margin {
@@ -42,6 +43,7 @@
   font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 
'source-code-pro', monospace;
   font-size: 12px !important;
   margin-bottom: 5px !important;
+  padding-top: 2px;
 }
 
 .paragraph table {
@@ -71,6 +73,10 @@
   border: 3px solid #DDDDDD;
 }
 
+.paragraph .paragraphFooter { 
+  height: 9px;
+}
+
 .paragraph .executionTime {
   color: #999;
   font-size: 10px;
@@ -181,8 +187,7 @@
 */
 
 .paragraph .title {
-  margin: 3px 0px 0px 0px;
-  min-height: 20px;
+  margin: 0px 0px 0px 0px;
   font-size: 12px;
 }
 
@@ -289,6 +294,12 @@
   Table Display CSS
 */
 
+.tableDisplay {
+}
+
+.tableDisplay div {
+}
+
 .tableDisplay img {
   display: block;
   max-width: 100%;

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/36f3549b/zeppelin-web/src/app/notebook/paragraph/paragraph.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.html 
b/zeppelin-web/src/app/notebook/paragraph/paragraph.html
index dcec107..e2aa9a3 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.html
@@ -394,10 +394,9 @@ limitations under the License.
            ng-if="paragraph.status == 'ERROR'"
            ng-bind="paragraph.errorMessage">
       </div>
-
-      <div ng-if="!asIframe" id="{{paragraph.id}}_executionTime" 
class="executionTime" ng-bind-html="getExecutionTime()"></div>
     </div>
   </div>
+
   <div id="{{paragraph.id}}_control" class="control" ng-show="!asIframe">
 
     <span>
@@ -483,4 +482,10 @@ limitations under the License.
       </ul>
     </span>
   </div>
+
+  <div ng-if="!asIframe" class="paragraphFooter">
+    <div ng-show="!paragraph.config.tableHide && !viewOnly" 
id="{{paragraph.id}}_executionTime" class="executionTime" 
ng-bind-html="getExecutionTime()">
+    </div>
+  </div>
+  
 </div>

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/36f3549b/zeppelin-web/src/assets/styles/looknfeel/simple.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/looknfeel/simple.css 
b/zeppelin-web/src/assets/styles/looknfeel/simple.css
index aaf7d18..43a78e8 100644
--- a/zeppelin-web/src/assets/styles/looknfeel/simple.css
+++ b/zeppelin-web/src/assets/styles/looknfeel/simple.css
@@ -53,6 +53,25 @@ body {
   visibility: visible;
 }
 
+.paragraph .paragraphFooter {
+  visibility: hidden;
+  height: 0px;
+  position: relative;
+  top : -13px;
+  z-index: 99;
+}
+
+.paragraph .executionTime {
+  font-size: 8px;
+  text-align: right;
+  margin-right: 5px;
+}
+
+.paragraph:hover .paragraphFooter {
+  visibility: visible;
+}
+
+
 .noteAction span,
 .noteAction button,
 .noteAction form {

Reply via email to