You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by mi...@apache.org on 2016/06/25 05:44:21 UTC

zeppelin git commit: [ZEPPELIN-961] Longer names to the notebook make the name-text and buttons float outside the border.

Repository: zeppelin
Updated Branches:
  refs/heads/master 510cecd38 -> 056eee834


[ZEPPELIN-961] Longer names to the notebook make the name-text and buttons float outside the border.

### What is this PR for?
To correct the styling of notebook header which has notebook name, in case when the name is longer.
Feature : We should not limit the name size, but, while showing we can limit the name text to be shown.

### What type of PR is it?
[Bug Fix]

### Todos

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

### How should this be tested?
- Open any notebook.
- Give the long name.

### Screenshots
Before bug fix :
![screen shot 2016-06-07 at 11 16 14 am](https://cloud.githubusercontent.com/assets/12127192/15847327/a521e768-2ca2-11e6-935c-1114dfabfd76.png)
After bug fix :
![screen shot 2016-06-07 at 11 17 15 am](https://cloud.githubusercontent.com/assets/12127192/15847326/a51fc7da-2ca2-11e6-867d-9cd421abc8dc.png)
![screen shot 2016-06-07 at 11 17 31 am](https://cloud.githubusercontent.com/assets/12127192/15847328/a621e50a-2ca2-11e6-8b34-2738c998bb4d.png)

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

Author: Sagar Kulkarni <sa...@gmail.com>

Closes #971 from sagarkulkarni3592/ZEPPELIN-961 and squashes the following commits:

f7202c0 [Sagar Kulkarni] Merge branch 'master' of https://github.com/apache/incubator-zeppelin into ZEPPELIN-961
ff88f41 [Sagar Kulkarni] Made buttons position dynamic to size of name.
a42045e [Sagar Kulkarni] Fixed the input box and button overlap.
9b29d8a [Sagar Kulkarni] Merge branch 'master' of https://github.com/apache/incubator-zeppelin into ZEPPELIN-961
37012ad [Sagar Kulkarni] Made adjustment to the name when window size is changed.
29607e5 [Sagar Kulkarni] ZEPPELIN-961 - Fixed the floating problem as well as styling of buttons.


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

Branch: refs/heads/master
Commit: 056eee8342699f93e01944c66ba0b053be4c5382
Parents: 510cecd
Author: Sagar Kulkarni <sa...@gmail.com>
Authored: Fri Jun 24 12:37:47 2016 +0530
Committer: Mina Lee <mi...@apache.org>
Committed: Fri Jun 24 22:44:11 2016 -0700

----------------------------------------------------------------------
 .../org/apache/zeppelin/AbstractZeppelinIT.java |  2 +-
 .../apache/zeppelin/integration/ZeppelinIT.java |  2 +-
 .../src/app/notebook/notebook-actionBar.html    | 32 +++++++++++---------
 zeppelin-web/src/app/notebook/notebook.css      | 11 +++++--
 4 files changed, 28 insertions(+), 19 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/056eee83/zeppelin-server/src/test/java/org/apache/zeppelin/AbstractZeppelinIT.java
----------------------------------------------------------------------
diff --git a/zeppelin-server/src/test/java/org/apache/zeppelin/AbstractZeppelinIT.java b/zeppelin-server/src/test/java/org/apache/zeppelin/AbstractZeppelinIT.java
index e7dba46..e78c992 100644
--- a/zeppelin-server/src/test/java/org/apache/zeppelin/AbstractZeppelinIT.java
+++ b/zeppelin-server/src/test/java/org/apache/zeppelin/AbstractZeppelinIT.java
@@ -145,7 +145,7 @@ abstract public class AbstractZeppelinIT {
   }
 
   protected void deleteTestNotebook(final WebDriver driver) {
-    driver.findElement(By.xpath("//*[@id='main']/div//h3/span/button[@tooltip='Remove the notebook']"))
+    driver.findElement(By.xpath(".//*[@id='main']//button[@ng-click='removeNote(note.id)']"))
         .sendKeys(Keys.ENTER);
     sleep(1000, true);
     driver.findElement(By.xpath("//div[@class='modal-dialog'][contains(.,'delete this notebook')]" +

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/056eee83/zeppelin-server/src/test/java/org/apache/zeppelin/integration/ZeppelinIT.java
----------------------------------------------------------------------
diff --git a/zeppelin-server/src/test/java/org/apache/zeppelin/integration/ZeppelinIT.java b/zeppelin-server/src/test/java/org/apache/zeppelin/integration/ZeppelinIT.java
index c3d3566..50b67b3 100644
--- a/zeppelin-server/src/test/java/org/apache/zeppelin/integration/ZeppelinIT.java
+++ b/zeppelin-server/src/test/java/org/apache/zeppelin/integration/ZeppelinIT.java
@@ -176,7 +176,7 @@ public class ZeppelinIT extends AbstractZeppelinIT {
       waitForText("BindingTest_1_",
           By.xpath(getParagraphXPath(1) + "//div[@id=\"angularTestButton\"]"));
 
-      driver.findElement(By.xpath("//*[@id='main']/div//h3/span/button[@tooltip='Remove the notebook']"))
+      driver.findElement(By.xpath(".//*[@id='main']//button[@ng-click='removeNote(note.id)']"))
           .sendKeys(Keys.ENTER);
       sleep(1000, true);
       driver.findElement(By.xpath("//div[@class='modal-dialog'][contains(.,'delete this notebook')]" +

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/056eee83/zeppelin-web/src/app/notebook/notebook-actionBar.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/notebook-actionBar.html b/zeppelin-web/src/app/notebook/notebook-actionBar.html
index 16cb71a..4f7d984 100644
--- a/zeppelin-web/src/app/notebook/notebook-actionBar.html
+++ b/zeppelin-web/src/app/notebook/notebook-actionBar.html
@@ -13,10 +13,13 @@ limitations under the License.
 -->
 <div class="noteAction" ng-show="note.id && !paragraphUrl">
   <h3>
-    <input type="text" pu-elastic-input class="form-control2" placeholder="{{noteName(note)}}" style="min-width: 200px; max-width: 600px;"
+    <div style="float: left; width: auto; max-width: 40%">
+      <input type="text" pu-elastic-input class="form-control2" placeholder="{{noteName(note)}}" style="min-width: 0px; max-width: 95%;"
            ng-show="showEditor" ng-model="note.name" ng-blur="sendNewName();showEditor = false;" ng-enter="sendNewName();showEditor = false;" ng-escape="note.name = oldName; showEditor = false" focus-if="showEditor" />
-    <p class="form-control-static2" ng-click="showEditor = true; oldName = note.name" ng-show="!showEditor">{{noteName(note)}}</p>
-    <span class="labelBtn btn-group">
+      <p class="form-control-static2" ng-click="showEditor = true; oldName = note.name" ng-show="!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()"
@@ -92,17 +95,17 @@ limitations under the License.
     </span>
 
 <!-- put the delete action by itself for your protection -->
-    <span class="labelBtn" style="vertical-align:middle; display:inline-block;">
-      <button type="button"
-              class="btn btn-default btn-xs"
-              ng-click="removeNote(note.id)"
-              ng-hide="viewOnly"
-              tooltip-placement="bottom" tooltip="Remove the notebook">
-        <i class="icon-trash"></i>
-      </button>
-    </span>
+      <span class="labelBtn" style="vertical-align:middle; display:inline-block;">
+        <button type="button"
+                class="btn btn-default btn-xs"
+                ng-click="removeNote(note.id)"
+                ng-hide="viewOnly"
+                tooltip-placement="bottom" tooltip="Remove the notebook">
+          <i class="icon-trash"></i>
+        </button>
+      </span>
 
-    <span ng-hide="viewOnly">
+      <span ng-hide="viewOnly">
       <div class="labelBtn btn-group">
         <div class="btn btn-default btn-xs dropdown-toggle"
              type="button"
@@ -151,8 +154,9 @@ limitations under the License.
         </ul>
       </div>
     </span>
+    </div>
 
-    <div class="pull-right" style="margin-top:15px; margin-right:15px; font-size:15px;">
+    <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"

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/056eee83/zeppelin-web/src/app/notebook/notebook.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/notebook.css b/zeppelin-web/src/app/notebook/notebook.css
index c86eb9d..01af8c6 100644
--- a/zeppelin-web/src/app/notebook/notebook.css
+++ b/zeppelin-web/src/app/notebook/notebook.css
@@ -23,7 +23,7 @@
 }
 
 .labelBtn {
-  padding: .2em .6em .3em;
+  padding: .8em .6em .3em;
   font-size: 75%;
   font-weight: bold;
   line-height: 1;
@@ -105,7 +105,6 @@
 }
 
 .form-control2 {
-  width: 100%;
   height: 40px;
   font-size: 29px;
   line-height: 1.2;
@@ -116,16 +115,22 @@
   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
   padding: 7px 0;
-  margin: 2px 0 0 14px;
+  margin: 2px 20px 0 14px;
 }
 
 .form-control-static2 {
   padding-top: 7px;
+  margin-right: 15px;
   font-size: 29px;
   margin-left: 15px;
   padding-bottom: 7px;
   margin-bottom: 0;
   display: inline-block;
+  width: auto;
+  max-width: 97%;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
 }
 
 .noOverflow {