From 99b5036f3ec5498124c136e482ed916088d1e242 Mon Sep 17 00:00:00 2001 From: protoclown Date: Mon, 26 Sep 2022 12:59:00 +0200 Subject: [PATCH 1/2] refactor: change getContrast to isDark with for a more direct approach --- framework/core/js/src/common/compat.ts | 4 ++-- .../core/js/src/common/utils/{getContrast.ts => isDark.ts} | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) rename framework/core/js/src/common/utils/{getContrast.ts => isDark.ts} (78%) diff --git a/framework/core/js/src/common/compat.ts b/framework/core/js/src/common/compat.ts index 6b2df1ec7..d63f4fcb9 100644 --- a/framework/core/js/src/common/compat.ts +++ b/framework/core/js/src/common/compat.ts @@ -33,7 +33,7 @@ import formatNumber from './utils/formatNumber'; import mapRoutes from './utils/mapRoutes'; import withAttr from './utils/withAttr'; import * as FocusTrap from './utils/focusTrap'; -import getContrast from './utils/getContrast'; +import isDark from './utils/isDark'; import Notification from './models/Notification'; import User from './models/User'; import Post from './models/Post'; @@ -121,7 +121,7 @@ export default { 'utils/throttleDebounce': ThrottleDebounce, 'utils/isObject': isObject, 'utils/focusTrap': FocusTrap, - 'utils/getContrast': getContrast, + 'utils/isDark': isDark, 'models/Notification': Notification, 'models/User': User, 'models/Post': Post, diff --git a/framework/core/js/src/common/utils/getContrast.ts b/framework/core/js/src/common/utils/isDark.ts similarity index 78% rename from framework/core/js/src/common/utils/getContrast.ts rename to framework/core/js/src/common/utils/isDark.ts index 56250a464..8c949447d 100644 --- a/framework/core/js/src/common/utils/getContrast.ts +++ b/framework/core/js/src/common/utils/isDark.ts @@ -4,7 +4,7 @@ * light?) See https://www.w3.org/TR/AERT/#color-contrast for references */ -export default function getContrast(hexcolor: String) { +export default function isDark(hexcolor: String) { var hexnumbers = hexcolor.replace("#", ""); @@ -15,7 +15,7 @@ export default function getContrast(hexcolor: String) { const r = parseInt(hexnumbers.substr(0,2),16); const g = parseInt(hexnumbers.substr(2,2),16); const b = parseInt(hexnumbers.substr(4,2),16); - const contrast = ((r*299)+(g*587)+(b*114))/1000; + const yiq = ((r*299)+(g*587)+(b*114))/1000; - return contrast; + return (yiq >= 128) ? false : true; } From ad0624770dd0f3649751aa7bdb430d1b29c50b61 Mon Sep 17 00:00:00 2001 From: protoclown Date: Mon, 26 Sep 2022 13:01:46 +0200 Subject: [PATCH 2/2] fix: adjust snippet description --- framework/core/js/src/common/utils/isDark.ts | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/framework/core/js/src/common/utils/isDark.ts b/framework/core/js/src/common/utils/isDark.ts index 8c949447d..f12ac2cdf 100644 --- a/framework/core/js/src/common/utils/isDark.ts +++ b/framework/core/js/src/common/utils/isDark.ts @@ -1,7 +1,8 @@ /** - * The `getContrast` utility converts a hex color to rgb, and then calcul a YIQ - * value in order to get the appropriate contrast value (is it dark or is it - * light?) See https://www.w3.org/TR/AERT/#color-contrast for references + * The `isDark` utility converts a hex color to rgb, and then calcul a YIQ + * value in order to get the appropriate brightness value (is it dark or is it + * light?) See https://www.w3.org/TR/AERT/#color-contrast for references. A YIQ + * value >= 128 is a light color. */ export default function isDark(hexcolor: String) {