ambari-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From nc...@apache.org
Subject [10/55] [abbrv] ambari git commit: AMBARI-18912. Implement Create Alerts: step 1 select alert type.(XIWANG)
Date Tue, 29 Nov 2016 17:56:17 GMT
AMBARI-18912. Implement Create Alerts: step 1 select alert type.(XIWANG)


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

Branch: refs/heads/branch-feature-AMBARI-18634
Commit: 31ce5f7d3d087af5d0f03f295fe5d680a6ee453d
Parents: e73e783
Author: Xi Wang <xiwang@apache.org>
Authored: Wed Nov 16 18:31:35 2016 -0800
Committer: Xi Wang <xiwang@apache.org>
Committed: Tue Nov 22 14:21:01 2016 -0800

----------------------------------------------------------------------
 .../add_alert_definition/step1_controller.js    | 41 ++++++-------
 .../alerts/definition_configs_controller.js     | 40 ++++++-------
 ambari-web/app/messages.js                      | 17 ++++--
 .../app/models/alerts/alert_definition.js       | 54 ++++++++++++++++++
 ambari-web/app/styles/alerts.less               | 60 ++++++++++++++++++++
 .../main/alerts/add_alert_definition/step1.hbs  | 30 +++++-----
 .../alerts/add_alert_definition/step1_view.js   |  3 +
 .../step1_controller_test.js                    | 24 +-------
 8 files changed, 186 insertions(+), 83 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/controllers/main/alerts/add_alert_definition/step1_controller.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/controllers/main/alerts/add_alert_definition/step1_controller.js
b/ambari-web/app/controllers/main/alerts/add_alert_definition/step1_controller.js
index 2d4f338..c758fc0 100644
--- a/ambari-web/app/controllers/main/alerts/add_alert_definition/step1_controller.js
+++ b/ambari-web/app/controllers/main/alerts/add_alert_definition/step1_controller.js
@@ -24,34 +24,25 @@ App.AddAlertDefinitionStep1Controller = Em.Controller.extend({
 
   /**
    * List of available alert definition types
-   * @type {{value: string, isActive: boolean}[]}
+   * @type {{name: string, isActive: boolean}[]}
    */
-  alertDefinitionsTypes: [
-    Em.Object.create({value: 'PORT', isActive: false, icon: 'glyphicon glyphicon-signal'}),
-    Em.Object.create({value: 'METRIC', isActive: false, icon: 'icon-bolt'}),
-    Em.Object.create({value: 'WEB', isActive: false, icon: 'glyphicon glyphicon-globe'}),
-    Em.Object.create({value: 'AGGREGATE', isActive: false, icon: 'glyphicon glyphicon-plus-sign-alt'}),
-    Em.Object.create({value: 'SCRIPT', isActive: false, icon: 'glyphicon glyphicon-code'}),
-    Em.Object.create({value: 'SERVER', isActive: false, icon: 'glyphicon glyphicon-desktop'}),
-    Em.Object.create({value: 'RECOVERY', isActive: false, icon: 'glyphicon glyphicon-desktop'})
-  ],
-
-  /**
-   * "Next"-button is disabled if user doesn't select any alert definition type
-   * @type {boolean}
-   */
-  isSubmitDisabled: Em.computed.everyBy('alertDefinitionsTypes', 'isActive', false),
+  alertDefinitionsTypes: function () {
+    return App.AlertType.find().map(function(option) {
+      return Em.Object.create({
+        name: option.get('name'),
+        displayName: option.get('displayName'),
+        icon: option.get('iconPath'),
+        description: option.get('description')
+      });
+    });
+  }.property(),
 
   /**
    * Set selectedType if it exists in the wizard controller
    * @method loadStep
    */
   loadStep: function() {
-    this.get('alertDefinitionsTypes').setEach('isActive', false);
-    var selectedType = this.get('content.selectedType');
-    if(selectedType) {
-      this.selectType({context: {value: selectedType}});
-    }
+    this.set('content.selectedType', '');
   },
 
   /**
@@ -61,10 +52,10 @@ App.AddAlertDefinitionStep1Controller = Em.Controller.extend({
    */
   selectType: function(e) {
     var type = e.context,
-      types = this.get('alertDefinitionsTypes');
-    types.setEach('isActive', false);
-    types.findProperty('value', type.value).set('isActive', true);
-    this.set('content.selectedType', type.value);
+        types = this.get('alertDefinitionsTypes');
+    this.set('content.selectedType', type.name);
+    $("[rel='selectable-tooltip']").trigger('mouseleave');
+    App.router.send('next');
   }
 
 });

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/controllers/main/alerts/definition_configs_controller.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/controllers/main/alerts/definition_configs_controller.js b/ambari-web/app/controllers/main/alerts/definition_configs_controller.js
index 4c82556..138aaa4 100644
--- a/ambari-web/app/controllers/main/alerts/definition_configs_controller.js
+++ b/ambari-web/app/controllers/main/alerts/definition_configs_controller.js
@@ -225,7 +225,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
     var result = [];
     var alertDefinition = this.get('content');
     var isWizard = this.get('isWizard');
-    var units = this.get('content.reporting').findProperty('type','units') ?
+    var units = this.get('content.reporting') && this.get('content.reporting').findProperty('type','units')
?
       this.get('content.reporting').findProperty('type','units').get('text'): null;
 
     if (this.get('isWizard')) {
@@ -256,7 +256,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
         value: isWizard ? '' : this.getThresholdsProperty('critical', 'value')
       }),
       App.AlertConfigProperties.Parameter.create({
-        value: alertDefinition.get('uri.connectionTimeout'),
+        value: isWizard ? '': alertDefinition.get('uri.connectionTimeout'),
         threshold: "CRITICAL",
         name: 'connection_timeout',
         label: 'Connection Timeout',
@@ -311,7 +311,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
         value: isWizard ? '' : this.getThresholdsProperty('critical', 'value')
       }),
       App.AlertConfigProperties.Parameter.create({
-        value: alertDefinition.get('uri.connectionTimeout'),
+        value: isWizard ? '': alertDefinition.get('uri.connectionTimeout'),
         threshold: "CRITICAL",
         name: 'connection_timeout',
         label: 'Connection Timeout',
@@ -404,7 +404,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
         valueMetric: units
       }),
       App.AlertConfigProperties.Parameter.create({
-        value: alertDefinition.get('uri.connectionTimeout'),
+        value: isWizard ? '': alertDefinition.get('uri.connectionTimeout'),
         name: 'connection_timeout',
         label: 'Connection Timeout',
         displayType: 'parameter',
@@ -447,20 +447,22 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
       NUMERIC: App.AlertConfigProperties.Parameters.NumericMixin,
       PERCENT: App.AlertConfigProperties.Parameters.PercentageMixin
     };
-    alertDefinition.get('parameters').forEach(function (parameter) {
-      var mixin = mixins[parameter.get('type')] || {}; // validation depends on parameter-type
-      result.push(App.AlertConfigProperties.Parameter.create(mixin, {
-        value: isWizard ? '' : parameter.get('value'),
-        apiProperty: parameter.get('name'),
-        description: parameter.get('description'),
-        label: isWizard ? '' : parameter.get('displayName'),
-        threshold: isWizard ? '' : parameter.get('threshold'),
-        units: isWizard ? '' : parameter.get('units'),
-        type: isWizard ? '' : parameter.get('type'),
-        hidden: parameter.get('visibility') === "HIDDEN",
-        readonly: parameter.get('visibility') === "READ_ONLY"
-      }));
-    });
+    if (alertDefinition) {
+      alertDefinition.get('parameters').forEach(function (parameter) {
+        var mixin = mixins[parameter.get('type')] || {}; // validation depends on parameter-type
+        result.push(App.AlertConfigProperties.Parameter.create(mixin, {
+          value: isWizard ? '' : parameter.get('value'),
+          apiProperty: parameter.get('name'),
+          description: parameter.get('description'),
+          label: isWizard ? '' : parameter.get('displayName'),
+          threshold: isWizard ? '' : parameter.get('threshold'),
+          units: isWizard ? '' : parameter.get('units'),
+          type: isWizard ? '' : parameter.get('type'),
+          hidden: parameter.get('visibility') === "HIDDEN",
+          readonly: parameter.get('visibility') === "READ_ONLY"
+        }));
+      });
+    }
 
     return result;
   },
@@ -473,7 +475,7 @@ App.MainAlertDefinitionConfigsController = Em.Controller.extend({
   renderAggregateConfigs: function () {
     var isWizard = this.get('isWizard');
     var alertDefinition = this.get('content');
-    var units = this.get('content.reporting').findProperty('type','units') ?
+    var units = this.get('content.reporting') && this.get('content.reporting').findProperty('type','units')
?
         this.get('content.reporting').findProperty('type','units').get('text'): null;
     return [
       App.AlertConfigProperties.Description.create({

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/messages.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js
index 7ba19db..aa4e2aa 100644
--- a/ambari-web/app/messages.js
+++ b/ambari-web/app/messages.js
@@ -1073,12 +1073,21 @@ Em.I18n.translations = {
   'form.validator.alertNotificationName':'Invalid Alert Notification Name. Only alphanumerics,
hyphens, spaces and underscores are allowed.',
   'form.validator.configKey.specific':'"{0}" is invalid Key. Only alphanumerics, hyphens,
underscores, asterisks and periods are allowed.',
 
-  'alerts.add.header': 'Create Alert Definition',
-  'alerts.add.step1.header': 'Choose Type',
-  'alerts.add.step2.header': 'Configure',
-  'alerts.add.step3.header': 'Review',
+  'alerts.add.header': 'Create Alert',
+  'alerts.add.step1.header': 'Choose Alert Type',
+  'alerts.add.step1.header.description': 'Select the type of alert you want to create',
+  'alerts.add.step2.header': 'Define Alert',
+  'alerts.add.step3.header': 'Specify Threshold',
   'alerts.add.step3.selectedType': 'Selected Type',
 
+  'alerts.add.wizard.step1.body.choose.tooltip': 'Click to select',
+  'alerts.add.wizard.step1.body.port.description':'Check TCP connectivity to a remote endpoint',
+  'alerts.add.wizard.step1.body.web.description':'Check for TCP connectivity and verify that
a proper HTTP response code was returned',
+  'alerts.add.wizard.step1.body.metric.description':'Define JMX/AMS endpoints that can be
queried for values',
+  'alerts.add.wizard.step1.body.script.description':'Defer all functionality to a Python
script accessible to the Ambari agents from a specified relative or absolute path',
+  'alerts.add.wizard.step1.body.aggregate.description':'Combine the results of another alert
definition from different nodes',
+  'alerts.add.wizard.step1.body.raw.description':'User can upload alert parameter using a
JSON script',
+
   'alerts.fastAccess.popup.header': '{0} Critical or Warning Alerts',
   'alerts.fastAccess.popup.body.name': 'Alert Definition Name',
   'alerts.fastAccess.popup.body.showmore': 'Go to Alerts Definitions',

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/models/alerts/alert_definition.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/models/alerts/alert_definition.js b/ambari-web/app/models/alerts/alert_definition.js
index a3c8850..5d61112 100644
--- a/ambari-web/app/models/alerts/alert_definition.js
+++ b/ambari-web/app/models/alerts/alert_definition.js
@@ -325,3 +325,57 @@ App.AlertMetricsSourceDefinition.FIXTURES = [];
 App.AlertMetricsUriDefinition.FIXTURES = [];
 App.AlertMetricsAmsDefinition.FIXTURES = [];
 App.AlertDefinitionParameter.FIXTURES = [];
+
+
+App.AlertType = DS.Model.extend({
+  name: DS.attr('string'),
+  displayName: DS.attr('string'),
+  iconPath: DS.attr('string'),
+  description: DS.attr('string'),
+  properties: DS.attr('array')
+});
+
+App.AlertType.FIXTURES = [
+  {
+    id: 'PORT',
+    name: 'PORT',
+    icon_path: 'glyphicon glyphicon-log-in',
+    display_name: 'Port',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.port.description')
+  },
+  {
+    id: 'WEB',
+    name: 'WEB',
+    icon_path: 'glyphicon glyphicon-globe',
+    display_name: 'Web',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.web.description')
+  },
+  {
+    id: 'METRIC',
+    name: 'METRIC',
+    display_name: 'Metric',
+    icon_path: 'glyphicon glyphicon-flash',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.metric.description')
+  },
+  {
+    id: 'SCRIPT',
+    name: 'SCRIPT',
+    icon_path: 'glyphicon glyphicon-file',
+    display_name: 'Script',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.script.description')
+  },
+  {
+    id: 'AGGREGATE',
+    name: 'AGGREGATE',
+    icon_path: 'glyphicon glyphicon-plus',
+    display_name: 'Aggregate',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.aggregate.description')
+  },
+  {
+    id: 'RAW',
+    name: 'RAW',
+    icon_path: 'glyphicon glyphicon-align-justify',
+    display_name: 'Raw',
+    description: Em.I18n.t('alerts.add.wizard.step1.body.raw.description')
+  }
+];

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/styles/alerts.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/alerts.less b/ambari-web/app/styles/alerts.less
index f12393d..bf3eaf3 100644
--- a/ambari-web/app/styles/alerts.less
+++ b/ambari-web/app/styles/alerts.less
@@ -581,3 +581,63 @@
     margin: 7px;
   }
 }
+
+/***** Start styles for alert create wizard *****/
+#create-alert-wizard-step1 {
+  .alert-types-container {
+    padding: 10px 15px;
+    .alert-type {
+      height: 150px;
+      width: 32%;
+      margin: 5px;
+      padding: 10px;
+      background: white;
+    }
+    .alert-type:hover {
+      cursor: pointer;
+    }
+    .icon {
+      .glyphicon {
+        font-size: 35px;
+        line-height: 3.5;
+      }
+    }
+    .icon.PORT {
+      color: #F6D955;
+    }
+    .icon.WEB {
+      color: #9ADCD4;
+    }
+    .icon.METRIC {
+      color: #F69F79;
+    }
+    .icon.SCRIPT {
+      color: #F2C2AA;
+    }
+    .icon.AGGREGATE {
+      color: #8AD4C7;
+    }
+    .icon.RAW {
+      color: #C9A6B2;
+    }
+    .label-description {
+      padding-top: 10px;
+      .label-text {
+        font-size: 14px;
+        font-weight: bold;
+        margin-bottom: 5px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .description-text {
+        font-size: 12px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+}
+
+/***** End styles for alert create wizard *****/
+

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/templates/main/alerts/add_alert_definition/step1.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/alerts/add_alert_definition/step1.hbs b/ambari-web/app/templates/main/alerts/add_alert_definition/step1.hbs
index ee61648..6617164 100644
--- a/ambari-web/app/templates/main/alerts/add_alert_definition/step1.hbs
+++ b/ambari-web/app/templates/main/alerts/add_alert_definition/step1.hbs
@@ -16,20 +16,22 @@
 * limitations under the License.
 }}
 
-<div class="wizard-content col-md-9">
+<div id="create-alert-wizard-step1" class="wizard-content col-md-9">
   <h4 class="step-title">{{t alerts.add.step1.header}}</h4>
-  <div class="panel panel-default">
-    <div class="panel-body">
-    {{#each type in controller.alertDefinitionsTypes}}
-        <a href="#" {{bindAttr class=":btn type.isActive:active"}} {{action selectType
type target="controller"}}>
-            <span {{bindAttr class="type.icon"}}></span> {{type.value}}
-        </a>
-    {{/each}}
+  <p class="step-description">{{t alerts.add.step1.header.description}}</p>
+    <div class="alert-types-container row">
+      {{#each type in controller.alertDefinitionsTypes}}
+        <div class="col-md-4 row alert-type" rel="selectable-tooltip"
+          {{translateAttr data-original-title="alerts.add.wizard.step1.body.choose.tooltip"}}
+          {{action "selectType" type target="controller"}}>
+          <div {{bindAttr class="type.name :icon :col-md-3"}}>
+            <span {{bindAttr class="type.icon"}}></span>
+          </div>
+          <div class="label-description col-md-9">
+            <p class="label-text">{{type.displayName}}</p>
+            <p class="description-text">{{type.description}}</p>
+          </div>
+        </div>
+      {{/each}}
     </div>
-  </div>
-</div>
-<div class="wizard-footer col-md-12">
-  <div class="btn-area">
-    <a class="btn btn-success pull-right" {{bindAttr disabled="isSubmitDisabled"}} {{action
next}}>{{t common.next}} &rarr;</a>
-  </div>
 </div>

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/app/views/main/alerts/add_alert_definition/step1_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/alerts/add_alert_definition/step1_view.js b/ambari-web/app/views/main/alerts/add_alert_definition/step1_view.js
index d55d20f..398d721 100644
--- a/ambari-web/app/views/main/alerts/add_alert_definition/step1_view.js
+++ b/ambari-web/app/views/main/alerts/add_alert_definition/step1_view.js
@@ -24,6 +24,9 @@ App.AddAlertDefinitionStep1View = Em.View.extend({
 
   didInsertElement: function() {
     this.get('controller').loadStep();
+    Em.run.later(this, function () {
+      App.tooltip($("[rel='selectable-tooltip']"));
+    }, 300);
   }
 
 });

http://git-wip-us.apache.org/repos/asf/ambari/blob/31ce5f7d/ambari-web/test/controllers/main/alerts/add_alert_definition/step1_controller_test.js
----------------------------------------------------------------------
diff --git a/ambari-web/test/controllers/main/alerts/add_alert_definition/step1_controller_test.js
b/ambari-web/test/controllers/main/alerts/add_alert_definition/step1_controller_test.js
index 322c08a..7d19239 100644
--- a/ambari-web/test/controllers/main/alerts/add_alert_definition/step1_controller_test.js
+++ b/ambari-web/test/controllers/main/alerts/add_alert_definition/step1_controller_test.js
@@ -30,13 +30,13 @@ describe('App.AddAlertDefinitionStep1Controller', function () {
   describe('#selectType', function() {
 
     beforeEach(function () {
-      controller.get('alertDefinitionsTypes').setEach('isActive', false);
+      controller.get('content').set('selectedType', '');
     });
 
     it('should set isActive for selected type', function () {
       var e = {context: {value: 'PORT'}};
       controller.selectType(e);
-      expect(controller.get('alertDefinitionsTypes').findProperty('value', 'PORT').get('isActive')).to.be.true;
+      expect(controller.get('content.selectedType')).to.equal('PORT');
     });
 
   });
@@ -45,30 +45,12 @@ describe('App.AddAlertDefinitionStep1Controller', function () {
 
     beforeEach(function () {
       controller.set('content.selectedType', 'PORT');
-
     });
 
     it('should set predefined type', function () {
       controller.loadStep();
-      expect(controller.get('alertDefinitionsTypes').findProperty('value', 'PORT').get('isActive')).to.be.true;
-    });
-
-  });
-
-  describe('#isSubmitDisabled', function () {
-
-    beforeEach(function () {
-      controller.get('alertDefinitionsTypes').setEach('isActive', false);
-    });
-
-    it('should be based on isActive', function () {
-
-      expect(controller.get('isSubmitDisabled')).to.be.true;
-      controller.get('alertDefinitionsTypes').objectAt(0).set('isActive', true);
-      expect(controller.get('isSubmitDisabled')).to.be.false;
-
+      expect(controller.get('content.selectedType').to.equal(''));
     });
 
   });
-
 });
\ No newline at end of file


Mime
View raw message