You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by xi...@apache.org on 2015/04/15 02:52:18 UTC
ambari git commit: AMBARI-10486. Widget Browser: implement
shared/mine tabs and service filter on each tab.(XIWANG)
Repository: ambari
Updated Branches:
refs/heads/trunk 2ca4a9b43 -> ab52fb399
AMBARI-10486. Widget Browser: implement shared/mine tabs and service filter on each tab.(XIWANG)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/ab52fb39
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/ab52fb39
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/ab52fb39
Branch: refs/heads/trunk
Commit: ab52fb399d992b288b0893590c8db2fc380e639b
Parents: 2ca4a9b
Author: Xi Wang <xi...@apache.org>
Authored: Tue Apr 14 17:44:02 2015 -0700
Committer: Xi Wang <xi...@apache.org>
Committed: Tue Apr 14 17:44:13 2015 -0700
----------------------------------------------------------------------
.../data/widget_layouts/all_mine_widgets.json | 6 +
.../controllers/main/service/info/summary.js | 118 ++++++++++++++++---
.../app/styles/enhanced_service_dashboard.less | 23 ++++
.../modal_popups/widget_browser_popup.hbs | 20 ++--
ambari-web/app/utils/ajax/ajax.js | 5 +
5 files changed, 146 insertions(+), 26 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/ab52fb39/ambari-web/app/assets/data/widget_layouts/all_mine_widgets.json
----------------------------------------------------------------------
diff --git a/ambari-web/app/assets/data/widget_layouts/all_mine_widgets.json b/ambari-web/app/assets/data/widget_layouts/all_mine_widgets.json
index 1689f03..c87eff1 100644
--- a/ambari-web/app/assets/data/widget_layouts/all_mine_widgets.json
+++ b/ambari-web/app/assets/data/widget_layouts/all_mine_widgets.json
@@ -27,6 +27,7 @@
"widget_name": "MINE_ACTIVE_HANDLER",
"display_name": "Mine Active Handlers/Calls",
"widget_type": "GAUGE",
+ "author": "xi",
"metrics": [
{
"name": "ipc.IPC.numOpenConnections",
@@ -53,6 +54,7 @@
"display_name": "Mine Open Connections",
"description": "This widget shows number of current open connections",
"widget_type": "GRAPH",
+ "author": "xi",
"metrics": [
{
"service_name": "HDFS"
@@ -68,6 +70,7 @@
"display_name": "Mine Files Local",
"description": "This widget shows percentage of files local.",
"widget_type": "NUMBER",
+ "author": "xi",
"metrics": [
{
"name": "regionserver.Server.percentFilesLocal",
@@ -96,6 +99,7 @@
"display_name": "Mine Updated Blocked Time",
"description": "",
"widget_type": "GRAPH",
+ "author": "xi",
"metrics": [
{
"service_name": "YARN"
@@ -111,6 +115,7 @@
"display_name": "MINE WIDGET 1",
"description": "this is to show .....this is a long description..very long ..very long..very long..very long..very long..very long..very long..very long..very long..very long..very long..very long..very long..very long..very long",
"widget_type": "GAUGE",
+ "author": "xi",
"metrics": [
{
"service_name": "HBASE"
@@ -129,6 +134,7 @@
"display_name": "MINE WIDGET 2",
"description": "this is to show .....",
"widget_type": "NUMBER",
+ "author": "xi",
"metrics": [
{
"service_name": "YARN"
http://git-wip-us.apache.org/repos/asf/ambari/blob/ab52fb39/ambari-web/app/controllers/main/service/info/summary.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/controllers/main/service/info/summary.js b/ambari-web/app/controllers/main/service/info/summary.js
index 447cc0d..878fb0c 100644
--- a/ambari-web/app/controllers/main/service/info/summary.js
+++ b/ambari-web/app/controllers/main/service/info/summary.js
@@ -314,6 +314,7 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
* @type {boolean}
*/
isAllSharedWidgetsLoaded: false,
+ isMineWidgetsLoaded: false,
/**
* @type {Em.A}
@@ -422,6 +423,51 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
},
allSharedWidgets: [],
+ mineWidgets: [],
+
+ /**
+ * load all mine widgets of current user to show on widget browser
+ * @returns {$.ajax}
+ */
+ loadMineWidgets: function () {
+ this.set('isMineWidgetsLoaded', false);
+ return App.ajax.send({
+ name: 'widgets.all.mine.get',
+ sender: this,
+ data: {
+ loginName: App.router.get('loginName')
+ },
+ success: 'loadMineWidgetsSuccessCallback'
+ });
+ },
+
+ /**
+ * success callback of <code>loadMineWidgets</code>
+ * @param {object|null} data
+ */
+ loadMineWidgetsSuccessCallback: function (data) {
+ var addedWidgetsNames = this.get('widgets').mapProperty('widgetName');
+ if (data.items[0] && data.items.length) {
+ this.set("mineWidgets",
+ data.items.map(function (widget) {
+ var widgetType = widget.Widgets.widget_type;
+ var widgetName = widget.Widgets.widget_name;
+ if (widgetType != "HEATMAP") {
+ return Em.Object.create({
+ iconPath: "/img/widget-" + widgetType.toLowerCase() + ".png",
+ widgetName: widgetName,
+ displayName: widget.Widgets.display_name,
+ description: widget.Widgets.description,
+ widgetType: widgetType,
+ serviceName: widget.Widgets.metrics.mapProperty('service_name').uniq().join('-'),
+ added: addedWidgetsNames.contains(widgetName)
+ });
+ }
+ })
+ );
+ this.set('isMineWidgetsLoaded', true);
+ }
+ },
/**
* load widgets defined by stack
@@ -521,6 +567,8 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
this.hide();
self.set('isAllSharedWidgetsLoaded', false);
self.set('allSharedWidgets', []);
+ self.set('isMineWidgetsLoaded', false);
+ self.set('mineWidgets', []);
},
autoHeight: false,
isHideBodyScroll: false,
@@ -530,29 +578,43 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
controller: self,
willInsertElement: function () {
this.get('controller').loadAllSharedWidgets();
+ this.get('controller').loadMineWidgets();
},
+ isLoaded: function () {
+ return !!this.get('controller.isAllSharedWidgetsLoaded');
+ }.property('controller.isAllSharedWidgetsLoaded'),
+
+ isWidgetEmptyList: function () {
+ return !this.get('filteredContent.length');
+ }.property('filteredContent.length'),
+
activeTab: 'shared',
- activeService: this.get('controller.content.serviceName'),
+ activeService: '',
activeStatus: '',
content: function () {
- return this.get('controller.allSharedWidgets');
- }.property('controller.allSharedWidgets.length', 'controller.isAllSharedWidgetsLoaded'),
+ if (this.get('activeTab') == 'mine') {
+ return this.get('controller.mineWidgets');
+ } else if (this.get('activeTab') == 'shared') {
+ return this.get('controller.allSharedWidgets');
+ }
+ }.property('controller.allSharedWidgets.length', 'controller.isAllSharedWidgetsLoaded',
+ 'controller.mineWidgets.length', 'controller.isMineWidgetsLoaded', 'activeTab'),
- // content filtered by tab, service name and status.
- // If tab changed, service/status set to default
+ /**
+ * displaying content filtered by service name and status.
+ */
filteredContent: function () {
-
- }.property('content', 'activeTab', 'activeService', 'activeStatus'),
-
- isLoaded: function () {
- return !!this.get('controller.isAllSharedWidgetsLoaded');
- }.property('controller.isAllSharedWidgetsLoaded'),
-
- isWidgetEmptyList: function () {
- return !this.get('content.length');
- }.property('content.length'),
+ var activeService = this.get('activeService')? this.get('activeService'): this.get('controller.content.serviceName');
+ var result = [];
+ this.get('content').forEach(function(widget) {
+ if (widget.get('serviceName').indexOf(activeService) >= 0){
+ result.pushObject(widget);
+ }
+ });
+ return result;
+ }.property('content', 'activeService', 'activeStatus'),
/**
* top tabs: Share / Mine
@@ -578,6 +640,14 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
var label = Em.get(this, 'templateData.keywords.category.label');
return label ? 'widget-browser-view-tab-' + label.toLowerCase().replace(/\s/g, '-') : "";
}),
+ count: function () {
+ if (this.get('item') == 'mine') {
+ return this.get('parentView.controller.mineWidgets.length');
+ } else if (this.get('item') == 'shared') {
+ return this.get('parentView.controller.allSharedWidgets.length');
+ }
+ }.property('item', 'parentView.controller.mineWidgets.length',
+ 'parentView.controller.allSharedWidgets.length'),
goToWidgetTab: function (event) {
var targetName = event.context;
this.set('parentView.activeTab', targetName);
@@ -587,9 +657,23 @@ App.MainServiceInfoSummaryController = Em.Controller.extend({
/**
* service name filter
*/
- serviceNames: function () {
+ services: function () {
+ var view = this;
+ return App.Service.find().map(function (service) {
+ return Em.Object.create({
+ value: service.get('serviceName'),
+ label: service.get('displayName'),
+ isActive: function () {
+ var activeService = view.get('activeService')? view.get('activeService'): view.get('controller.content.serviceName');
+ return this.get('value') == activeService;
+ }.property('value', 'view.activeService')
+ })
+ });
+ }.property('activeService'),
- }.property(),
+ filterByService: function (event) {
+ this.set('activeService', event.context);
+ },
createWidget: function () {
this.get('parentView').onPrimary();
http://git-wip-us.apache.org/repos/asf/ambari/blob/ab52fb39/ambari-web/app/styles/enhanced_service_dashboard.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/enhanced_service_dashboard.less b/ambari-web/app/styles/enhanced_service_dashboard.less
index 5b7c21a..6ef92b8 100644
--- a/ambari-web/app/styles/enhanced_service_dashboard.less
+++ b/ambari-web/app/styles/enhanced_service_dashboard.less
@@ -332,6 +332,28 @@
#widget-browser-popup {
min-width: 750px;
max-width: 900px;
+ #shared-mine-tabs {
+ a {
+ font-size: 15px;
+ }
+ }
+ #services-filter-bar {
+ padding: 10px;
+ a {
+ font-size: 14px;
+ padding: 3px;
+ }
+ a:hover {
+ cursor: pointer;
+ }
+ a.active {
+ color: #333;
+ }
+ a.active:hover {
+ text-decoration: none;
+ cursor: default;
+ }
+ }
#widgets-info {
.widgets-info-container {
.span6.widget-info-section {
@@ -379,6 +401,7 @@
.widget-section-actions {
position: relative;
top: -30px;
+ right: 5px;
.btn {
padding: 3px 8px;
width: 60px;
http://git-wip-us.apache.org/repos/asf/ambari/blob/ab52fb39/ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs b/ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs
index c483226..9b83b1b 100644
--- a/ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs
+++ b/ambari-web/app/templates/common/modal_popups/widget_browser_popup.hbs
@@ -27,11 +27,11 @@
</div>
<!--Top menu tabs-->
- <div class="shared-mine-tabs" id="">
+ <div id="shared-mine-tabs">
<ul class="nav nav-tabs">
{{#each category in view.categories}}
{{#view view.NavItemView itemBinding="category.name" }}
- <a href="#" {{action "goToWidgetTab" category.name target="view"}} >{{category.label}}</a>
+ <a href="#" {{action "goToWidgetTab" category.name target="view"}} >{{category.label}} ({{view.count}})</a>
{{/view}}
{{/each}}
</ul>
@@ -40,16 +40,19 @@
<!--Filters bar: service name filter, status filter here-->
- <div class="">
+ <div id="services-filter-bar">
+ {{#each service in view.services}}
+ <a {{bindAttr class="service.isActive:active"}} {{action "filterByService" service.value target="view"}}>{{service.label}}</a>
+ {{/each}}
</div>
<!--Widgets table two column-->
<div id="widgets-info">
{{#if view.isWidgetEmptyList}}
- <div class="no-widgets-text">{{t dashboard.widgets.browser.noWidgets}}</div>
+ <div class="no-widgets-text">{{t dashboard.widgets.browser.noWidgets}}</div>
{{else}}
<div class="widgets-info-container row-fluid">
- {{#each widget in view.content}}
+ {{#each widget in view.filteredContent}}
<div class="span6 row-fluid widget-info-section">
<div class="icon span4">
<a class="widget-icon-image" target="_blank"><img {{bindAttr src="widget.iconPath"}}></a>
@@ -91,10 +94,9 @@
</div>
</div>
- <div {{bindAttr class="view.filteringComplete:hidden :table-overlay"}}>
- <div class="spinner"></div>
- </div>
-
+ <div class="table-overlay">
+ <div class="spinner"></div>
+ </div>
{{else}}
<div class="spinner"></div>
{{/if}}
http://git-wip-us.apache.org/repos/asf/ambari/blob/ab52fb39/ambari-web/app/utils/ajax/ajax.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/utils/ajax/ajax.js b/ambari-web/app/utils/ajax/ajax.js
index 19f42a6..0dadc53 100644
--- a/ambari-web/app/utils/ajax/ajax.js
+++ b/ambari-web/app/utils/ajax/ajax.js
@@ -2411,6 +2411,11 @@ var urls = {
mock: '/data/widget_layouts/all_shared_widgets.json'
},
+ 'widgets.all.mine.get': {
+ real: '/clusters/{clusterName}/widgets?Widgets/author={loginName}&fields=*',
+ mock: '/data/widget_layouts/all_mine_widgets.json'
+ },
+
'widgets.layout.stackDefined.get': {
real: '{stackVersionURL}/services/{serviceName}/artifacts/widget_descriptor',
mock: '/data/widget_layouts/HBASE/stack_layout.json'