You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by sr...@apache.org on 2015/04/03 00:26:16 UTC
ambari git commit: AMBARI-10337. Slider widget should implement
'default' clickable marker (Buzhor Denys via srimanth)
Repository: ambari
Updated Branches:
refs/heads/trunk 23faabc4a -> 3e07f0af3
AMBARI-10337. Slider widget should implement 'default' clickable marker (Buzhor Denys via srimanth)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/3e07f0af
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/3e07f0af
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/3e07f0af
Branch: refs/heads/trunk
Commit: 3e07f0af3f248d90c3e511ff6dff01efd3c96d75
Parents: 23faabc
Author: Srimanth Gunturi <sg...@hortonworks.com>
Authored: Thu Apr 2 15:20:58 2015 -0700
Committer: Srimanth Gunturi <sg...@hortonworks.com>
Committed: Thu Apr 2 15:21:09 2015 -0700
----------------------------------------------------------------------
ambari-web/app/styles/widgets.less | 25 +++++++++++
.../widgets/slider_config_widget_view.js | 46 +++++++++++++++++++-
2 files changed, 69 insertions(+), 2 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/3e07f0af/ambari-web/app/styles/widgets.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/widgets.less b/ambari-web/app/styles/widgets.less
index ac5b45e..1e22d0c 100644
--- a/ambari-web/app/styles/widgets.less
+++ b/ambari-web/app/styles/widgets.less
@@ -64,6 +64,24 @@
&:nth-of-type(1):before {
content: '$$$' !important;
}
+ &.slider-tick-default {
+ &:after {
+ content: "default";
+ width: 0;
+ height: 0;
+ display: block;
+ position: absolute;
+ left: -2px;
+ top: 14px;
+ border-style: solid;
+ border-width: 0 3px 6px 3px;
+ border-color: transparent transparent #5bb75b transparent;
+ color: #d1d1d1;
+ font-size: 10px;
+ text-indent: -14px;
+ line-height: 25px;
+ }
+ }
}
.slider-handle {
margin-top: -2px !important;
@@ -74,9 +92,16 @@
background-image: radial-gradient(#aaa 5px, #eee 5px) !important;
border: 1px solid @slider-widget-border-color;
}
+ .slider-tick-label-container {
+ margin-top: 5px;
+ }
.slider-tick-label {
color: #aaa;
font-size: 10px;
+ .slider-tick-reset-label {
+ color: #d7d7d7;
+ margin-left: 6px;
+ }
}
.slider-selection {
background-image: none;
http://git-wip-us.apache.org/repos/asf/ambari/blob/3e07f0af/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 472d38c..cbabae8 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
@@ -171,18 +171,42 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({
unit = Em.getWithDefault(valueAttributes, 'unit', ''),
parseFunction = this.get('parseFunction'),
ticks = [valueAttributes.minimum],
- ticksLabels = [];
+ ticksLabels = [],
+ defaultValue = this.valueForTick(+config.get('defaultValue')),
+ defaultValueMirroredId,
+ defaultValueId;
// ticks and labels
for (var i = 1; i <= 3; i++) {
var val = (valueAttributes.minimum + valueAttributes.maximum) / 4 * i;
// if value's type is float, ticks may be float too
- ticks.push(valueAttributes.type === 'int' ? Math.round(val) : parseFloat(val.toFixed(1)));
+ ticks.push(this.valueForTick(val));
}
ticks.push(valueAttributes.maximum);
ticks.forEach(function (tick, index) {
ticksLabels.push(index % 2 === 0 ? tick + ' ' + unit : '');
});
+ // process additional tick for default value if it not defined in previous computation
+ if (!ticks.contains(defaultValue)) {
+ // push default value
+ ticks.push(defaultValue);
+ // and resort array
+ ticks = ticks.sort(function(a,b) { return a-b; });
+ defaultValueId = ticks.indexOf(defaultValue);
+ // to save nice tick labels layout we should add new tick value which is mirrored by index to default value
+ defaultValueMirroredId = ticks.length - defaultValueId;
+ // push empty label for default value tick
+ ticksLabels.insertAt(defaultValueId, '');
+ // push empty to mirrored position
+ ticksLabels.insertAt(defaultValueMirroredId, '');
+ // for saving correct sliding need to add value to mirrored position which is average between previous
+ // and next value
+ ticks.insertAt(defaultValueMirroredId, (ticks[defaultValueMirroredId] + ticks[defaultValueMirroredId - 1])/2);
+ // get new index for default value
+ defaultValueId = ticks.indexOf(defaultValue);
+ } else {
+ defaultValueId = ticks.indexOf(defaultValue);
+ }
var slider = new Slider(this.$('input.slider-input')[0], {
value: parseFunction(this.get('config.value')),
@@ -206,12 +230,30 @@ App.SliderConfigWidgetView = App.ConfigWidgetView.extend({
self.sendRequestRorDependentConfigs(self.get('config'));
});
+ this.$('.slider-track .slider-tick.round:eq({0})'.format(defaultValueId)).addClass('slider-tick-default').on('click', function() {
+ self.restoreValue();
+ });
+ // if mirrored value was added need to hide the tick for it
+ if (defaultValueMirroredId) {
+ this.$('.slider-tick:eq({0})'.format(defaultValueMirroredId)).hide();
+ }
this.set('slider', slider);
// hide some ticks. can't do this via css
this.$('.slider-tick:first, .slider-tick:last').hide();
},
/**
+ * Convert value according to property attribute unit.
+ *
+ * @method valueForTick
+ * @param {Number}
+ * @returns {Number}
+ */
+ valueForTick: function(val) {
+ return this.get('config.stackConfigProperty.valueAttributes').type === 'int' ? Math.round(val) : parseFloat(val.toFixed(1));
+ },
+
+ /**
* Restore <code>defaultValue</code> for config
* Restore <code>mirrorValue</code> too
* @method restoreValue