Skip to content
This repository has been archived by the owner on May 7, 2020. It is now read-only.

Basic UI: several fix for selection and switch with mappings #3368

Merged
merged 1 commit into from
May 5, 2017
Merged

Basic UI: several fix for selection and switch with mappings #3368

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions extensions/ui/org.eclipse.smarthome.ui.basic/snippets/buttons.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,17 @@
<span class="mdl-form__icon">
<img data-icon="%category%" src="../icon/%category%?state=%state%&format=%icon_type%" />
</span>
<span class="mdl-form__label">
<span %labelstyle% class="mdl-form__label">
%label%
</span>
<span class="mdl-form__value mdl-form__value--group">
<span %valuestyle% class="mdl-form__value mdl-form__value--group">
%value%
</span>
<div
class="mdl-form__control mdl-form__buttons"
data-control-type="buttons"
data-item="%item%"
data-has-value="%has_value%"
data-count="%count%"
data-widget-id="%widget_id%"
>
Expand Down
4 changes: 2 additions & 2 deletions extensions/ui/org.eclipse.smarthome.ui.basic/snippets/selection.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
<span class="mdl-form__icon">
<img data-icon="%category%" src="../icon/%category%?state=%state%&format=%icon_type%" />
</span>
<span class="mdl-form__label">
<span %labelstyle% class="mdl-form__label">
%label_header%
</span>
<span class="mdl-form__value">
<span %valuestyle% class="mdl-form__value">
%value_header%
</span>
<div
Expand Down
35 changes: 25 additions & 10 deletions extensions/ui/org.eclipse.smarthome.ui.basic/web-src/smarthome.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -455,8 +455,10 @@
var
_t = this;

_t.value = _t.parentNode.querySelector(o.formValue);
_t.hasValue = _t.parentNode.getAttribute("data-has-value") === "true";
_t.value = _t.parentNode.parentNode.querySelector(o.formValue);
_t.count = _t.parentNode.getAttribute("data-count") * 1;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[3] For example, _t.suppressReset = false here.

_t.suppressUpdateButtons = false;
_t.reset = function() {
_t.buttons.forEach(function(button) {
button.classList.remove(o.buttonActiveClass);
Expand All @@ -478,28 +480,37 @@
item: _t.item,
value: value
}));
_t.suppressUpdate();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[1] I understand that you need to obtain some properties from server so you don't want to suppress the callback entirely...

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[6] _t.suppressReset = true

_t.suppressUpdateButtons = true;
};
_t.valueMap = {};
_t.buttons = [].slice.call(_t.parentNode.querySelectorAll(o.controlButton));
_t.setValuePrivate = function(value) {
if (_t.value !== null) {
_t.setValuePrivate = function(value, itemState) {
if (_t.value !== null && _t.hasValue) {
_t.value.innerHTML = value;
}

if (_t.count === 1) {
return;
}

if (_t.suppressUpdateButtons) {
_t.suppressUpdateButtons = false;
return;
}

_t.reset();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[2] ...but could you please implement another way to suppress the useless call to reset()?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[4]

if (_t.suppressReset) {
	_t.suppressReset = false;
	return;
} else {
	_t.reset();
}

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[5] This has to do with animations and avoiding touching DOM too much

if (
(_t.valueMap !== undefined) &&
(_t.valueMap[value] !== undefined)
(_t.valueMap[itemState] !== undefined)
) {
_t.valueMap[value].classList.add(o.buttonActiveClass);
_t.valueMap[itemState].classList.add(o.buttonActiveClass);
}
};

_t.setValueColor = function(color) {
_t.value.style.color = color;
};

_t.buttons.forEach.call(_t.buttons, function(button) {
var
value = button.getAttribute("data-value") + "";
Expand Down Expand Up @@ -575,15 +586,19 @@
});
};

_t.setValuePrivate = function(value) {
_t.value = "" + value;
if (_t.valueMap[value] !== undefined) {
_t.valueNode.innerHTML = _t.valueMap[value];
_t.setValuePrivate = function(value, itemState) {
_t.value = "" + itemState;
if (_t.valueMap[itemState] !== undefined) {
_t.valueNode.innerHTML = _t.valueMap[itemState];
} else {
_t.valueNode.innerHTML = "";
}
};

_t.setValueColor = function(color) {
_t.valueNode.style.color = color;
};

_t.parentNode.parentNode.addEventListener("click", _t.showModal);
}

Expand Down
Loading