mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-04-06 10:46:57 +00:00
Code Issues Releases Wiki Activity

Add hue adjuster to colour-interpolate operator

Browse Source
This commit is contained in:
Jeremy Ruston 2025-02-11 20:46:11 +00:00
parent 71a144f6f9
commit 28935a5856
2 changed files with 27 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
core/modules/filters/colour-ops.js
View File

@ -12,7 +12,9 @@ Filter operators for colour operations
/*global $tw: false */
"use strict";
var Color = require("$:/core/modules/utils/dom/color.js").Color;
var Color = require("$:/core/modules/utils/dom/color.js").Color,
colourSpacesList = Object.keys(Color.spaces),
hueAdjustersList = ["raw","increasing","decreasing","longer","shorter"];
exports["colour-lighten"] = makeSerialColourOperator(function (colour, operator, options) {
return colour.lighten($tw.utils.parseNumber(operator.operand)).display().toString();
@ -77,13 +79,22 @@ exports["colour-best-contrast"] = makeParallelColourOperator(function (colours,
});
exports["colour-interpolate"] = makeParallelColourOperator(function (colours, operator, options) {
// Get the colour space suffix
var space = (((operator.suffixes || [])[0] || ["srgb"])[0]).toLowerCase();
if(colourSpacesList.indexOf(space) === -1) {
space = "srgb";
}
// Special case for less than two colours
if(colours.length < 2) {
return [];
}
// Step through the indexes collecting the interpolated colours
var space = ((operator.suffixes || [])[0] || ["srgb"])[0],
rangefn = colours[0].range(colours[1],{space: space}),
// Get the hue adjuster suffix
var hueAdjuster = (((operator.suffixes || [])[1] || ["shorter"])[0]).toLowerCase();
if(hueAdjustersList.indexOf(hueAdjuster) === -1) {
hueAdjuster = "shorter";
}
// Compute the range function
var rangefn = colours[0].range(colours[1],{space: space, hue: hueAdjuster}),
outputColours = [];
$tw.utils.each(operator.operands,function(operand) {
// Get the index

21
editions/tw5.com/tiddlers/filters/colour-interpolate.tid
View File

@ -3,19 +3,24 @@ modified: 20241117161528913
tags: [[Filter Operators]] [[Colour Operators]]
title: colour-interpolate Operator
caption: colour-interpolate
op-purpose: smoothly interpolate between a set of colours
op-input: a selection of colour values
op-suffix: the name of the colour space to be used for the interpolation such as "OkLCh" or "sRGB"
op-purpose: smoothly interpolate between a pair of colours
op-input: two colour values. Additional values are ignored
op-suffix: the <<.op colour-interpolate>> operator uses a rich suffix, see below for details
op-parameter: one or more indexes where 0 is the first colour and 1 is the last colour and intermediate values are smoothly interpolated
op-output: the values of the interpolated colours
<<.from-version "5.3.7">> See [[Colour Palettes]] for background.
The <<.op colour-interpolate>> operator is used to interpolate colour values in a chosen colour space.
The <<.op colour-interpolate>> operator is used to interpolate colour values in a chosen colour space. It uses an extended syntax that permits multiple additional parameters to be passed:
The full list of colour spaces that can be used for interpolation is given in [[Colour Spaces]].
```
[colour-interpolate:<colour space>:<hue adjuster>[<parameter>]]
```
Note that at least two input colours must be provided for interpolation to occur.
* ''colour space'': The name of the colour space to be used for the interpolation such as "OkLCh" or "sRGB". The full list of colour spaces that can be used for interpolation is given in [[Colour Spaces]]
* ''hue adjuster'': For color spaces with a hue angle there are multiple ways to interpolate, which can produce drastically different results. The hue adjuster suffix allows the interpolation type to be controlled. It can be set to "raw", "increasing", "decreasing", "longer" or "shorter" (the default). See [[Colour Interpolation Hues]] for more details
Two input colours are required. If there are fewer than two input colours, the operator will return an empty result. If there are more than two input colours, the operator will ignore the additional colours.
Note that indexes outside the range 0 to 1 will extrapolate from the provided colour values.
@ -28,6 +33,4 @@ red green +[colour-interpolate:oklch[0],[0.333],[0.666],[1]]
See also the following related operators:
* <<.olink colour-get-oklch>> to retrieve a component of a colour value in the OKLCH colour space
* <<.olink colour-lighten>> to lighten a colour value
* <<.olink colour-darken>> to lighten a colour value
* <<.olink colour-set-oklch>> to set a component of a colour value in the OKLCH colour space