lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-18 18:27:58 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Refactor CSS filter support check and update brightness filter parsing.

Browse Source
This commit is contained in:
Anton Lavrevov
2025-08-23 04:00:12 -05:00
parent 62d67e964c
commit 37213f2cc9
2 changed files with 7 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/Context.ts
View File

@@ -108,13 +108,7 @@ export function isCSSFiltersSupported(): boolean {
_cssFiltersSupported = false; _cssFiltersSupported = false;
return false; return false;
} }
return !!ctx && 'filter' in ctx;
// Test if setting the filter property works
const originalFilter = ctx.filter;
ctx.filter = 'blur(1px)';
_cssFiltersSupported = ctx.filter === 'blur(1px)';
ctx.filter = originalFilter;
return _cssFiltersSupported;
} catch (e) { } catch (e) {
_cssFiltersSupported = false; _cssFiltersSupported = false;
return false; return false;

10
src/Node.ts
View File

@@ -44,7 +44,9 @@ function parseCSSFilters(cssFilter: string): FilterFunction {
} }
case 'brightness': { case 'brightness': {
const brightness = parseFloat(filterValue); const brightness = filterValue.includes('%')
? parseFloat(filterValue) / 100
: parseFloat(filterValue);
return function (imageData) { return function (imageData) {
(this as any).brightness(brightness); // CSS uses multiplier (this as any).brightness(brightness); // CSS uses multiplier
const KonvaFilters = (Konva as any).Filters; const KonvaFilters = (Konva as any).Filters;
@@ -694,9 +696,9 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
const fallbackRequired = const fallbackRequired =
typeof filters[i] === 'string' && !isCSSFiltersSupported(); typeof filters[i] === 'string' && !isCSSFiltersSupported();
if (fallbackRequired) { if (fallbackRequired) {
Util.warn( // Util.warn(
`CSS filter "${filters[i]}" is not supported in native mode.` // `CSS filter "${filters[i]}" is not supported in native mode.`
); // );
} }
if (typeof filters[i] !== 'string' || !isCSSFiltersSupported()) { if (typeof filters[i] !== 'string' || !isCSSFiltersSupported()) {
useNativeOnly = false; useNativeOnly = false;