Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BasicUI] Add special handling for "none" icon #2534

Merged
merged 2 commits into from
Apr 27, 2024
Merged

[BasicUI] Add special handling for "none" icon #2534

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2a06349
[BasicUI] Add special handling for "none" icon
lolodomo Apr 14, 2024
b16694c
Special handling for none icon extended to any icon set for OH source
lolodomo Apr 25, 2024
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
17 changes: 11 additions & 6 deletions ...b.ui.basic/src/main/java/org/openhab/ui/basic/internal/render/AbstractWidgetRenderer.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,9 +63,10 @@ public abstract class AbstractWidgetRenderer implements WidgetRenderer {
private static final String ICON_SOURCE_MATERIAL = "material";
private static final String ICON_SOURCE_FRAMEWORK7 = "f7";
private static final String ICON_SET_OH_CLASSIC = "classic";
private static final String ICON_NAME_NONE = "none";
private static final String DEFAULT_ICON_SOURCE = ICON_SOURCE_OH;
private static final String DEFAULT_ICON_SET = ICON_SET_OH_CLASSIC;
private static final String DEFAULT_ICON_NAME = "none";
private static final String DEFAULT_ICON_NAME = ICON_NAME_NONE;

public static final String ICON_TYPE = "svg";

Expand Down Expand Up @@ -166,7 +167,11 @@ protected String preprocessIcon(String originalSnippet, @Nullable String icon, b
try {
switch (iconSource.toLowerCase()) {
case ICON_SOURCE_OH:
iconSnippet = getSnippet(ignoreState ? "icon_oh_no_state" : "icon_oh");
if (ICON_SET_OH_CLASSIC.equals(iconSet) && ICON_NAME_NONE.equals(iconName)) {
lolodomo marked this conversation as resolved.
Show resolved Hide resolved
iconSnippet = getSnippet("icon_none");
} else {
iconSnippet = getSnippet(ignoreState ? "icon_oh_no_state" : "icon_oh");
}
break;
case ICON_SOURCE_IF:
case ICON_SOURCE_ICONIFY:
Expand All @@ -182,10 +187,10 @@ protected String preprocessIcon(String originalSnippet, @Nullable String icon, b
break;
}
if (iconSnippet == null) {
iconSnippet = getSnippet("icon_oh_no_state");
iconSource = DEFAULT_ICON_SOURCE;
iconSet = DEFAULT_ICON_SET;
iconName = DEFAULT_ICON_NAME;
iconSnippet = getSnippet("icon_none");
iconSource = ICON_SOURCE_OH;
iconSet = ICON_SET_OH_CLASSIC;
iconName = ICON_NAME_NONE;
}
} catch (RenderException e) {
iconSnippet = "";
Expand Down
1 change: 1 addition & 0 deletions bundles/org.openhab.ui.basic/src/main/resources/snippets/icon_none.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<svg data-icon="%icon_set%:%icon_name%" viewBox="0 0 1 1" xmlns="http://www.w3.org/2000/svg" />
43 changes: 29 additions & 14 deletions bundles/org.openhab.ui.basic/web-src/smarthome.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -349,8 +349,7 @@
function Control(parentNode) {
var
_t = this,
suppress = false,
noneImageSrc = "images/none.png";
suppress = false;

_t.parentNode = parentNode;
if (_t.formRow === undefined) {
Expand Down Expand Up @@ -438,7 +437,10 @@
_t.replaceImageWithNone = function() {
this.removeEventListener("load", _t.convertToInlineSVG);
this.removeEventListener("error", _t.replaceImageWithNone);
this.src = noneImageSrc;
if (this === _t.icon) {
_t.iconError = true;
}
_t.replaceIconWithInlineSVG(this, "<svg viewBox=\"0 0 1 1\" xmlns=\"http://www.w3.org/2000/svg\" />");
};

_t.replaceIconWithInlineSVG = function(iconElement, svgText) {
Expand Down Expand Up @@ -497,16 +499,18 @@
doc = parser.parseFromString(htmlText, "text/html");
newIconElement = doc.body.firstChild;

if (_t.iconSource === "oh") {
if (_t.icon.tagName.toLowerCase() === "img" && _t.iconSource === "oh") {
_t.icon.removeEventListener("load", _t.convertToInlineSVG);
_t.icon.removeEventListener("error", _t.replaceImageWithNone);
}

_t.iconError = false;

// Replace the current icon element
_t.iconContainer.replaceChild(newIconElement, _t.icon);

_t.findIcon();
if (_t.iconSource === "oh") {
if (_t.icon.tagName.toLowerCase() === "img" && _t.iconSource === "oh") {
_t.icon.addEventListener("load", _t.convertToInlineSVG);
_t.icon.addEventListener("error", _t.replaceImageWithNone);
}
Expand Down Expand Up @@ -567,13 +571,19 @@
if (iconSrc === _t.iconSource) {
if (iconSrc === "oh") {
if (iconSet !== _t.iconSet || iconName !== _t.iconName) {
src = "<img data-icon=\"" + iconSet + ":" + iconName + "\" src=\".." + imgURL + "\" />";
if (iconName === "none" && iconSet === "classic") {
src = "<svg data-icon=\"" + iconSet + ":" + iconName + "\" viewBox=\"0 0 1 1\" xmlns=\"http://www.w3.org/2000/svg\" />";
} else {
src = "<img data-icon=\"" + iconSet + ":" + iconName + "\" src=\".." + imgURL + "\" />";
}
_t.replaceIcon(src);
} else if (_t.icon.tagName.toLowerCase() === "img" && !_t.icon.src.endsWith(noneImageSrc)) {
_t.icon.addEventListener("error", _t.replaceImageWithNone);
_t.icon.setAttribute("src", imgURL);
} else if (_t.icon.tagName.toLowerCase() === "svg" && smarthome.UI.inlineSVG) {
_t.getSVGIconAndReplaceWithInline(_t.icon, imgURL, false, "<svg/>");
} else if (iconName !== "none" && !_t.iconError) {
if (_t.icon.tagName.toLowerCase() === "img") {
_t.icon.addEventListener("error", _t.replaceImageWithNone);
_t.icon.setAttribute("src", imgURL);
} else if (_t.icon.tagName.toLowerCase() === "svg" && smarthome.UI.inlineSVG) {
_t.getSVGIconAndReplaceWithInline(_t.icon, imgURL, false, "<svg viewBox=\"0 0 1 1\" xmlns=\"http://www.w3.org/2000/svg\" />");
}
}
} else if (iconSrc === "if") {
_t.icon.setAttribute("icon", encodeURIComponent(iconSet) + ":" + encodeURIComponent(iconName));
Expand All @@ -584,7 +594,11 @@
// Different icon source => DOM element to be be replaced

if (iconSrc === "oh") {
src = "<img data-icon=\"" + iconSet + ":" + iconName + "\" src=\".." + imgURL + "\" />";
if (iconName === "none" && iconSet === "classic") {
src = "<svg data-icon=\"" + iconSet + ":" + iconName + "\" viewBox=\"0 0 1 1\" xmlns=\"http://www.w3.org/2000/svg\" />";
} else {
src = "<img data-icon=\"" + iconSet + ":" + iconName + "\" src=\".." + imgURL + "\" />";
}
} else if (iconSrc === "if") {
src = "<iconify-icon icon=\"" +
encodeURIComponent(iconSet) + ":" + encodeURIComponent(iconName) +
Expand Down Expand Up @@ -701,7 +715,7 @@
_t.applyLocalSettingsPrivate = function() {};

_t.destroy = function() {
if (_t.icon !== null && _t.iconSource === "oh") {
if (_t.icon !== null && _t.icon.tagName.toLowerCase() === "img" && _t.iconSource === "oh") {
_t.icon.removeEventListener("load", _t.convertToInlineSVG);
_t.icon.removeEventListener("error", _t.replaceImageWithNone);
}
Expand All @@ -716,8 +730,9 @@
setCellSize(smarthome.UI.cellSizeTablet, smarthome.UI.cellSizeDesktop);

_t.findIcon();
_t.iconError = false;
_t.iconifyIconReplaced = false;
if (_t.icon !== null && _t.iconSource === "oh") {
if (_t.icon !== null && _t.icon.tagName.toLowerCase() === "img" && _t.iconSource === "oh") {
_t.icon.addEventListener("load", _t.convertToInlineSVG);
_t.icon.addEventListener("error", _t.replaceImageWithNone);
} else if (_t.icon !== null && _t.iconSource === "if" && !smarthome.UI.iconify) {
Expand Down