switched pen color dimensions from HSV to HSL

HISTORY.md

@@ -52,7 +52,8 @@
 ### 2021-11-08
 * objects: renamed some internal color methods
 * objects, store: renamed internal pen color channel cache
-* objects, blocks, threads: renamed internal pen accessor methods 
+* objects, blocks, threads: renamed internal pen accessor methods
+* objects, threads, store, extensions: switched pen color dimensions from HSV to HSL
 
 ### 2021-11-07
 * widgets, blocks, byob: allow block-instances to be dragged off from templates in the "hide blocks" dialog

snap.html

@@ -28,7 +28,7 @@
         <script src="src/sketch.js?version=2021-11-03"></script>
         <script src="src/video.js?version=2019-06-27"></script>
         <script src="src/maps.js?version=2021-06-15"></script>
-        <script src="src/extensions.js?version=2021-10-06"></script>
+        <script src="src/extensions.js?version=2021-11-08"></script>
         <script src="src/xml.js?version=2021-07-05"></script>
         <script src="src/store.js?version=2021-11-08"></script>
         <script src="src/locale.js?version=2021-10-28"></script>

src/extensions.js

@@ -33,7 +33,7 @@ Color, Process, contains*/
 
 /*jshint esversion: 11*/
 
-modules.extensions = '2021-October-06';
+modules.extensions = '2021-November-08';
 
 // Global stuff
 
@@ -763,6 +763,22 @@ SnapExtensions.primitives.set(
     }
 );
 
+SnapExtensions.primitives.set(
+    'clr_hsl(clr)',
+    function (clr) {
+        return new List(clr.hsl());
+    }
+);
+
+SnapExtensions.primitives.set(
+    'clr_hsl(h, s, l)',
+    function (h, s, l) {
+        var c = new Color();
+        c.set_hsl(h, s, l);
+        return c;
+    }
+);
+
 SnapExtensions.primitives.set(
     'clr_setpen(clr)',
     function (clr) {

src/objects.js

@@ -1909,7 +1909,7 @@ SpriteMorph.prototype.init = function (globals) {
 
     this.isCachingImage = true;
     this.isFreeForm = true;
-    this.cachedColorDimensions = this.color.hsv();
+    this.cachedColorDimensions = this.color.hsl();
     this.isDraggable = true;
     this.isDown = false;
     this.heading = 90;
@@ -1940,7 +1940,7 @@ SpriteMorph.prototype.fullCopy = function (forClone) {
     c.primitivesCache = {};
     c.paletteCache = {};
     c.imageData = {};
-    c.cachedColorDimensions = c.color.hsv();
+    c.cachedColorDimensions = c.color.hsl();
     arr = [];
     this.inheritedAttributes.forEach(att => arr.push(att));
     c.inheritedAttributes = arr;
@@ -4450,7 +4450,7 @@ SpriteMorph.prototype.setColorDimension = function (idx, num) {
         this.color.a = 1 - n / 100;
     } else {
         this.cachedColorDimensions[idx] = n / 100;
-        this.color.set_hsv.apply(this.color, this.cachedColorDimensions);
+        this.color.set_hsl.apply(this.color, this.cachedColorDimensions);
     }
     if (!this.costume) {
         this.rerender();
@@ -4482,7 +4482,7 @@ SpriteMorph.prototype.setColor = function (aColor) {
             this.rerender();
             this.silentGotoXY(x, y);
         }
-        this.cachedColorDimensions = this.color.hsv();
+        this.cachedColorDimensions = this.color.hsl();
     }
 };
 
@@ -7863,7 +7863,7 @@ StageMorph.prototype.init = function (globals) {
 
     this.setExtent(this.dimensions);
     this.isCachingImage = true;
-    this.cachedColorDimensions = this.color.hsv();
+    this.cachedColorDimensions = this.color.hsl();
     this.acceptsDrops = false;
     this.setColor(new Color(255, 255, 255));
     this.fps = this.frameRate;
@@ -9294,7 +9294,7 @@ StageMorph.prototype.setColorDimension = function (idx, num) {
         this.color.a = 1 - n / 100;
     } else {
         this.cachedColorDimensions[idx] = n / 100;
-        this.color.set_hsv.apply(this.color, this.cachedColorDimensions);
+        this.color.set_hsl.apply(this.color, this.cachedColorDimensions);
     }
     this.rerender();
 };
@@ -9309,7 +9309,7 @@ StageMorph.prototype.setColor = function (aColor) {
     if (!this.color.eq(aColor, true)) { // observeAlpha
         this.color = aColor.copy();
         this.rerender();
-        this.cachedColorDimensions = this.color.hsv();
+        this.cachedColorDimensions = this.color.hsl();
     }
 };
 

src/store.js

@@ -408,7 +408,7 @@ SnapSerializer.prototype.loadScene = function (xmlNode, remixID) {
     }
     if (model.stage.attributes.color) {
         scene.stage.color = this.loadColor(model.stage.attributes.color);
-        scene.stage.cachedColorDimensions = scene.stage.color.hsv();
+        scene.stage.cachedColorDimensions = scene.stage.color.hsl();
     }
     if (model.stage.attributes.scheduled === 'true') {
         scene.stage.fps = 30;
@@ -714,7 +714,7 @@ SnapSerializer.prototype.loadSprites = function (xmlString, ide) {
         }
         if (model.attributes.color) {
             sprite.color = this.loadColor(model.attributes.color);
-            sprite.cachedColorDimensions = sprite.color.hsv();
+            sprite.cachedColorDimensions = sprite.color.hsl();
         }
         if (model.attributes.pen) {
             sprite.penPoint = model.attributes.pen;
@@ -1453,7 +1453,7 @@ SnapSerializer.prototype.loadValue = function (model, object) {
         }
         if (model.attributes.color) {
             v.color = this.loadColor(model.attributes.color);
-            v.cachedColorDimensions = v.color.hsv();
+            v.cachedColorDimensions = v.color.hsl();
         }
         if (model.attributes.pen) {
             v.penPoint = model.attributes.pen;

src/threads.js

@@ -4928,9 +4928,9 @@ Process.prototype.reportAspect = function (aspect, location) {
     // ----------------
     // left input (aspect):
     //
-    //      'hue'           - hsv HUE on a scale of 0 - 100
-    //      'saturation'    - hsv SATURATION on a scale of 0 - 100
-    //      'brightness'    - hsv VALUE on a scale of 0 - 100
+    //      'hue'           - hsl HUE on a scale of 0 - 100
+    //      'saturation'    - hsl SATURATION on a scale of 0 - 100
+    //      'brightness'    - hsl BRIGHTNESS on a scale of 0 - 100
     //      'transparency'  - rgba ALPHA on a reversed (!) scale of 0 - 100
     //      'r-g-b-a'       - list of rgba values on a scale of 0 - 255 each
     //      'sprites'       - a list of sprites at the location, empty if none
@@ -5023,7 +5023,7 @@ Process.prototype.reportAspect = function (aspect, location) {
     if (idx === 3) {
         return (1 - clr.a) * 100;
     }
-    return clr.hsv()[idx] * 100;
+    return clr.hsl()[idx] * 100;
 };
 
 Process.prototype.colorAtSprite = function (sprite) {