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/02/08 23:38:10 UTC
incubator-zeppelin git commit: Add filter to quickly search the
notebook from the list
Repository: incubator-zeppelin
Updated Branches:
refs/heads/master 9b461ad24 -> 51da6584c
Add filter to quickly search the notebook from the list
### What is this PR for?
Allows the user to instantly find the notebook from the list shown on the home page and in the Notebook main menu
### What type of PR is it?
Improvement
### How should this be tested?
Enter the search term in the filter input box
### Screenshots
<img width="255" alt="screen shot 2016-01-20 at 3 22 32 pm" src="https://cloud.githubusercontent.com/assets/2031306/12445389/04f9cb46-bf8a-11e5-8e99-d04b122f7ce2.png">
<br>
<img width="299" alt="screen shot 2016-01-20 at 3 22 26 pm" src="https://cloud.githubusercontent.com/assets/2031306/12445391/04ff3216-bf8a-11e5-8fc0-19bdfaa991e3.png">
<br>
<img width="314" alt="screen shot 2016-01-20 at 3 21 58 pm" src="https://cloud.githubusercontent.com/assets/2031306/12445392/05004d86-bf8a-11e5-839f-ae9a8b4881b7.png">
<br>
<img width="316" alt="screen shot 2016-01-20 at 3 22 11 pm" src="https://cloud.githubusercontent.com/assets/2031306/12445390/04faf6ba-bf8a-11e5-9ae9-fec1a201591a.png">
Author: Renjith Kamath <re...@gmail.com>
Closes #660 from r-kamath/NotenameFilter and squashes the following commits:
2298eb8 [Renjith Kamath] fix filter input width issue
ed41d41 [Renjith Kamath] review update: fix search box padding to 6px
904518c [Renjith Kamath] fix ng-include path
bade370 [Renjith Kamath] refactor filter code and use ng-include
325d71e [Renjith Kamath] add filter to the list of notebook names on homepage and under notebook menu
Project: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/commit/51da6584
Tree: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/tree/51da6584
Diff: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/diff/51da6584
Branch: refs/heads/master
Commit: 51da6584cf795cefe781b825b4058e5828f956c0
Parents: 9b461ad
Author: Renjith Kamath <re...@gmail.com>
Authored: Fri Feb 5 16:45:08 2016 +0530
Committer: Mina Lee <mi...@nflabs.com>
Committed: Mon Feb 8 14:37:43 2016 -0800
----------------------------------------------------------------------
zeppelin-web/src/app/home/home.css | 25 ++++++++++++++++++++
zeppelin-web/src/app/home/home.html | 7 +++---
.../filterNoteNames/filter-note-names.html | 14 +++++++++++
zeppelin-web/src/components/navbar/navbar.html | 5 ++--
4 files changed, 46 insertions(+), 5 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/51da6584/zeppelin-web/src/app/home/home.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/home/home.css b/zeppelin-web/src/app/home/home.css
index dada898..281ffb4 100644
--- a/zeppelin-web/src/app/home/home.css
+++ b/zeppelin-web/src/app/home/home.css
@@ -126,6 +126,31 @@ a.navbar-brand:hover {
outline: 0;
}
+#notebook-list > .filter-names {
+ margin: 5px;
+ padding: 0px 10px;
+}
+
+#notebook-list .note-name-query {
+ width: 100%;
+}
+
+#notebook-names {
+ list-style: none;
+}
+
+#notebook-names > .filter-names {
+ margin: 5px 0;
+}
+
+.note-name-query {
+ padding: 6px;
+ color: #000;
+ height: 28px;
+ width: 200px;
+ font: normal normal normal 14px/1 FontAwesome;
+}
+
@media (max-width: 767px) {
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
color: #D3D3D3;
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/51da6584/zeppelin-web/src/app/home/home.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/home/home.html b/zeppelin-web/src/app/home/home.html
index 62bc9e4..8818edc 100644
--- a/zeppelin-web/src/app/home/home.html
+++ b/zeppelin-web/src/app/home/home.html
@@ -26,7 +26,7 @@ limitations under the License.
<div class="row">
<div class="col-md-4">
- <h4>Notebook
+ <h4>Notebook
<i ng-class="isReloadingNotes ? 'fa fa-refresh fa-spin' : 'fa fa-refresh'"
ng-style="!isReloadingNotes && {'cursor': 'pointer'}" style="font-size: 13px;"
ng-click="reloadNotebookList();">
@@ -38,8 +38,9 @@ limitations under the License.
<i style="font-size: 15px;" class="fa fa-upload"></i> Import note</a></h5>
<h5><a href="" data-toggle="modal" data-target="#noteNameModal" style="text-decoration: none;">
<i style="font-size: 15px;" class="icon-notebook"></i> Create new note</a></h5>
- <ul style="list-style-type: none;">
- <li ng-repeat="note in home.notes.list | orderBy:home.arrayOrderingSrv.notebookListOrdering track by $index">
+ <ul id="notebook-names">
+ <li class="filter-names" ng-include="'components/filterNoteNames/filter-note-names.html'"></li>
+ <li ng-repeat="note in home.notes.list | filter:query | orderBy:home.arrayOrderingSrv.notebookListOrdering track by $index">
<i style="font-size: 10px;" class="icon-doc"></i>
<a style="text-decoration: none;" href="#/notebook/{{note.id}}">{{note.name || 'Note ' + note.id}}</a>
</li>
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/51da6584/zeppelin-web/src/components/filterNoteNames/filter-note-names.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/filterNoteNames/filter-note-names.html b/zeppelin-web/src/components/filterNoteNames/filter-note-names.html
new file mode 100644
index 0000000..a354cda
--- /dev/null
+++ b/zeppelin-web/src/components/filterNoteNames/filter-note-names.html
@@ -0,0 +1,14 @@
+<!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<input type="text" class="note-name-query form-control" ng-click="$event.stopPropagation()" placeholder=" Filter" ng-model="$parent.query.name" />
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/51da6584/zeppelin-web/src/components/navbar/navbar.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/components/navbar/navbar.html b/zeppelin-web/src/components/navbar/navbar.html
index ca1c5fe..a795870 100644
--- a/zeppelin-web/src/components/navbar/navbar.html
+++ b/zeppelin-web/src/components/navbar/navbar.html
@@ -20,7 +20,7 @@ limitations under the License.
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#/">
- <img style="margin-top: -7px;s" src="assets/images/zepLogoW.png" width="50" alt="I'm zeppelin"> Zeppelin
+ <img style="margin-top: -7px;" src="assets/images/zepLogoW.png" width="50" alt="I'm zeppelin"> Zeppelin
</a>
</div>
@@ -32,7 +32,8 @@ limitations under the License.
<li><a href="" data-toggle="modal" data-target="#noteNameModal"><i class="fa fa-plus"></i> Create new note</a></li>
<li class="divider"></li>
<div id="notebook-list" class="scrollbar-container">
- <li ng-repeat="note in navbar.notes.list | orderBy:navbar.arrayOrderingSrv.notebookListOrdering track by $index"
+ <li class="filter-names" ng-include="'components/filterNoteNames/filter-note-names.html'"></li>
+ <li ng-repeat="note in navbar.notes.list | filter:query | orderBy:navbar.arrayOrderingSrv.notebookListOrdering track by $index"
ng-class="{'active' : navbar.isActive(note.id)}">
<a href="#/notebook/{{note.id}}">{{note.name || 'Note ' + note.id}} </a>
</li>