YARN-7480. Render tooltips on columns where text is clipped in new YARN UI. Contributed by Vasudevan Skm. This closes #293
Project: http://git-wip-us.apache.org/repos/asf/hadoop/repo Commit: http://git-wip-us.apache.org/repos/asf/hadoop/commit/6b76695f Tree: http://git-wip-us.apache.org/repos/asf/hadoop/tree/6b76695f Diff: http://git-wip-us.apache.org/repos/asf/hadoop/diff/6b76695f Branch: refs/heads/HDFS-7240 Commit: 6b76695f886d4db7287a0425d56d5e13daf5d08d Parents: 641ba5c Author: Sunil G <sun...@apache.org> Authored: Tue Nov 28 22:41:52 2017 +0530 Committer: Sunil G <sun...@apache.org> Committed: Tue Nov 28 22:41:52 2017 +0530 ---------------------------------------------------------------------- .../app/components/em-table-tooltip-text.js | 33 +++++++++++++++ .../webapp/app/controllers/app-table-columns.js | 4 ++ .../components/em-table-tooltip-text.hbs | 26 ++++++++++++ .../components/em-table-tooltip-text-test.js | 43 ++++++++++++++++++++ 4 files changed, 106 insertions(+) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/hadoop/blob/6b76695f/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.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 0000000..f363460 --- /dev/null +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/em-table-tooltip-text.js @@ -0,0 +1,33 @@ +/** + * 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({ + content: null, + + classNames: ["em-table-text-with-tooltip"], + + didRender: function() { + this.$().parent().css("position", "static"); + }, + + tooltipText: Ember.computed("content", function () { + return this.get("content"); + }), +}); http://git-wip-us.apache.org/repos/asf/hadoop/blob/6b76695f/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/controllers/app-table-columns.js ---------------------------------------------------------------------- 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 a87acc1..fb002f9 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', http://git-wip-us.apache.org/repos/asf/hadoop/blob/6b76695f/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/em-table-tooltip-text.hbs ---------------------------------------------------------------------- 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 0000000..cf8b5d1 --- /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,26 @@ +{{! + * 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. +}} + + +{{#if content}} + <span title={{tooltipText}} class="yarn-tooltip"> + {{content}} + </span> +{{else}} + <span class="txt-message"> N/A </span> +{{/if}} http://git-wip-us.apache.org/repos/asf/hadoop/blob/6b76695f/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/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 0000000..fb7d211 --- /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,43 @@ +/** + * 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 { 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'); +}); --------------------------------------------------------------------- To unsubscribe, e-mail: common-commits-unsubscr...@hadoop.apache.org For additional commands, e-mail: common-commits-h...@hadoop.apache.org
