From d775279dbd0da284af7f74b31b5d3b0eddcf80bc Mon Sep 17 00:00:00 2001 From: Jo-Philipp Wich Date: Thu, 11 Nov 2021 12:39:41 +0100 Subject: luci-base: firewall.js: add getZoneColorStyle() helper The getZoneColorStyle() function will produce CSS style properties that describe the color value of the zone. The color declaration is divided into a CSS variable called `--zone-color-rgb` which holds the RGB value of the color and a `background-color` property assigning these values as background property. This allows themes to override the color with derived values, e.g. by applying an alpha channel. Signed-off-by: Jo-Philipp Wich --- modules/luci-base/htdocs/luci-static/resources/firewall.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'modules/luci-base') diff --git a/modules/luci-base/htdocs/luci-static/resources/firewall.js b/modules/luci-base/htdocs/luci-static/resources/firewall.js index 4fa4954ba6..a682af46d0 100644 --- a/modules/luci-base/htdocs/luci-static/resources/firewall.js +++ b/modules/luci-base/htdocs/luci-static/resources/firewall.js @@ -224,7 +224,17 @@ Firewall = L.Class.extend({ }, this)); }, - getColorForName: getColorForName + getColorForName: getColorForName, + + getZoneColorStyle: function(zone) { + var hex = (zone instanceof Zone) ? zone.getColor() : getColorForName((zone != null && zone != '*') ? zone : null); + + return '--zone-color-rgb:%d, %d, %d; background-color:rgb(var(--zone-color-rgb))'.format( + parseInt(hex.substring(1, 3), 16), + parseInt(hex.substring(3, 5), 16), + parseInt(hex.substring(5, 7), 16) + ); + }, }); -- cgit v1.2.3