Repository: ambari Updated Branches: refs/heads/branch-2.5 96b9a3a0a -> cde4ce8e8
AMBARI-19424. Hive View 2.0: Introduction of worksheets for query editor (pallavkul) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/cde4ce8e Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/cde4ce8e Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/cde4ce8e Branch: refs/heads/branch-2.5 Commit: cde4ce8e833236f18cb5d4a8d53ca3bd1368b317 Parents: 96b9a3a Author: pallavkul <[email protected]> Authored: Tue Jan 10 20:28:05 2017 +0530 Committer: pallavkul <[email protected]> Committed: Tue Jan 10 20:30:05 2017 +0530 ---------------------------------------------------------------------- .../components/multiple-database-search-bar.js | 30 +- .../resources/ui/app/components/query-editor.js | 3 + .../resources/ui/app/configs/top-level-tabs.js | 2 +- .../main/resources/ui/app/models/worksheet.js | 36 +++ .../hive20/src/main/resources/ui/app/router.js | 4 +- .../src/main/resources/ui/app/routes/queries.js | 79 +++++ .../resources/ui/app/routes/queries/index.js | 29 ++ .../resources/ui/app/routes/queries/query.js | 292 +++++++++++++++++++ .../src/main/resources/ui/app/routes/query.js | 2 +- .../src/main/resources/ui/app/styles/app.scss | 17 ++ .../components/multiple-database-search-bar.hbs | 3 +- .../templates/components/query-result-table.hbs | 3 +- .../main/resources/ui/app/templates/queries.hbs | 32 ++ .../ui/app/templates/queries/query.hbs | 90 ++++++ .../main/resources/ui/app/templates/query.hbs | 19 +- 15 files changed, 605 insertions(+), 36 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/components/multiple-database-search-bar.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/components/multiple-database-search-bar.js b/contrib/views/hive20/src/main/resources/ui/app/components/multiple-database-search-bar.js index 384368f..817a826 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/components/multiple-database-search-bar.js +++ b/contrib/views/hive20/src/main/resources/ui/app/components/multiple-database-search-bar.js @@ -28,36 +28,41 @@ export default Ember.Component.extend({ heading: 'database', subHeading: 'Select or search database/schema', - selectedDatabase: Ember.computed('[email protected]', function() { - return this.get('databases').findBy('selected', true); + + selectedDatabase: Ember.computed('selectedMultiDb', function() { + // return this.get('databases').findBy('selected', true) || {'name': "default"}; + //return {'name': "default"}; + return this.get('selectedMultiDb'); }), filteredDatabases: Ember.computed('filterText', 'databases.@each', function() { return this.get('databases').filter((item) => { - return item.get('name'); - }); + return item.get('name'); + }); }), resetDatabaseSelection() { this.get('databases').forEach(x => { if (x.get('selected')) { - x.set('selected', false); - } - }); + x.set('selected', false); + } + }); }, - allDbs: Ember.computed('selectedDatabase','filteredDatabases', function() { + allDbs: Ember.computed('selectedMultiDb','filteredDatabases', function() { let dblist =[]; this.get('filteredDatabases').forEach(db => { dblist.push(db.get('name')); - }); + }); return dblist; }), - selectedDbs: Ember.computed('selectedDatabase','filteredDatabases', function() { + selectedDbs: Ember.computed('selectedMultiDb','filteredDatabases', function() { let selecteddblist =[]; - selecteddblist.push(this.get('selectedDatabase.name')); //As of now for single selection but will convert this for multiple DBs selected. + this.get('selectedMultiDb').forEach((item => { + selecteddblist.push(item.name); + })); return selecteddblist; }), @@ -75,8 +80,7 @@ export default Ember.Component.extend({ }, updateTables(){ - console.log('updateTables for selected databases.', this.get('selectedDbs')); - this.sendAction('xyz', this.get('selectedDbs')); + this.sendAction('changeDbHandler', this.get('selectedDbs')); } } http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/components/query-editor.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/components/query-editor.js b/contrib/views/hive20/src/main/resources/ui/app/components/query-editor.js index f08e5a6..b42c495 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/components/query-editor.js +++ b/contrib/views/hive20/src/main/resources/ui/app/components/query-editor.js @@ -91,6 +91,9 @@ export default Ember.Component.extend({ } } + this.sendAction('updateQuery'); + + }.observes('query'), http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/configs/top-level-tabs.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/configs/top-level-tabs.js b/contrib/views/hive20/src/main/resources/ui/app/configs/top-level-tabs.js index 6f04f0a..4b4c16d 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/configs/top-level-tabs.js +++ b/contrib/views/hive20/src/main/resources/ui/app/configs/top-level-tabs.js @@ -22,7 +22,7 @@ let topLevelTabs = [ Ember.Object.create({ name: 'query', label: 'QUERY', - link: 'query', + link: 'queries', faIcon: 'paper-plane' }), Ember.Object.create({ http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/models/worksheet.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/models/worksheet.js b/contrib/views/hive20/src/main/resources/ui/app/models/worksheet.js new file mode 100644 index 0000000..d254ed1 --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/models/worksheet.js @@ -0,0 +1,36 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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. + */ + +import DS from 'ember-data'; + +export default DS.Model.extend({ + title: DS.attr('string'), + query: DS.attr('string'), + selectedDb: DS.attr('string'), + owner: DS.attr('string'), + queryResult: DS.attr({defaultValue: {'schema' :[], 'rows' :[]}}), + currentPage: DS.attr('number', {defaultValue: 0}), + previousPage: DS.attr('number', {defaultValue: -1}), + nextPage: DS.attr('number', {defaultValue: 1}), + selected: DS.attr('boolean', {transient: true, defaultValue: false}), + jobData: DS.attr({defaultValue: []}), + currentJobData: DS.attr({defaultValue: null}), + hidePreviousButton: DS.attr('boolean', { defaultValue: true}), + selectedTablesModels: DS.attr(), + selectedMultiDb: DS.attr() +}); http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/router.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/router.js b/contrib/views/hive20/src/main/resources/ui/app/router.js index 46150f4..692cefd 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/router.js +++ b/contrib/views/hive20/src/main/resources/ui/app/router.js @@ -50,8 +50,10 @@ Router.map(function() { this.route('message', {path: '/:message_id'}); }); - this.route('query', function() { + this.route('queries', function() { + this.route('query', {path: '/:worksheetId'}, function() { + }); }); }); http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/routes/queries.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/routes/queries.js b/contrib/views/hive20/src/main/resources/ui/app/routes/queries.js new file mode 100644 index 0000000..2346345 --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/routes/queries.js @@ -0,0 +1,79 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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. + */ + +import Ember from 'ember'; + +export default Ember.Route.extend({ + + model() { + + let existingWorksheets = this.store.peekAll('worksheet'); + + if(existingWorksheets.get('length') === 0) { + this.store.createRecord('worksheet', { + id: 'worksheet1', + title: 'Worksheet1', + query: 'select 1;', + selectedDb : 'default', + owner: 'admin', + selected: true + }); + } + + return this.store.peekAll('worksheet'); + + }, + setupController(controller, model) { + this._super(...arguments); + controller.set('worksheets', model); + + // This is just the initial currentWorksheet, It will be set on correctly on click of worksheet. + controller.set('currentWorksheet', controller.get('worksheets').get('firstObject')); + + }, + + actions: { + + createNewWorksheet(){ + + let worksheets = this.controllerFor('queries').get('model'); + worksheets.forEach((worksheet) => { + worksheet.set('selected', false); + }); + + let localWs = { + id: `worksheet${worksheets.get('length') + 1}`, + title:`Worksheet${worksheets.get('length') + 1}`, + query: 'select '+ parseInt(worksheets.get('length') + 1) + ';', + selectedDb : 'default', + owner: 'admin', + selected: true + }; + + let newWorksheet = this.store.createRecord('worksheet', localWs ); + this.set('controller.worksheets', this.store.peekAll('worksheet')); + + this.transitionTo('queries.query', localWs.title); + }, + + saveWorksheet(){ + // Here we will save the worksheet with some title. + } + + } +}); http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/routes/queries/index.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/routes/queries/index.js b/contrib/views/hive20/src/main/resources/ui/app/routes/queries/index.js new file mode 100644 index 0000000..9872583 --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/routes/queries/index.js @@ -0,0 +1,29 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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. + */ + +import Ember from 'ember'; + +export default Ember.Route.extend({ + beforeModel() { + if(this.modelFor('queries').filterBy('selected', true).length > 0){ + let selectedWorksheet = this.modelFor('queries').filterBy('selected', true).get('firstObject'); + console.log('worksheet-title', selectedWorksheet.get('title')); + this.transitionTo('queries.query', selectedWorksheet.get('title')); + } + } +}); http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/routes/queries/query.js ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/routes/queries/query.js b/contrib/views/hive20/src/main/resources/ui/app/routes/queries/query.js new file mode 100644 index 0000000..5eac78a --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/routes/queries/query.js @@ -0,0 +1,292 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you 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. + */ + +import Ember from 'ember'; + +export default Ember.Route.extend({ + + query: Ember.inject.service(), + + beforeModel(){ + let existingWorksheets = this.store.peekAll('worksheet'); + existingWorksheets.forEach((worksheet) => { + worksheet.set('selected', false); + }); + }, + + afterModel(model) { + + let dbmodel = this.store.findAll('database'); + + if (dbmodel.get('length') > 0) { + this.selectDatabase(dbmodel); + } + }, + + model(params) { + let selectedWs = this.modelFor('queries').filterBy('title', params.worksheetId).get('firstObject'); + selectedWs.set('selected', true); + return selectedWs; + }, + + setupController(controller, model) { + + this._super(...arguments); + + let self = this; + let alldatabases = this.store.findAll('database'); + + controller.set('alldatabases',alldatabases); + + let selecteDBName = model.get('selectedDb'); + + let selectedTablesModels =[]; + let selectedMultiDb = []; + + selectedTablesModels.pushObject( + { + 'dbname': selecteDBName , + 'tables': this.store.query('table', {databaseId: selecteDBName}) + } + ) + + selectedMultiDb.pushObject(selecteDBName); + + controller.set('worksheet', model); + controller.set('selectedTablesModels',this.get('controller.model').get('selectedTablesModels') || selectedTablesModels ); + + controller.set('selectedMultiDb', this.get('controller.model').get('selectedMultiDb') || selectedMultiDb); + controller.set('isQueryRunning', false); + controller.set('currentQuery', model.get('query')); + controller.set('queryResult', model.get('queryResult')); + + }, + + + actions: { + + changeDbHandler(selectedDBs){ + + let self = this; + let selectedTablesModels =[]; + let selectedMultiDb = []; + + selectedDBs.forEach(function(db){ + selectedTablesModels.pushObject( + { + 'dbname': db , + 'tables':self.store.query('table', {databaseId: db}) + } + ) + selectedMultiDb.pushObject(db); + + }); + + this.get('controller').set('selectedTablesModels', selectedTablesModels ); + this.get('controller.model').set('selectedTablesModels', selectedTablesModels ); + + this.get('controller').set('selectedMultiDb', selectedMultiDb ); + this.get('controller.model').set('selectedMultiDb', selectedMultiDb ); + + + }, + + showTables(db){ + //should we do this by writing a seperate component. + $('#' + db).toggle(); + this.get('controller.model').set('selectedDb', db); + }, + + executeQuery(isFirstCall){ + let self = this; + let queryInput = this.get('controller').get('currentQuery'); + this.get('controller.model').set('query', queryInput); + + let dbid = this.get('controller.model').get('selectedDb'); + let worksheetTitle = this.get('controller.model').get('title'); + + self.get('controller').set('isQueryRunning', true); + + //Making the result set emply every time query runs. + self.get('controller').set('queryResult', self.get('controller').get('queryResult')); + self.get('controller.model').set('queryResult', self.get('controller').get('queryResult')); + + let payload ={ + "title":worksheetTitle, + "hiveQueryId":null, + "queryFile":null, + "owner":null, + "dataBase":dbid, + "status":null, + "statusMessage":null, + "dateSubmitted":null, + "forcedContent":queryInput, + "logFile":null, + "dagName":null, + "dagId":null, + "sessionTag":null, + "statusDir":null, + "referrer":"job", + "confFile":null, + "globalSettings":""}; + + + this.get('query').createJob(payload).then(function(data) { + // applying a timeout otherwise it goes for status code 409, although that condition is also handled in the code. + setTimeout(function(){ + self.get('controller.model').set('currentJobData', data); + self.send('getJob', data); + }, 2000); + }, function(reason) { + console.log(reason); + }); + + }, + getJob(data){ + + var self = this; + var data = data; + + let jobId = data.job.id; + let dateSubmitted = data.job.dateSubmitted; + + let currentPage = this.get('controller.model').get('currentPage'); + let previousPage = this.get('controller.model').get('previousPage'); + let nextPage = this.get('controller.model').get('nextPage'); + + this.get('query').getJob(jobId, dateSubmitted, true).then(function(data) { + // on fulfillment + console.log('getJob route', data ); + + self.get('controller').set('queryResult', data); + self.get('controller.model').set('queryResult', data); + self.get('controller').set('isQueryRunning', false); + + let localArr = self.get('controller.model').get("jobData"); + localArr.push(data); + self.get('controller.model').set('jobData', localArr); + self.get('controller.model').set('currentPage', currentPage+1); + self.get('controller.model').set('previousPage', previousPage + 1 ); + self.get('controller.model').set('nextPage', nextPage + 1); + + }, function(reason) { + // on rejection + console.log('reason' , reason); + + if( reason.errors[0].status == 409 ){ + setTimeout(function(){ + self.send('getJob',data); + }, 2000); + } + }); + }, + + updateQuery(){ + console.log('I am in update query.') + }, + + goNextPage(){ + + let currentPage = this.get('controller.model').get('currentPage'); + let previousPage = this.get('controller.model').get('previousPage'); + let nextPage = this.get('controller.model').get('nextPage'); + let totalPages = this.get('controller.model').get("jobData").length; + + if(nextPage > totalPages){ //Pages from server + var self = this; + var data = this.get('controller.model').get('currentJobData'); + let jobId = data.job.id; + let dateSubmitted = data.job.dateSubmitted; + + this.get('query').getJob(jobId, dateSubmitted, false).then(function(data) { + // on fulfillment + console.log('getJob route', data ); + self.get('controller').set('queryResult', data); + self.get('controller.model').set('queryResult', data); + self.get('controller').set('isQueryRunning', false); + self.get('controller.model').set('hidePreviousButton', false); + + let localArr = self.get('controller.model').get("jobData"); + localArr.push(data); + + self.get('controller.model').set('jobData', localArr); + self.get('controller.model').set('currentPage', currentPage+1); + self.get('controller.model').set('previousPage', previousPage + 1 ); + self.get('controller.model').set('nextPage', nextPage + 1); + }, function(reason) { + // on rejection + console.log('reason' , reason); + + if( reason.errors[0].status == 409 ){ + setTimeout(function(){ + self.send('getJob',data); + }, 2000); + } + }); + } else { //Pages from cache object + this.get('controller.model').set('currentPage', currentPage+1); + this.get('controller.model').set('previousPage', previousPage + 1 ); + this.get('controller.model').set('nextPage', nextPage + 1); + this.get('controller.model').set('hidePreviousButton', false); + this.get('controller').set('queryResult', this.get('controller.model').get("jobData")[this.get('controller.model').get('currentPage')-1] ); + this.get('controller.model').set('queryResult', this.get('controller.model').get("jobData")[this.get('controller.model').get('currentPage')-1] ); + } + }, + + goPrevPage(){ + let currentPage = this.get('controller.model').get('currentPage'); + let previousPage = this.get('controller.model').get('previousPage'); + let nextPage = this.get('controller.model').get('nextPage'); + let totalPages = this.get('controller.model').get("jobData").length; + + if(previousPage > 0){ + this.get('controller.model').set('currentPage', currentPage-1 ); + this.get('controller.model').set('previousPage', previousPage - 1 ); + this.get('controller.model').set('nextPage', nextPage-1); + + this.get('controller').set('queryResult', this.get('controller.model').get("jobData")[this.get('controller.model').get('currentPage') -1 ]); + this.get('controller.model').set('queryResult', this.get('controller.model').get("jobData")[this.get('controller.model').get('currentPage') -1 ]); + } else { + this.get('controller.model').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/cde4ce8e/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 9e22432..54213c7 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 @@ -87,7 +87,7 @@ export default Ember.Route.extend({ actions: { - xyz(selectedDBs){ + changeDbHandler(selectedDBs){ let self = this; let selectedTablesModels =[]; http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/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 4d8fca4..6bf8e5a 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 @@ -286,6 +286,9 @@ pre { .query-editor { border: 1px solid darken($database-search-background, 25%); margin-right: 0; + .expand-button{ + position: absolute;right: 5px;top: 5px;z-index: 9999;cursor: pointer; + } } .query-editor-full-width { @@ -787,6 +790,20 @@ pre { margin-top: 10px; } +.worksheet-container{ + width:100%;padding: 10px 0; +} + +.worksheet-nav { + li{ + margin-left:5px; + a { + border : 1px solid #bbbbb9; + } + button.new-worksheet {margin-left: -5px; margin-top: 4px} + } +} + http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/templates/components/multiple-database-search-bar.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/components/multiple-database-search-bar.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/components/multiple-database-search-bar.hbs index 57001ed..cc102b4 100644 --- a/contrib/views/hive20/src/main/resources/ui/app/templates/components/multiple-database-search-bar.hbs +++ b/contrib/views/hive20/src/main/resources/ui/app/templates/components/multiple-database-search-bar.hbs @@ -26,14 +26,13 @@ {{#power-select-multiple placeholder="Search databases" options=allDbs - selected=selectedDbs + selected=selectedMultiDb onchange=(pipe-action (action (mut selectedDbs)) (action "updateTables")) onkeydown=(action "createOnEnter") as |number|}} {{fa-icon "database"}} {{number}} {{/power-select-multiple}} - <span class="input-group-btn" style="top: 0;right: 130px;position: absolute;"> <button type="button" class="btn btn-default">{{fa-icon "folder"}} Browse <span class="caret"></span></button> </span> http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/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 376afe7..441352e 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 @@ -18,7 +18,7 @@ {{#if columns.length}} <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="Previous Page" {{action "goPrevPage" }} >{{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> @@ -50,3 +50,4 @@ </div> {{yield}} + http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/templates/queries.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/queries.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/queries.hbs new file mode 100644 index 0000000..6fc7486 --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/templates/queries.hbs @@ -0,0 +1,32 @@ +{{! +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you 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. +}} + +<div class="worksheet-container"> + <ul class="worksheet-nav row nav nav-tabs inverse"> + {{#each worksheets as |worksheet| }} + <li class="{{if worksheet.selected 'active'}}" style=""> + {{#link-to 'queries.query' worksheet.title }}{{ worksheet.title }}{{/link-to}} + </li> + {{/each}} + <li> + <button class="btn btn-default new-worksheet" title="New Worksheet" {{action "createNewWorksheet" }}>{{fa-icon "plus"}}</button> + </li> + </ul> +</div> + +{{outlet}} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/contrib/views/hive20/src/main/resources/ui/app/templates/queries/query.hbs ---------------------------------------------------------------------- diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/queries/query.hbs b/contrib/views/hive20/src/main/resources/ui/app/templates/queries/query.hbs new file mode 100644 index 0000000..371f404 --- /dev/null +++ b/contrib/views/hive20/src/main/resources/ui/app/templates/queries/query.hbs @@ -0,0 +1,90 @@ +{{! +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you 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. +}} + +{{multiple-database-search-bar databases=alldatabases selectedMultiDb=selectedMultiDb changeDbHandler="changeDbHandler" }} + +<div class="clearfix col-md-9 query-editor-panel"> + <div class="tab-results"> + <div class="query-editor-container"> + <div class="row query-editor" style="position:relative"> + <span class="expand-button" {{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="clearfix row query-editor-results" style="position: relative"> + {{query-result-table + queryResult=queryResult + updateQuery='updateQuery' + previousPage=worksheet.previousPage + hidePreviousButton=hidePreviousButton + goNextPage='goNextPage' + goPrevPage='goPrevPage' + expandQueryResultPanel='expandQueryResultPanel'}} + </div> + </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"> + {{#each selectedTablesModels as |tableModel|}} + <div class="panel panel-default"> + <div class="panel-heading" role="tab"> + <h4 class="panel-title"> + <a role="button" data-toggle="collapse" data-parent="#accordion" + href="javascript:void(0)" {{action 'showTables' tableModel.dbname }} aria-expanded="true" + aria-controls={{tableModel.dbname}}> + {{ tableModel.dbname }} + </a> + <small class="pull-right">Tables({{tableModel.tables.length}})</small> + </h4> + </div> + <div id={{ tableModel.dbname }} class="db-tables collapse panel-collapse {{if singleDbModel 'in'}}" role="tabpanel" + aria-labelledby="headingOne"> + <div class="panel-body"> + {{#if tableModel.tables.length }} + {{#list-filter header="tables" items=tableModel.tables + placeholder="Search Tables" + as |filteredItems|}} + {{#list-group class="table-list" items=filteredItems as |item|}} + {{list-item item=item itemClicked="tableSelected"}} + {{/list-group}} + {{/list-filter}} + {{else}} + <div class="empty">No Table found.</div> + {{/if}} + </div> + </div> + </div> + {{/each}} + </div> + </div> +</div> +</div> + +{{outlet}} http://git-wip-us.apache.org/repos/asf/ambari/blob/cde4ce8e/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 69fc657..3575ec1 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 @@ -16,44 +16,34 @@ * limitations under the License. }} -{{multiple-database-search-bar databases=model selected=selected xyz="xyz" }} +{{multiple-database-search-bar databases=model selected=selected changeDbHandler="changeDbHandler" }} <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" }} > + <span class="expand-button" {{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="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"> - {{#each selectedTablesModels as |tableModel|}} <div class="panel panel-default"> - <div class="panel-heading" role="tab"> <h4 class="panel-title"> <a role="button" data-toggle="collapse" data-parent="#accordion" @@ -64,7 +54,6 @@ <small class="pull-right">Tables({{tableModel.tables.length}})</small> </h4> </div> - <div id={{ tableModel.dbname }} class="panel-collapse collapse {{if singleDbModel 'in'}}" role="tabpanel" aria-labelledby="headingOne"> <div class="panel-body"> @@ -81,17 +70,13 @@ {{/if}} </div> </div> - </div> {{/each}} - </div> </div> </div> - </div> - {{#if databaseNotEmpty}} {{database-not-empty name=databaseName close="notEmptyDialogClosed"}} {{/if}}
![http://www.bba-reman.com/images/fbloader.gif"](http://www.bba-reman.com/images/fbloader.gif"){kind=link}