ambari-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From nc...@apache.org
Subject [33/50] [abbrv] ambari git commit: AMBARI-19975. Hive2. Visual Explain -Show additional info when you click on a box, i.e. can drill down to get more info on operators. (pallavkul)
Date Mon, 13 Feb 2017 22:13:41 GMT
AMBARI-19975. Hive2. Visual Explain -Show additional info when you click on a box, i.e. can
drill down to get more info on operators. (pallavkul)


Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/1d1253a6
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/1d1253a6
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/1d1253a6

Branch: refs/heads/branch-feature-AMBARI-12556
Commit: 1d1253a6471113a78dd22faf453439ab13a19e48
Parents: 2364295
Author: pallavkul <pallav.kul@gmail.com>
Authored: Sat Feb 11 17:06:43 2017 +0530
Committer: pallavkul <pallav.kul@gmail.com>
Committed: Sat Feb 11 17:06:43 2017 +0530

----------------------------------------------------------------------
 .../ui/app/components/visual-explain-detail.js  | 31 +++++++++++++
 .../ui/app/components/visual-explain.js         | 26 ++++++++++-
 .../resources/ui/app/routes/queries/query.js    | 13 ++++--
 .../src/main/resources/ui/app/styles/app.scss   | 49 ++++++++++++++++++++
 .../components/visual-explain-detail.hbs        | 29 ++++++++++++
 .../app/templates/components/visual-explain.hbs |  5 ++
 6 files changed, 148 insertions(+), 5 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain-detail.js
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain-detail.js
b/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain-detail.js
new file mode 100644
index 0000000..2c9ba00
--- /dev/null
+++ b/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain-detail.js
@@ -0,0 +1,31 @@
+/**
+ * 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.Component.extend({
+
+  classNames:['visual-explain-detail-container'],
+
+  actions:{
+    closeModal(){
+      this.sendAction('closeModal');
+    }
+  }
+
+});

http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain.js
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain.js b/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain.js
index 6551974..6805bb8 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain.js
+++ b/contrib/views/hive20/src/main/resources/ui/app/components/visual-explain.js
@@ -20,8 +20,13 @@ import Ember from 'ember';
 import explain from '../utils/hive-explainer';
 
 export default Ember.Component.extend({
+
   visualExplainJson:'',
 
+  showDetailsModal: false,
+
+  explainDetailData: '',
+
   visualExplainInput: Ember.computed('visualExplainJson', function () {
     return this.get('visualExplainJson');
   }),
@@ -39,6 +44,7 @@ export default Ember.Component.extend({
       .attr('height', height);
 
     const container = svg.append('g');
+
     const zoom =
       d3.zoom()
         .scaleExtent([1 / 10, 4])
@@ -49,16 +55,34 @@ export default Ember.Component.extend({
       svg
         .call(zoom);
 
-    const onRequestDetail = data => this.sendAction('showStepDetail', data);
+    const onRequestDetail = data => this.set('explainDetailData', JSON.stringify( data,
null, '  ') );
 
     explain(JSON.parse(this.get('visualExplainInput')), svg, container, zoom, onRequestDetail);
 
   },
 
+  click(event){
+
+    if(this.get('explainDetailData') === ''){
+      return;
+    }
+
+    Ember.run.later(() => {
+      this.set('showDetailsModal', true);
+    }, 100);
+  },
+
   actions:{
     expandQueryResultPanel(){
       this.sendAction('expandQueryResultPanel');
+    },
+
+    closeModal(){
+      this.set('showDetailsModal', false);
+      this.set('explainDetailData', '');
+      false;
     }
+
   }
 
 });

http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/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
index 4f60229..72682f5 100644
--- 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
@@ -221,11 +221,8 @@ export default Ember.Route.extend({
           .then((status) => {
 
               self.get('controller').set('isJobSuccess', true);
-              self.send('getJob', data);
 
-              if(isVisualExplainQuery){
-                self.send('showVisualExplain');
-              }
+              self.send('getJob', data);
 
               //Last log
               self.send('fetchLogs');
@@ -290,6 +287,8 @@ export default Ember.Route.extend({
       var self = this;
       var data = data;
 
+      let isVisualExplainQuery = this.get('controller').get('isVisualExplainQuery');
+
       let jobId = data.job.id;
       let dateSubmitted = data.job.dateSubmitted;
 
@@ -312,6 +311,12 @@ export default Ember.Route.extend({
         self.get('controller.model').set('previousPage', previousPage + 1 );
         self.get('controller.model').set('nextPage', nextPage + 1);
 
+        if(isVisualExplainQuery){
+          Ember.run.later(() => {
+            self.send('showVisualExplain');
+          }, 500);
+        }
+
       }, function(reason) {
         // on rejection
         console.log('reason' , reason);

http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/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 1dc86d7..6469b2e 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
@@ -318,6 +318,7 @@ pre {
 
 .query-editor-results {
   padding-right: 15px;
+  position: relative;
 }
 
 .query-result-table {
@@ -980,3 +981,51 @@ ul.dropdown-menu {
 .break-word{
   word-break: break-all;
 }
+
+.visual-explain-detail-container {
+  width: 500px;
+  position: absolute;
+  top: 50px;
+  right: 0;
+  background-color: #FFF;
+  max-height: 70vh;
+  overflow-y: auto;
+}
+
+.visual-explain-detail{
+  border: 1px solid #DDD;
+  .close{
+    margin: 10px 15px;
+    z-index: 9999;
+  }
+
+  .header{
+    border-bottom: 1px solid #DDD; padding: 10px 0;
+    .icon{
+      padding:10px;
+    }
+    .join-type {
+      font-size: 20px; font-weight: bold
+    }
+  }
+
+  .vector-info{
+    border: 1px solid #DDD; padding:20px; background-color:#ED6265; color:#FFF; font-weight:
bold; margin: 10px 0;
+  }
+  .block{
+    border: 1px solid #DDD; padding:20px; margin: 10px 0;
+
+    .block-header{
+      font-size: 20px; font-weight: bold;
+    }
+    .block-body{
+      padding: 10px 0;
+    }
+
+    .divider{
+      height: 1px; border-top:1px solid #DDD; margin: 10px 0;
+    }
+  }
+
+}
+

http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain-detail.hbs
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain-detail.hbs
b/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain-detail.hbs
new file mode 100644
index 0000000..3df8e94
--- /dev/null
+++ b/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain-detail.hbs
@@ -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.
+}}
+
+<div class="clearfix visual-explain-detail">
+  <div class="pull-right close">  <a href="javascript:void(0)" {{action "closeModal"}}>{{fa-icon
"close"}}</a></div>
+  <div class="clearfix header" >
+  </div>
+  <div class="col-md-12">
+    <div>&nbsp;</div>
+    <pre class="prettyprint">{{explainDetailData}}</pre>
+  </div>
+</div>
+
+{{yield}}

http://git-wip-us.apache.org/repos/asf/ambari/blob/1d1253a6/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain.hbs
----------------------------------------------------------------------
diff --git a/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain.hbs
b/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain.hbs
index 4238d43..e0ceaa2 100644
--- a/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain.hbs
+++ b/contrib/views/hive20/src/main/resources/ui/app/templates/components/visual-explain.hbs
@@ -34,4 +34,9 @@
   <div id="explain-container" ></div>
 {{/unless}}
 
+{{#if showDetailsModal}}
+  {{visual-explain-detail closeModal='closeModal' explainDetailData=explainDetailData}}
+{{/if}}
+
+
 {{yield}}


Mime
View raw message