Repository: ambari Updated Branches: refs/heads/trunk fc2c0ba90 -> 4f1039457
AMBARI-8494. Alerts UI: Time showed for alerts should be relative to now (onechiporenko) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/4f103945 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/4f103945 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/4f103945 Branch: refs/heads/trunk Commit: 4f1039457b91bc2e2a941d689feb59d938baf0a7 Parents: fc2c0ba Author: Oleg Nechiporenko <onechipore...@apache.org> Authored: Mon Dec 1 16:15:15 2014 +0200 Committer: Oleg Nechiporenko <onechipore...@apache.org> Committed: Mon Dec 1 16:15:15 2014 +0200 ---------------------------------------------------------------------- ambari-web/app/models/alert_definition.js | 9 ++++++ ambari-web/app/models/alert_instance.js | 9 ++++++ ambari-web/app/templates/main/alerts.hbs | 20 ++++++++------ .../main/alerts/definition_details.hbs | 12 +++++++- .../app/templates/main/host/host_alerts.hbs | 2 +- .../app/views/main/alert_definitions_view.js | 29 ++++++++++++++++---- .../main/alerts/definition_details_view.js | 17 ++++++++++-- ambari-web/test/models/alert_definition_test.js | 14 ++++++++++ 8 files changed, 93 insertions(+), 19 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/models/alert_definition.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/models/alert_definition.js b/ambari-web/app/models/alert_definition.js index bf5d434..669a9c2 100644 --- a/ambari-web/app/models/alert_definition.js +++ b/ambari-web/app/models/alert_definition.js @@ -64,6 +64,15 @@ App.AlertDefinition = DS.Model.extend({ }.property('lastTriggered'), /** + * Formatted timestamp with <code>$.timeago</code> + * @type {string} + */ + lastTriggeredAgoFormatted: function () { + var lastTriggered = this.get('lastTriggered'); + return lastTriggered ? $.timeago(new Date(lastTriggered)): ''; + }.property('lastTriggered'), + + /** * Status generates from child-alerts * Format: 1 OK / 2 WARN / 1 CRIT / 1 UNKNOWN * If some there are no alerts with some state, this state isn't shown http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/models/alert_instance.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/models/alert_instance.js b/ambari-web/app/models/alert_instance.js index 6590941..113fbd2 100644 --- a/ambari-web/app/models/alert_instance.js +++ b/ambari-web/app/models/alert_instance.js @@ -59,6 +59,15 @@ App.AlertInstance = DS.Model.extend({ }.property('latestTimestamp'), /** + * Formatted timestamp with <code>$.timeago</code> + * @type {string} + */ + lastTriggeredAgoFormatted: function () { + var lastTriggered = this.get('latestTimestamp'); + return lastTriggered ? $.timeago(new Date(lastTriggered)): ''; + }.property('latestTimestamp'), + + /** * List of css-classes for alert instance status * @type {object} */ http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/templates/main/alerts.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/alerts.hbs b/ambari-web/app/templates/main/alerts.hbs index ded942f..2ec37f8 100644 --- a/ambari-web/app/templates/main/alerts.hbs +++ b/ambari-web/app/templates/main/alerts.hbs @@ -55,23 +55,25 @@ </td> <td>{{{alertDefinition.status}}}</td> <td>{{alertDefinition.service.serviceName}}</td> - <td>{{alertDefinition.lastTriggeredFormatted}}</td> + <td><time class="timeago" {{bindAttr data-original-title="alertDefinition.lastTriggeredFormatted"}}>{{alertDefinition.lastTriggeredAgoFormatted}}</time></td> <td class="last toggle-state-button"> {{#if alertDefinition.enabled}} {{t alerts.table.state.enabled}} {{#isAccessible ADMIN}} - <a href="#" {{action "toggleState" alertDefinition target="controller"}} {{bindAttr class=":enable-disable-button alertDefinition.enabled:enabled:disabled"}} - {{bindAttr data-original-title="alerts.table.state.enabled.tooltip"}}> - <span class="icon-off"></span> - </a> + <span class="enable-disable-button" {{bindAttr data-original-title="view.enabledTooltip"}}> + <a href="#" {{action "toggleState" alertDefinition target="controller"}} {{bindAttr class="alertDefinition.enabled:enabled:disabled"}}> + <span class="icon-off"></span> + </a> + </span> {{/isAccessible}} {{else}} {{t alerts.table.state.disabled}} {{#isAccessible ADMIN}} - <a href="#" {{action "toggleState" alertDefinition target="controller"}} {{bindAttr class=":enable-disable-button alertDefinition.enabled:enabled:disabled"}} - {{bindAttr data-original-title="alerts.table.state.disabled.tooltip"}}> - <span class="icon-off"></span> - </a> + <span class="enable-disable-button" {{bindAttr data-original-title="view.disabledTooltip"}}> + <a href="#" {{action "toggleState" alertDefinition target="controller"}} {{bindAttr class="alertDefinition.enabled:enabled:disabled"}}> + <span class="icon-off"></span> + </a> + </span> {{/isAccessible}} {{/if}} </td> http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/templates/main/alerts/definition_details.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/alerts/definition_details.hbs b/ambari-web/app/templates/main/alerts/definition_details.hbs index fd17831..edd2b4a 100644 --- a/ambari-web/app/templates/main/alerts/definition_details.hbs +++ b/ambari-web/app/templates/main/alerts/definition_details.hbs @@ -20,6 +20,8 @@ <div id="alert-definition-details"> <div class="row-fluid"> + + {{! Left column }} <div class="span9"> <div class="definition-name"> {{#if controller.editing.label.isEditing}} @@ -89,6 +91,9 @@ {{/if}} </div> </div> + {{! Left column end }} + + {{! Right column }} <div class="span3 right-column"> <div class="service-name"> {{t common.service}}: <span class="label label-info">{{controller.content.service.displayName}}</span> @@ -124,6 +129,9 @@ </div> </div> </div> + {{! Right column end }} + + {{! List of alerts }} <div class="definition-details-block"> <span class="instances-label"> <strong>{{t alerts.definition.details.instances}}</strong> @@ -149,7 +157,7 @@ <tr> <td class="first">{{instance.state}}</td> <td><a {{action goToHostAlerts instance.host target="controller"}} href="#">{{instance.host.hostName}}</a></td> - <td>{{instance.lastTriggered}}</td> + <td><time class="timeago" {{bindAttr data-original-title="instance.lastTriggered"}}>{{instance.lastTriggeredAgoFormatted}}</time></td> <td>10</td> <td class="last">Admins</td> </tr> @@ -170,6 +178,8 @@ </div> </div> + {{! List of alerts end }} + </div> {{else}} <div class="spinner"></div> http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/templates/main/host/host_alerts.hbs ---------------------------------------------------------------------- diff --git a/ambari-web/app/templates/main/host/host_alerts.hbs b/ambari-web/app/templates/main/host/host_alerts.hbs index d7576ff..5041e8e 100644 --- a/ambari-web/app/templates/main/host/host_alerts.hbs +++ b/ambari-web/app/templates/main/host/host_alerts.hbs @@ -47,7 +47,7 @@ <td class="first">{{alertInstance.label}}</td> <td>{{{alertInstance.status}}}</td> <td>{{alertInstance.service.serviceName}}</td> - <td>{{alertInstance.lastTriggered}}</td> + <td><time class="timeago" {{bindAttr data-original-title="instance.lastTriggered"}}>{{instance.lastTriggeredAgoFormatted}}</time></td> <td>{{alertInstance.formattedNotifications}}</td> </tr> {{/each}} http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/views/main/alert_definitions_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/alert_definitions_view.js b/ambari-web/app/views/main/alert_definitions_view.js index 1300c83..df25bbd 100644 --- a/ambari-web/app/views/main/alert_definitions_view.js +++ b/ambari-web/app/views/main/alert_definitions_view.js @@ -30,9 +30,7 @@ App.MainAlertDefinitionsView = App.TableView.extend({ }.property('controller.content.@each'), didInsertElement: function () { - Em.run.later(this, function () { - App.tooltip($(".enable-disable-button")); - }, 50) ; + this.tooltipsUpdater(); }, /** @@ -44,6 +42,16 @@ App.MainAlertDefinitionsView = App.TableView.extend({ colPropAssoc: ['', 'label', 'summary', 'service.serviceName', 'lastTriggered', 'groups', 'enabled'], + /** + * @type {string} + */ + enabledTooltip: Em.I18n.t('alerts.table.state.enabled.tooltip'), + + /** + * @type {string} + */ + disabledTooltip: Em.I18n.t('alerts.table.state.disabled.tooltip'), + sortView: sort.wrapperView, /** @@ -367,5 +375,16 @@ App.MainAlertDefinitionsView = App.TableView.extend({ if (this.get('paginationRightClass') === 'paginate_next') { this._super(); } - } -}); + }, + + /** + * Update tooltips when <code>pageContent</code> is changed + * @method tooltipsUpdater + */ + tooltipsUpdater: function () { + Em.run.next(this, function () { + App.tooltip($(".enable-disable-button, .timeago")); + }); + }.observes('pageContent.@each') + +}); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/app/views/main/alerts/definition_details_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/alerts/definition_details_view.js b/ambari-web/app/views/main/alerts/definition_details_view.js index 8490755..0e88d21 100644 --- a/ambari-web/app/views/main/alerts/definition_details_view.js +++ b/ambari-web/app/views/main/alerts/definition_details_view.js @@ -28,6 +28,10 @@ App.MainAlertDefinitionDetailsView = App.TableView.extend({ */ isLoaded: false, + content: function () { + return this.get('controller.alerts'); + }.property('controller.alerts.@each'), + willInsertElement: function () { var self = this, updater = App.router.get('updateController'); @@ -54,7 +58,14 @@ App.MainAlertDefinitionDetailsView = App.TableView.extend({ this.filter(); }, - content: function () { - return this.get('controller.alerts'); - }.property('controller.alerts.@each') + /** + * Update tooltips when <code>pageContent</code> is changed + * @method tooltipsUpdater + */ + tooltipsUpdater: function () { + Em.run.next(this, function () { + App.tooltip($(".timeago")); + }); + }.observes('pageContent.@each') + }); http://git-wip-us.apache.org/repos/asf/ambari/blob/4f103945/ambari-web/test/models/alert_definition_test.js ---------------------------------------------------------------------- diff --git a/ambari-web/test/models/alert_definition_test.js b/ambari-web/test/models/alert_definition_test.js index 951ac26..2f66c16 100644 --- a/ambari-web/test/models/alert_definition_test.js +++ b/ambari-web/test/models/alert_definition_test.js @@ -108,4 +108,18 @@ describe('App.AlertDefinition', function() { }); + describe('#lastTriggeredAgoFormatted', function () { + + it('should be empty', function () { + model.set('lastTriggered', 0); + expect(model.get('lastTriggeredAgoFormatted')).to.equal(''); + }); + + it('should not be empty', function () { + model.set('lastTriggered', new Date().getTime() - 61000); + expect(model.get('lastTriggeredAgoFormatted')).to.equal('about a minute ago'); + }); + + }); + });