Repository: ambari Updated Branches: refs/heads/trunk 7e44537bd -> ce98754d5
AMBARI-10695 Slider widget default/recommended value keeps changing as value is changed. (ababiichuk) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/ce98754d Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/ce98754d Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/ce98754d Branch: refs/heads/trunk Commit: ce98754d5057fbcbe601c9a7aab4727d3b6169fc Parents: 7e44537 Author: aBabiichuk <[email protected]> Authored: Thu Apr 23 15:26:29 2015 +0300 Committer: aBabiichuk <[email protected]> Committed: Thu Apr 23 15:26:29 2015 +0300 ---------------------------------------------------------------------- .../mixins/common/configs/enhanced_configs.js | 10 +++ ambari-web/app/models/service_config.js | 7 ++ ambari-web/app/utils/config.js | 1 + .../widgets/slider_config_widget_view.js | 72 ++++++++++++-------- .../widgets/slider_config_widget_view_test.js | 16 ++--- 5 files changed, 70 insertions(+), 36 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/ce98754d/ambari-web/app/mixins/common/configs/enhanced_configs.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/mixins/common/configs/enhanced_configs.js b/ambari-web/app/mixins/common/configs/enhanced_configs.js index 83edf45..7c78d0f 100644 --- a/ambari-web/app/mixins/common/configs/enhanced_configs.js +++ b/ambari-web/app/mixins/common/configs/enhanced_configs.js @@ -428,6 +428,16 @@ App.EnhancedConfigsMixin = Em.Mixin.create({ } /** + * saving recommended value to service config properties + * this value can be used as marker on slider widget + */ + if (notDefaultGroup) { + override && override.set('recommendedValue', recommendedValue); + } else { + cp && cp.set('recommendedValue', recommendedValue); + } + + /** * clear _dependentPropertyValues from * properties that wasn't changed while recommendations */ http://git-wip-us.apache.org/repos/asf/ambari/blob/ce98754d/ambari-web/app/models/service_config.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/models/service_config.js b/ambari-web/app/models/service_config.js index 3af1b10..c47812c 100644 --- a/ambari-web/app/models/service_config.js +++ b/ambari-web/app/models/service_config.js @@ -211,6 +211,13 @@ App.ServiceConfigProperty = Em.Object.extend({ hasInitialValue: false, //if true then property value is defined and saved to server isHiddenByFilter: false, //if true then hide this property (filtered out) rowStyleClass: null, // CSS-Class to be applied on the row showing this config + + /** + * value that is returned from server as recommended + * @type {String} + */ + recommendedValue: '', + /** * Usage example see on <code>App.ServiceConfigRadioButtons.handleDBConnectionProperty()</code> * http://git-wip-us.apache.org/repos/asf/ambari/blob/ce98754d/ambari-web/app/utils/config.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/utils/config.js b/ambari-web/app/utils/config.js index e3d784b..54a4609 100644 --- a/ambari-web/app/utils/config.js +++ b/ambari-web/app/utils/config.js @@ -735,6 +735,7 @@ App.config = Em.Object.create({ recommendedDefaults[name] = defaults[name]; config.set('value', defaults[name]); config.set('defaultValue', defaults[name]); + config.set('recommendedValue', defaults[name]); } }); } http://git-wip-us.apache.org/repos/asf/ambari/blob/ce98754d/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js b/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js index 35ea78d..eb7e313 100644 --- a/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js +++ b/ambari-web/app/views/common/configs/widgets/slider_config_widget_view.js @@ -95,6 +95,15 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({ }.property('config.defaultValue'), /** + * Default value of config property transformed according widget format + * @returns {Number} + */ + widgetRecommendedValue: function() { + var parseFunction = this.get('mirrorValueParseFunction'); + return parseFunction(this.widgetValueByConfigAttributes(this.get('config.recommendedValue'))); + }.property('config.recommendedValue'), + + /** * unit type of widget * @type {String} */ @@ -161,12 +170,14 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({ this.toggleWidgetState(); this.initPopover(); this.addObserver('maxMirrorValue', this, this.changeBoundaries); + this.addObserver('widgetRecommendedValue', this, this.changeBoundaries); this.addObserver('minMirrorValue', this, this.changeBoundaries); this.addObserver('mirrorStep', this, this.changeBoundaries); }, willDestroyElement: function() { this.removeObserver('maxMirrorValue', this, this.changeBoundaries); + this.removeObserver('widgetRecommendedValue', this, this.changeBoundaries); this.removeObserver('minMirrorValue', this, this.changeBoundaries); this.removeObserver('mirrorStep', this, this.changeBoundaries); }, @@ -241,12 +252,12 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({ parseFunction = this.get('parseFunction'), ticks = [this.get('minMirrorValue')], ticksLabels = [], - defaultValue = this.valueForTick(+this.get('widgetDefaultValue')), + recommendedValue = this.valueForTick(+this.get('widgetRecommendedValue')), range = this.get('maxMirrorValue') - this.get('minMirrorValue'), // for little odd numbers in range 4..23 and widget type 'int' use always 4 ticks isSmallInt = this.get('unitType') == 'int' && range > 4 && range < 23 && range % 2 == 1, - defaultValueMirroredId, - defaultValueId; + recommendedValueMirroredId, + recommendedValueId; // ticks and labels for (var i = 1; i <= 3; i++) { @@ -262,33 +273,33 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({ }); // default-value marker should be added only if defaultValue is in range [min, max] - if (defaultValue <= this.get('maxMirrorValue') && defaultValue >= this.get('minMirrorValue')) { + if (recommendedValue <= this.get('maxMirrorValue') && recommendedValue >= this.get('minMirrorValue') && recommendedValue != '') { // process additional tick for default value if it not defined in previous computation - if (!ticks.contains(defaultValue)) { + if (!ticks.contains(recommendedValue)) { // push default value - ticks.push(defaultValue); + ticks.push(recommendedValue); // and resort array ticks = ticks.sort(function (a, b) { return a - b; }); - defaultValueId = ticks.indexOf(defaultValue); + recommendedValueId = ticks.indexOf(recommendedValue); // to save nice tick labels layout we should add new tick value which is mirrored by index to default value - defaultValueMirroredId = ticks.length - defaultValueId; + recommendedValueMirroredId = ticks.length - recommendedValueId; // push mirrored default value behind default - if (defaultValueId == defaultValueMirroredId) { - defaultValueMirroredId--; + if (recommendedValueId == recommendedValueMirroredId) { + recommendedValueMirroredId--; } // push empty label for default value tick - ticksLabels.insertAt(defaultValueId, ''); + ticksLabels.insertAt(recommendedValueId, ''); // push empty to mirrored position - ticksLabels.insertAt(defaultValueMirroredId, ''); + ticksLabels.insertAt(recommendedValueMirroredId, ''); // for saving correct sliding need to add value to mirrored position which is average between previous // and next value - ticks.insertAt(defaultValueMirroredId, this.valueForTick((ticks[defaultValueMirroredId] + ticks[defaultValueMirroredId - 1]) / 2)); + ticks.insertAt(recommendedValueMirroredId, this.valueForTick((ticks[recommendedValueMirroredId] + ticks[recommendedValueMirroredId - 1]) / 2)); // get new index for default value - defaultValueId = ticks.indexOf(defaultValue); + recommendedValueId = ticks.indexOf(recommendedValue); } else { - defaultValueId = ticks.indexOf(defaultValue); + recommendedValueId = ticks.indexOf(recommendedValue); } } var slider = new Slider(this.$('input.slider-input')[0], { @@ -314,20 +325,25 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({ }); this.set('slider', slider); var sliderTicks = this.$('.ui-slider-wrapper:eq(0) .slider-tick'); - var defaultSliderTick = sliderTicks.eq(defaultValueId); - sliderTicks.eq(defaultValueId).addClass('slider-tick-default').on('mousedown', function(e) { - if (self.get('disabled')) return false; - self.restoreValue(); - e.stopPropagation(); - return false; - }); - // create label for default value and align it - defaultSliderTick.append('<span>{0}</span>'.format(defaultValue + this.get('unitLabel'))); - defaultSliderTick.find('span').css('marginLeft', -defaultSliderTick.find('span').width()/2 + 'px'); - // if mirrored value was added need to hide the tick for it - if (defaultValueMirroredId) { - sliderTicks.eq(defaultValueMirroredId).hide(); + if (recommendedValueId) { + var defaultSliderTick = sliderTicks.eq(recommendedValueId); + + sliderTicks.eq(recommendedValueId).addClass('slider-tick-default').on('mousedown', function(e) { + if (self.get('disabled')) return false; + self.setValue(self.get('config.recommendedValue')); + e.stopPropagation(); + return false; + }); + // create label for default value and align it + + defaultSliderTick.append('<span>{0}</span>'.format(recommendedValueId + this.get('unitLabel'))); + defaultSliderTick.find('span').css('marginLeft', -defaultSliderTick.find('span').width()/2 + 'px'); + + // if mirrored value was added need to hide the tick for it + if (recommendedValueMirroredId) { + sliderTicks.eq(recommendedValueMirroredId).hide(); + } } // mark last tick to fix it style sliderTicks.last().addClass('last'); http://git-wip-us.apache.org/repos/asf/ambari/blob/ce98754d/ambari-web/test/views/common/configs/widgets/slider_config_widget_view_test.js ---------------------------------------------------------------------- diff --git a/ambari-web/test/views/common/configs/widgets/slider_config_widget_view_test.js b/ambari-web/test/views/common/configs/widgets/slider_config_widget_view_test.js index 2a04136..a1096d6 100644 --- a/ambari-web/test/views/common/configs/widgets/slider_config_widget_view_test.js +++ b/ambari-web/test/views/common/configs/widgets/slider_config_widget_view_test.js @@ -193,7 +193,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 20, maxMirrorValue: 100, - widgetDefaultValue: 30, + widgetRecommendedValue: 30, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'float' }, @@ -210,7 +210,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 5, maxMirrorValue: 50, - widgetDefaultValue: 35, + widgetRecommendedValue: 35, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int' }, @@ -227,7 +227,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 1, maxMirrorValue: 2, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 }, @@ -244,7 +244,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 1, maxMirrorValue: 3, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 }, @@ -261,7 +261,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 0, maxMirrorValue: 3, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 }, @@ -278,7 +278,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 1, maxMirrorValue: 5, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 }, @@ -295,7 +295,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 0, maxMirrorValue: 5, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 }, @@ -312,7 +312,7 @@ describe('App.SliderConfigWidgetView', function () { viewSetup: { minMirrorValue: 0, maxMirrorValue: 23, - widgetDefaultValue: 2, + widgetRecommendedValue: 2, config: Em.Object.create({ stackConfigProperty: Em.Object.create({ valueAttributes: { type: 'int', increment_step: 1 },
