You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by nc...@apache.org on 2017/01/05 00:05:04 UTC
[23/50] [abbrv] ambari git commit: AMBARI-19339. Hive View 2.0.0: Add
ability to expand the query editor and the result pane to take 100% height
and width (pallavkul)
AMBARI-19339. Hive View 2.0.0: Add ability to expand the query editor and the result pane to take 100% height and width (pallavkul)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/22586153
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/22586153
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/22586153
Branch: refs/heads/branch-dev-patch-upgrade
Commit: 22586153eca925d493e9ca97d7ad878977d7a20c
Parents: 4fc44e2
Author: pallavkul <pa...@gmail.com>
Authored: Tue Jan 3 18:51:22 2017 +0530
Committer: pallavkul <pa...@gmail.com>
Committed: Tue Jan 3 18:51:22 2017 +0530
----------------------------------------------------------------------
.../ui/app/components/query-result-table.js | 3 ++
.../src/main/resources/ui/app/routes/query.js | 33 ++++++++++++++---
.../src/main/resources/ui/app/styles/app.scss | 28 +++++++++++++--
.../templates/components/query-result-table.hbs | 17 +++++----
.../main/resources/ui/app/templates/query.hbs | 37 +++++++++++++-------
5 files changed, 90 insertions(+), 28 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/22586153/contrib/views/hive20/src/main/resources/ui/app/components/query-result-table.js
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/components/query-result-table.js b/contrib/views/hive20/src/main/resources/ui/app/components/query-result-table.js
index 1cb1d3d..17df66d 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/components/query-result-table.js
+++ b/contrib/views/hive20/src/main/resources/ui/app/components/query-result-table.js
@@ -77,6 +77,9 @@ export default Ember.Component.extend({
},
goPrevPage(){
this.sendAction('goPrevPage');
+ },
+ expandQueryResultPanel(){
+ this.sendAction('expandQueryResultPanel');
}
}
http://git-wip-us.apache.org/repos/asf/ambari/blob/22586153/contrib/views/hive20/src/main/resources/ui/app/routes/query.js
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/routes/query.js b/contrib/views/hive20/src/main/resources/ui/app/routes/query.js
index 699b64c..9e22432 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/routes/query.js
+++ b/contrib/views/hive20/src/main/resources/ui/app/routes/query.js
@@ -64,7 +64,7 @@ export default Ember.Route.extend({
controller.set('isQueryRunning', false);
controller.set('defaultQueryResult', {'schema' :[], 'rows' :[]});
controller.set('queryResult', controller.get('defaultQueryResult'));
- controller.set('showPreviousButton', false);
+ controller.set('hidePreviousButton', true);
//For Pagination
localStorage.setItem("jobData", JSON.stringify([]));
@@ -212,7 +212,7 @@ export default Ember.Route.extend({
console.log('getJob route', data );
self.get('controller').set('queryResult', data);
self.get('controller').set('isQueryRunning', false);
- self.get('controller').set('showPreviousButton', true);
+ self.get('controller').set('hidePreviousButton', false);
let localArr = JSON.parse(localStorage.getItem("jobData"));
localArr.push(data);
@@ -248,7 +248,7 @@ export default Ember.Route.extend({
this.get('controller').set('prevPage', prevPage + 1 );
this.get('controller').set('nextPage', nextPage + 1);
- this.get('controller').set('showPreviousButton', true);
+ this.get('controller').set('hidePreviousButton', false);
this.get('controller').set('queryResult', JSON.parse(localStorage.getItem("jobData"))[this.get('controller').get('currentPage')] );
} else {
@@ -257,6 +257,8 @@ export default Ember.Route.extend({
this.send('goNextPage');
}
}
+
+
},
goPrevPage(){
@@ -273,8 +275,31 @@ export default Ember.Route.extend({
this.get('controller').set('queryResult', JSON.parse(localStorage.getItem("jobData"))[this.get('controller').get('currentPage')] );
} else {
//console.log('previous limit over');
- this.get('controller').set('showPreviousButton', false);
+ this.get('controller').set('hidePreviousButton', true);
+ }
+ },
+
+ expandQueryEdidorPanel(){
+ Ember.$('.query-editor-panel').toggleClass('query-editor-full-width');
+ Ember.$('.database-panel').toggleClass("hide");
+ },
+
+ expandQueryResultPanel(){
+
+ Ember.$('.query-editor-panel').toggleClass('query-editor-full-width');
+ Ember.$('.query-editor-container').toggleClass("hide");
+ Ember.$('.database-panel').toggleClass("hide");
+ this.send('adjustPanelSize');
+ },
+
+ adjustPanelSize(){
+ let isFullHeight = ($(window).height() ==(parseInt(Ember.$('.ember-light-table').css('height'), 10)) ) || false;
+ if(!isFullHeight){
+ Ember.$('.ember-light-table').css('height', '100vh');
+ }else {
+ Ember.$('.ember-light-table').css('height', '70vh');
}
}
+
}
});
http://git-wip-us.apache.org/repos/asf/ambari/blob/22586153/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss b/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss
index 812ae92..4d8fca4 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss
+++ b/contrib/views/hive20/src/main/resources/ui/app/styles/app.scss
@@ -279,16 +279,35 @@ pre {
}
}
+.query-editor-panel{
+ transition:width 0.50s;
+}
+
.query-editor {
border: 1px solid darken($database-search-background, 25%);
margin-right: 0;
}
+.query-editor-full-width {
+ width: 100%;
+ padding-right: 0;
+ transition:width 0.50s;
+}
+
.query-editor-controls {
padding-top: 15px;
padding-bottom: 15px;
}
+.query-editor-results {
+ padding-right: 15px;
+}
+
+.query-result-table {
+ border-top: 1px solid darken($database-search-background, 25%);
+ padding-top:10px;
+}
+
.database-panel{
.panel-heading {
@@ -403,9 +422,14 @@ pre {
}
.ember-light-table {
- width: 95%;
+ width: 100%;
margin: 0 auto;
- border-collapse: collapse
+ border-collapse: collapse;
+ height: 65vh; //This can be controlled from the hbs also.
+ }
+
+ .full-vw-height{
+ height: 100vh;
}
.ember-light-table .multi-select {
http://git-wip-us.apache.org/repos/asf/ambari/blob/22586153/contrib/views/hive20/src/main/resources/ui/app/templates/components/query-result-table.hbs
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/components/query-result-table.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/components/query-result-table.hbs
index 5001c99..376afe7 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/templates/components/query-result-table.hbs
+++ b/contrib/views/hive20/src/main/resources/ui/app/templates/components/query-result-table.hbs
@@ -17,17 +17,16 @@
}}
{{#if columns.length}}
- <div class="clearfix" style="text-align: right">
- {{#if showPreviousButton}}
- <button class="btn btn-success" {{action "goPrevPage" }}>{{fa-icon "arrow-left"}} </button>
- {{/if}}
- <button class="btn btn-success" {{action "goNextPage" }}>{{fa-icon "arrow-right"}} </button>
+ <div class="clearfix" style="text-align: right; padding-right:5px">
+ <button class="btn btn-default" title="Previous Page" {{action "goPrevPage" }} disabled={{ hidePreviousButton}} >{{fa-icon "arrow-left"}} </button>
+ <button class="btn btn-default" title="Next Page" {{action "goNextPage" }}>{{fa-icon "arrow-right"}} </button>
+ <button class="btn btn-default" title="Expand/Collspse" {{action "expandQueryResultPanel" }}>{{fa-icon "expand"}}</button>
</div>
{{/if}}
<div class="clearfix">
-{{#light-table table height='65vh' as |t|}}
- {{#if columns.length}}
+ {{#light-table table height='70vh' as |t|}}
+ {{#if columns.length}}
{{t.head
onColumnClick=(action 'onColumnClick')
iconAscending='fa fa-sort-asc'
@@ -46,8 +45,8 @@
{{/body.loader}}
{{/if}}
{{/t.body}}
- {{/if}}
-{{/light-table}}
+ {{/if}}
+ {{/light-table}}
</div>
{{yield}}
http://git-wip-us.apache.org/repos/asf/ambari/blob/22586153/contrib/views/hive20/src/main/resources/ui/app/templates/query.hbs
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/query.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/query.hbs
index d24c7d0..69fc657 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/templates/query.hbs
+++ b/contrib/views/hive20/src/main/resources/ui/app/templates/query.hbs
@@ -18,17 +18,36 @@
{{multiple-database-search-bar databases=model selected=selected xyz="xyz" }}
-<div class="clearfix">
- <div class="col-md-9">
- <div class="row query-editor">
+<div class="clearfix col-md-9 query-editor-panel">
+ <div class="query-editor-container">
+ <div class="row query-editor" style="position:relative">
+ <span style="position: absolute;right: 5px;top: 5px;z-index: 9999;cursor: pointer;" {{action "expandQueryEdidorPanel" }} >
+ {{fa-icon "expand"}}
+ </span>
{{query-editor query=currentQuery }}
</div>
<div class="row query-editor-controls">
<button class="btn btn-success" {{action "executeQuery" }}>{{fa-icon "check"}} Execute</button>
+
+ {{#if isQueryRunning}}
+ <img src="http://www.bba-reman.com/images/fbloader.gif" height="22" width="32" />
+ {{/if}}
+
+
</div>
</div>
- <div class="col-md-3">
+
+ <div class="clearfix row query-editor-results" style="position: relative">
+ {{query-result-table queryResult=queryResult hidePreviousButton=hidePreviousButton goNextPage='goNextPage' goPrevPage='goPrevPage' expandQueryResultPanel='expandQueryResultPanel' }}
+ </div>
+
+
+</div>
+
+<div class="col-md-3 database-panel">
+
+ <div class="database-container">
<div class="row">
<div class="panel-group database-panel" id="accordion" role="tablist" aria-multiselectable="true">
@@ -69,18 +88,10 @@
</div>
</div>
</div>
-</div>
-
-<div class="clearfix query-editor-results">
- {{#if isQueryRunning}}
- <div style="left:37%; position: relative;">
- <img src="http://www.bba-reman.com/images/fbloader.gif" height="22" width="32" />
- </div>
- {{/if}}
- {{query-result-table queryResult=queryResult showPreviousButton=showPreviousButton goNextPage='goNextPage' goPrevPage='goPrevPage' }}
</div>
+
{{#if databaseNotEmpty}}
{{database-not-empty name=databaseName close="notEmptyDialogClosed"}}
{{/if}}