alexei.dolgolyov/wled-screen-controller-mixed
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

feat: add overlay, soft light, hard light, difference, exclusion blend modes to composite
Some checks failed
Lint & Test / test (push) Failing after 27s
Details

Browse Source 
Integer-math implementations with pre-allocated scratch buffers.
IconSelect picker updated with 10 blend modes. i18n for en/ru/zh.
This commit is contained in:
Admin
2026-03-24 17:24:39 +03:00
parent bbef7e5869
commit 0723c5c68c
6 changed files with 162 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
server/src/wled_controller/static/js/features/color-strips-composite.ts
View File

@@ -51,11 +51,16 @@ export function compositeDestroyEntitySelects() {
function _getCompositeBlendItems() {
return [
{ value: 'normal', icon: _icon(P.square), label: t('color_strip.composite.blend_mode.normal'), desc: t('color_strip.composite.blend_mode.normal.desc') },
{ value: 'add', icon: _icon(P.sun), label: t('color_strip.composite.blend_mode.add'), desc: t('color_strip.composite.blend_mode.add.desc') },
{ value: 'multiply', icon: _icon(P.eye), label: t('color_strip.composite.blend_mode.multiply'), desc: t('color_strip.composite.blend_mode.multiply.desc') },
{ value: 'screen', icon: _icon(P.monitor), label: t('color_strip.composite.blend_mode.screen'), desc: t('color_strip.composite.blend_mode.screen.desc') },
{ value: 'override', icon: _icon(P.zap), label: t('color_strip.composite.blend_mode.override'), desc: t('color_strip.composite.blend_mode.override.desc') },
{ value: 'normal', icon: _icon(P.square), label: t('color_strip.composite.blend_mode.normal'), desc: t('color_strip.composite.blend_mode.normal.desc') },
{ value: 'add', icon: _icon(P.sun), label: t('color_strip.composite.blend_mode.add'), desc: t('color_strip.composite.blend_mode.add.desc') },
{ value: 'multiply', icon: _icon(P.moon), label: t('color_strip.composite.blend_mode.multiply'), desc: t('color_strip.composite.blend_mode.multiply.desc') },
{ value: 'screen', icon: _icon(P.monitor), label: t('color_strip.composite.blend_mode.screen'), desc: t('color_strip.composite.blend_mode.screen.desc') },
{ value: 'overlay', icon: _icon(P.copy), label: t('color_strip.composite.blend_mode.overlay'), desc: t('color_strip.composite.blend_mode.overlay.desc') },
{ value: 'soft_light', icon: _icon(P.sunDim), label: t('color_strip.composite.blend_mode.soft_light'), desc: t('color_strip.composite.blend_mode.soft_light.desc') },
{ value: 'hard_light', icon: _icon(P.zap), label: t('color_strip.composite.blend_mode.hard_light'), desc: t('color_strip.composite.blend_mode.hard_light.desc') },
{ value: 'difference', icon: _icon(P.activity), label: t('color_strip.composite.blend_mode.difference'), desc: t('color_strip.composite.blend_mode.difference.desc') },
{ value: 'exclusion', icon: _icon(P.circleOff), label: t('color_strip.composite.blend_mode.exclusion'), desc: t('color_strip.composite.blend_mode.exclusion.desc') },
{ value: 'override', icon: _icon(P.eye), label: t('color_strip.composite.blend_mode.override'), desc: t('color_strip.composite.blend_mode.override.desc') },
];
}
@@ -127,11 +132,9 @@ export function compositeRenderList() {
<div class="composite-layer-row">
<select class="composite-layer-source" data-idx="${i}">${srcOptions}</select>
<select class="composite-layer-blend" data-idx="${i}">
<option value="normal"${layer.blend_mode === 'normal' ? ' selected' : ''}>${t('color_strip.composite.blend_mode.normal')}</option>
<option value="add"${layer.blend_mode === 'add' ? ' selected' : ''}>${t('color_strip.composite.blend_mode.add')}</option>
<option value="multiply"${layer.blend_mode === 'multiply' ? ' selected' : ''}>${t('color_strip.composite.blend_mode.multiply')}</option>
<option value="screen"${layer.blend_mode === 'screen' ? ' selected' : ''}>${t('color_strip.composite.blend_mode.screen')}</option>
<option value="override"${layer.blend_mode === 'override' ? ' selected' : ''}>${t('color_strip.composite.blend_mode.override')}</option>
${_getCompositeBlendItems().map(b =>
`<option value="${b.value}"${layer.blend_mode === b.value ? ' selected' : ''}>${b.label}</option>`
).join('')}
</select>
</div>
<div class="composite-layer-row">