From 66f2009542592e17e13c601ad6bf6d90135d55da Mon Sep 17 00:00:00 2001 From: Vasu Date: Mon, 13 Nov 2017 15:41:33 +0530 Subject: [PATCH] em table helper for rendering text with tooltip --- .../webapp/app/components/em-table-tooltip-text.js | 15 +++++++++++++ .../webapp/app/controllers/app-table-columns.js | 4 ++++ .../templates/components/em-table-tooltip-text.hbs | 7 ++++++ .../components/em-table-tooltip-text-test.js | 25 ++++++++++++++++++++++ 4 files changed, 51 insertions(+) create mode 100644 hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.js create mode 100644 hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/em-table-tooltip-text.hbs create mode 100644 hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/tests/integration/components/em-table-tooltip-text-test.js diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.js new file mode 100644 index 00000000000..fe8e529707e --- /dev/null +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.js @@ -0,0 +1,15 @@ +import Ember from 'ember'; + +export default Ember.Component.extend({ + content: null, + + classNames: ["em-table-text-with-tooltip"], + + didRender: function() { + this.$().parent().css("position", "static"); + }, + + tooltipText: Ember.computed("content", function () { + return this.get("content"); + }), +}); diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/app-table-columns.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/app-table-columns.js index 05bfad455e1..3a6bd3d45d8 100644 --- a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/app-table-columns.js +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/app-table-columns.js @@ -50,6 +50,7 @@ export default Ember.Controller.extend({ }, { id: 'appName', headerTitle: 'Application Name', + cellComponentName: 'em-table-tooltip-text', contentPath: 'appName', facetType: null, }, { @@ -66,6 +67,7 @@ export default Ember.Controller.extend({ }, { id: 'queue', headerTitle: 'Queue', + cellComponentName: 'em-table-tooltip-text', contentPath: 'queue', }, { id: 'progress', @@ -128,6 +130,7 @@ export default Ember.Controller.extend({ headerTitle: 'Application ID', contentPath: 'id', facetType: null, + cellComponentName: 'em-table-tooltip-text', minWidth: "250px" }, { id: 'state', @@ -160,6 +163,7 @@ export default Ember.Controller.extend({ id: 'queue', headerTitle: 'Queue', contentPath: 'queue', + cellComponentName: 'em-table-tooltip-text', }, { id: 'stTime', headerTitle: 'Started Time', diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/em-table-tooltip-text.hbs b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/em-table-tooltip-text.hbs new file mode 100644 index 00000000000..a6c2547d794 --- /dev/null +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/em-table-tooltip-text.hbs @@ -0,0 +1,7 @@ +{{#if content}} + + {{content}} + +{{else}} + N/A +{{/if}} diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/tests/integration/components/em-table-tooltip-text-test.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/tests/integration/components/em-table-tooltip-text-test.js new file mode 100644 index 00000000000..2af10db579b --- /dev/null +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/tests/integration/components/em-table-tooltip-text-test.js @@ -0,0 +1,25 @@ +import { moduleForComponent, test } from 'ember-qunit'; +import hbs from 'htmlbars-inline-precompile'; + +moduleForComponent('em-table-tooltip-text', 'Integration | Component | em table tooltip text', { + integration: true +}); + +test('it renders', function(assert) { + + // Set any properties with this.set('myProperty', 'value'); + // Handle any actions with this.on('myAction', function(val) { ... });" + EOL + EOL + + + this.render(hbs`{{em-table-tooltip-text}}`); + + assert.equal(this.$().text().trim(), ''); + + // Template block usage:" + EOL + + this.render(hbs` + {{#em-table-tooltip-text}} + template block text + {{/em-table-tooltip-text}} + `); + + assert.equal(this.$().text().trim(), 'template block text'); +}); -- 2.13.5 (Apple Git-94)