- commit
- 8399f77cf2270c250bf499ae521143c391b704ae
- parent
- 0a80eb928a12b8d25f7f01226f3c5a7d3127cce2
- Author
- Tobias Bengfort <tobias.bengfort@posteo.de>
- Date
- 2022-05-03 20:48
use builtin math module
Diffstat
| M | sass/color.scss | 37 | ++++++++++++++----------------------- |
| M | sass/contrast.scss | 11 | +---------- |
| M | test/color.js | 2 | +- |
3 files changed, 16 insertions, 34 deletions
diff --git a/sass/color.scss b/sass/color.scss
@@ -43,7 +43,7 @@ $planifolia-colorspace: 'lab' !default; 43 43 @if $c <= 0.04045 { 44 44 $c: math.div($c, 12.92); 45 45 } @else {46 -1 $c: pow(math.div($c + 0.055, 1.055), 2.4);-1 46 $c: math.pow(math.div($c + 0.055, 1.055), 2.4); 47 47 } 48 48 @return $c * 100; 49 49 } @@ -53,7 +53,7 @@ $planifolia-colorspace: 'lab' !default; 53 53 @if $c <= 0.0031308 { 54 54 $c: $c * 12.92; 55 55 } @else {56 -1 $c: 1.055 * pow($c, math.div(1, 2.4)) - 0.055;-1 56 $c: 1.055 * math.pow($c, math.div(1, 2.4)) - 0.055; 57 57 } 58 58 @return $c * 255; 59 59 } @@ -108,7 +108,7 @@ $planifolia-colorspace: 'lab' !default; 108 108 109 109 @function _pf-xyz-to-lab-f($t) { 110 110 @if $t > math.div(216, 24389) {111 -1 @return pow($t, math.div(1, 3));-1 111 @return math.pow($t, math.div(1, 3)); 112 112 } @else { 113 113 @return math.div(841, 108) * $t + math.div(4, 29); 114 114 } @@ -130,7 +130,7 @@ $planifolia-colorspace: 'lab' !default; 130 130 131 131 @function _pf-lab-to-xyz-f($t) { 132 132 @if $t > math.div(6, 29) {133 -1 @return pow($t, 3);-1 133 @return math.pow($t, 3); 134 134 } @else { 135 135 @return math.div(108, 841) * ($t - math.div(4, 29)); 136 136 } @@ -171,7 +171,7 @@ $planifolia-colorspace: 'lab' !default; 171 171 $yuuvv: _pf-xyz-to-yuuvv($xyz); 172 172 173 173 $y: math.div(nth($yuuvv, 1), nth($white, 1));174 -1 $l: if($y > math.div(216, 24389), 116 * pow($y, math.div(1, 3)) - 16, math.div(24389, 27) * $y);-1 174 $l: if($y > math.div(216, 24389), 116 * math.pow($y, math.div(1, 3)) - 16, math.div(24389, 27) * $y); 175 175 176 176 $u: 13 * $l * (nth($yuuvv, 2) - nth($white, 2)); 177 177 $v: 13 * $l * (nth($yuuvv, 3) - nth($white, 3)); @@ -187,7 +187,7 @@ $planifolia-colorspace: 'lab' !default; 187 187 188 188 $y: nth($white, 1); 189 189 @if nth($luv, 1) > 8 {190 -1 $y: $y * pow(math.div(nth($luv, 1) + 16, 116), 3);-1 190 $y: $y * math.pow(math.div(nth($luv, 1) + 16, 116), 3); 191 191 } @else { 192 192 $y: math.div($y * nth($luv, 1) * 27, 24389); 193 193 } @@ -197,19 +197,19 @@ $planifolia-colorspace: 'lab' !default; 197 197 198 198 @function _pf-lab-to-lch($lab) { 199 199 $l: nth($lab, 1);200 -1 $c: sqrt(nth($lab, 2) * nth($lab, 2) + nth($lab, 3) * nth($lab, 3));201 -1 $h: 0;-1 200 $c: math.sqrt(nth($lab, 2) * nth($lab, 2) + nth($lab, 3) * nth($lab, 3)); -1 201 $h: 0deg; 202 202 @if abs(nth($lab, 2)) > 0.0001 or abs(nth($lab, 3)) > 0.0001 {203 -1 $h: atan2(nth($lab, 3), nth($lab, 2)) * 1rad;-1 203 $h: math.atan2(nth($lab, 3), nth($lab, 2)); 204 204 } 205 205206 -1 @return ($l, $c, 0deg + $h);-1 206 @return ($l, $c, $h); 207 207 } 208 208 209 209 @function _pf-lch-to-lab($lch) { 210 210 $l: nth($lch, 1);211 -1 $a: cos(nth($lch, 3)) * nth($lch, 2);212 -1 $b: sin(nth($lch, 3)) * nth($lch, 2);-1 211 $a: math.cos(nth($lch, 3)) * nth($lch, 2); -1 212 $b: math.sin(nth($lch, 3)) * nth($lch, 2); 213 213 214 214 @return ($l, $a, $b); 215 215 } @@ -232,9 +232,6 @@ $planifolia-colorspace: 'lab' !default; 232 232 @return $c-tmp; 233 233 } 234 234235 -1 /// @require pow236 -1 /// @require sqrt237 -1 /// @require atan2238 235 @function _pf-to-lch($color, $colorspace: $planifolia-colorspace) { 239 236 @if $colorspace == 'lab' { 240 237 $xyz: _pf-to-xyz($color); @@ -298,10 +295,6 @@ $planifolia-colorspace: 'lab' !default; 298 295 /// @param {angle} $hue 299 296 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl', 'yuv', 'hslab', 'hsluv' 300 297 /// @return {color}301 -1 ///302 -1 /// @require pow303 -1 /// @require sin304 -1 /// @require cos305 298 @function lch($lightness, $chroma, $hue, $colorspace: $planifolia-colorspace) { 306 299 $hue: 0deg + $hue; 307 300 $rgb: _lch-unclipped($lightness, $chroma, $hue, $colorspace); @@ -453,15 +446,13 @@ $planifolia-colorspace: 'lab' !default; 453 446 /// @param {color} $color 454 447 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl', 'yuv', 'hslab', 'hsluv' 455 448 /// @return {color}456 -1 /// @require pi457 449 @function pf-complement($color, $colorspace: $planifolia-colorspace) {458 -1 @return pf-adjust-hue($color, pi() * 1rad, $colorspace);-1 450 @return pf-adjust-hue($color, math.$pi * 1rad, $colorspace); 459 451 } 460 452 461 453 /// @param {color} $color 462 454 /// @param {string} $colorspace ['lab'] one of 'lab', 'luv', 'hsl', 'yuv', 'hslab', 'hsluv' 463 455 /// @return {color}464 -1 /// @require pi465 456 @function pf-grayscale($color, $colorspace: $planifolia-colorspace) { 466 457 @return pf-change-color($color, $chroma: 0, $colorspace: $colorspace); 467 458 } @@ -479,7 +470,7 @@ $planifolia-colorspace: 'lab' !default; 479 470 $x2: nth($lab1, 2) - nth($lab2, 2); 480 471 $x3: nth($lab1, 3) - nth($lab2, 3); 481 472482 -1 @return sqrt($x1 * $x1 + $x2 * $x2 + $x3 * $x3);-1 473 @return math.sqrt($x1 * $x1 + $x2 * $x2 + $x3 * $x3); 483 474 } 484 475 485 476 @function _pf-lch-mix($lch1, $lch2, $weight) {
diff --git a/sass/contrast.scss b/sass/contrast.scss
@@ -30,16 +30,7 @@ $planifolia-contrast-light-default: white !default; 30 30 @return math.div($x, 12.92); 31 31 } @else { 32 32 $c: math.div($x + 0.055, 1.055);33 -1 @if function-exists('pow') {34 -1 @return pow($c, 2.4);35 -1 } @else {36 -1 // approximation for pow($c, 2.4)37 -1 //38 -1 // NOTE that `contrast()` amplifies the errors generated here.39 -1 // The factors a chosen to minify that effect.40 -1 $cc: $c * $c;41 -1 @return 0.4 * $cc + 0.8 * ($cc * $c) - 0.2 * ($cc * $cc);42 -1 }-1 33 @return math.pow($c, 2.4); 43 34 } 44 35 } 45 36
diff --git a/test/color.js b/test/color.js
@@ -2,7 +2,7 @@ var assert = require('assert');
2 2 var shared = require('./shared');
3 3
4 4 describe('color', function() {
5 -1 var renderer = new shared.Renderer('@import "math"; @import "color";');
-1 5 var renderer = new shared.Renderer('@import "color";');
6 6
7 7 describe('lab', function() {
8 8 describe('lch', function() {