You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by on...@apache.org on 2015/04/16 19:18:08 UTC
ambari git commit: AMBARI-10541. Toggle config entries chopped off
and need color changes (onechiporenko)
Repository: ambari
Updated Branches:
refs/heads/trunk abb2fa1d5 -> cb9fd8e3c
AMBARI-10541. Toggle config entries chopped off and need color changes (onechiporenko)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/cb9fd8e3
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/cb9fd8e3
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/cb9fd8e3
Branch: refs/heads/trunk
Commit: cb9fd8e3c44b05d808b15c9cf206a6e2ccc06f60
Parents: abb2fa1
Author: Oleg Nechiporenko <on...@apache.org>
Authored: Thu Apr 16 20:15:09 2015 +0300
Committer: Oleg Nechiporenko <on...@apache.org>
Committed: Thu Apr 16 20:15:09 2015 +0300
----------------------------------------------------------------------
ambari-web/app/mappers/configs/themes_mapper.js | 1 +
ambari-web/app/styles/widgets.less | 47 ++++++++++++++++++++
.../common/configs/widgets/controls.hbs | 2 +-
.../widgets/toggle_config_widget_view.js | 25 ++++++++++-
4 files changed, 72 insertions(+), 3 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/cb9fd8e3/ambari-web/app/mappers/configs/themes_mapper.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/mappers/configs/themes_mapper.js b/ambari-web/app/mappers/configs/themes_mapper.js
index 7fde958..978d7e3 100644
--- a/ambari-web/app/mappers/configs/themes_mapper.js
+++ b/ambari-web/app/mappers/configs/themes_mapper.js
@@ -67,6 +67,7 @@ App.themesMapper = App.QuickDataMapper.create({
}, this);
App.store.loadMany(this.get("tabModel"), tabs);
+ App.store.commit();
},
/**
http://git-wip-us.apache.org/repos/asf/ambari/blob/cb9fd8e3/ambari-web/app/styles/widgets.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/widgets.less b/ambari-web/app/styles/widgets.less
index 4af4e31..c052bd2 100644
--- a/ambari-web/app/styles/widgets.less
+++ b/ambari-web/app/styles/widgets.less
@@ -35,6 +35,11 @@
@slider-widget-disabled-selection-background-color: lighten(@slider-widget-selection-background-color, 20%);
@widget-config-override-action-color: #cbcbcb;
@widget-config-override-action-active-color: #acacac;
+@toggle-widget-handle-background-color: #f3f3f3;
+@toggle-widget-text-color: #fff;
+@toggle-widget-text-size: 12px;
+@toggle-widget-on-background-color: #aaa;
+@toggle-widget-off-background-color: @green;
.widget-config {
.widget-config {
@@ -250,6 +255,48 @@
.undo-button {
margin-left: @undo-btn-margin;
}
+
+ .bootstrap-switch {
+ &,
+ &.bootstrap-switch-focused {
+ border-color: transparent;
+ box-shadow: none;
+ }
+
+ .bootstrap-switch-label {
+ background-color: @toggle-widget-handle-background-color;
+ background-image: none;
+ text-shadow: none;
+ border-width: 0;
+ padding: 2px 8px;
+ border-left: 1px solid transparent;
+ border-right: 1px solid transparent;
+ border-bottom: 1px solid @toggle-widget-handle-background-color;
+ }
+
+ .bootstrap-switch-handle-on,
+ .bootstrap-switch-handle-off {
+ color: @toggle-widget-text-color;
+ font-size: @toggle-widget-text-size;
+ background-image: none;
+ text-shadow: none;
+ border: none;
+ padding: 2px 0;
+
+ &:hover {
+ text-shadow: none;
+ color: @toggle-widget-text-color;
+ }
+
+ &.bootstrap-switch-default {
+ background-color: @toggle-widget-on-background-color;
+ }
+
+ &.bootstrap-switch-success {
+ background-color: @toggle-widget-off-background-color;
+ }
+ }
+ }
}
.combo-widget {
http://git-wip-us.apache.org/repos/asf/ambari/blob/cb9fd8e3/ambari-web/app/templates/common/configs/widgets/controls.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/common/configs/widgets/controls.hbs b/ambari-web/app/templates/common/configs/widgets/controls.hbs
index 955d414..3889ecc 100644
--- a/ambari-web/app/templates/common/configs/widgets/controls.hbs
+++ b/ambari-web/app/templates/common/configs/widgets/controls.hbs
@@ -48,7 +48,7 @@
{{/unless}}
{{#if view.config.isNotDefaultValue}}
{{#if view.undoAllowed}}
- <a class="btn btn-small" href="#" {{action "restoreValue" target="view"}}>
+ <a class="widget-action widget-action-undo" href="#" {{action "restoreValue" target="view"}}>
<i class="icon-undo"></i>
</a>
{{/if}}
http://git-wip-us.apache.org/repos/asf/ambari/blob/cb9fd8e3/ambari-web/app/views/common/configs/widgets/toggle_config_widget_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/configs/widgets/toggle_config_widget_view.js b/ambari-web/app/views/common/configs/widgets/toggle_config_widget_view.js
index 059257b..8c52c00 100644
--- a/ambari-web/app/views/common/configs/widgets/toggle_config_widget_view.js
+++ b/ambari-web/app/views/common/configs/widgets/toggle_config_widget_view.js
@@ -34,6 +34,14 @@ App.ToggleConfigWidgetView = App.ConfigWidgetView.extend({
switcher: null,
/**
+ * Minimum required handle width for toggle widget in pixels.
+ * @type {Number}
+ */
+ minHandleWidth: 30,
+
+ /**
+
+ /**
* Value used in the checkbox.
* <code>config.value</code> can't be used because it's string.
*
@@ -102,8 +110,9 @@ App.ToggleConfigWidgetView = App.ConfigWidgetView.extend({
var switcher = this.$("input").bootstrapSwitch({
onText: labels[0].label,
offText: labels[1].label,
- offColor: 'danger',
- handleWidth: 85,
+ offColor: 'default',
+ onColor: 'success',
+ handleWidth: self.getHandleWidth(labels.mapProperty('label.length')),
onSwitchChange: function (event, state) {
self.set('switcherValue', state);
self.get('controller').removeCurrentFromDependentList(self.get('config'));
@@ -115,6 +124,18 @@ App.ToggleConfigWidgetView = App.ConfigWidgetView.extend({
},
/**
+ * Calculate handle width by longest label.
+ *
+ * @param {String[]} labels
+ * @returns {Number}
+ */
+ getHandleWidth: function(labels) {
+ var labelWidth = Math.max.apply(null, labels) * 8;
+ return labelWidth < this.get('minHandleWidth') ? this.get('minHandleWidth') : labelWidth;
+ },
+
+
+ /**
* Restore default config value and toggle switcher.
*
* @override App.ConfigWidgetView.restoreValue