export plugins

rexrainbow · Oct 19, 2024 · 2851a32 · 2851a32
1 parent ca927b3
commit 2851a32
Show file tree

Hide file tree

Showing 52 changed files with 1,921 additions and 773 deletions.
diff --git a/dist/rexcanvasinputplugin.js b/dist/rexcanvasinputplugin.js
@@ -2064,6 +2064,8 @@
             this.setBackgroundColor(GetValue$a(o, 'backgroundColor', null));
             this.setBackgroundHeight(GetValue$a(o, 'backgroundHeight', undefined));
             this.setBackgroundBottomY(GetValue$a(o, 'backgroundBottomY', undefined));
+            this.setBackgroundLeftX(GetValue$a(o, 'backgroundLeftX', 0));
+            this.setBackgroundRightX(GetValue$a(o, 'backgroundRightX', 0));
 
             return this;
         }
@@ -2134,6 +2136,12 @@
             if (o.hasOwnProperty('backgroundBottomY')) {
                 this.setBackgroundBottomY(o.backgroundBottomY);
             }
+            if (o.hasOwnProperty('backgroundLeftX')) {
+                this.setBackgroundLeftX(o.backgroundLeftX);
+            }
+            if (o.hasOwnProperty('backgroundRightX')) {
+                this.setBackgroundRightX(o.backgroundRightX);
+            }        
 
             return this;
         }
@@ -2288,6 +2296,16 @@
             return this;
         }
 
+        setBackgroundLeftX(x) {
+            this.backgroundLeftX = x;
+            return this;
+        }
+
+        setBackgroundRightX(x) {
+            this.backgroundRightX = x;
+            return this;
+        }
+
         setOffsetX(offsetX) {
             if (offsetX === undefined) {
                 offsetX = 0;
@@ -2715,20 +2733,24 @@
             if (textStyle.hasBackgroundColor) {
                 context.fillStyle = textStyle.backgroundColor;
 
-                var x = this.drawTLX;
-                var width = this.drawTRX - x + 1; // Add extra 1 pixel width
+                var leftX = this.drawTLX + textStyle.backgroundLeftX;
+                var rightX = this.drawTRX + textStyle.backgroundRightX;
+                var x = leftX;
+                var width = rightX - leftX + 1; // Add extra 1 pixel width
 
-                var bottomY = textStyle.backgroundBottomY;
-                if (bottomY == null) {
-                    bottomY = this.drawBLY;
-                }
-                var height = textStyle.backgroundHeight;
-                if (height == null) {
-                    height = bottomY - this.drawTLY;
-                }
-                var y = bottomY - height;
+                if (width > 0) {
+                    var bottomY = textStyle.backgroundBottomY;
+                    if (bottomY == null) {
+                        bottomY = this.drawBLY;
+                    }
+                    var height = textStyle.backgroundHeight;
+                    if (height == null) {
+                        height = bottomY - this.drawTLY;
+                    }
+                    var y = bottomY - height;
 
-                context.fillRect(x, y, width, height);
+                    context.fillRect(x, y, width, height);
+                }
             }
 
             var hasFill = textStyle.hasFill,
@@ -5915,7 +5937,7 @@
 
             var child = textObject.getCharChild(i);
             if (child) {
-                var eventName = (inPrevSelectionRange) ? 'cursorout' : 'cursorin';
+                var eventName = (inPrevSelectionRange) ? 'rangeout' : 'rangein';
                 textObject.emit(eventName, child, i, textObject);
             }
         }
@@ -6568,6 +6590,33 @@
             }, this);
     };
 
+    var RegisterRangeStyle = function (rangeStyle) {
+        if (IsEmpty(rangeStyle)) {
+            return;
+        }
+
+        this
+            .setRangeStyle(rangeStyle)
+            .on('rangein', function (child) {
+                var rangeStyle = this.rangeStyle;
+                var styleSave = GetPartialData(child.style, rangeStyle);
+                if (IsKeyValueEqual(rangeStyle, styleSave)) {
+                    return;
+                }
+
+                child.styleSave = styleSave;
+                child.modifyStyle(rangeStyle);
+            }, this)
+            .on('rangeout', function (child) {
+                if (!child.styleSave) {
+                    return;
+                }
+
+                child.modifyStyle(child.styleSave);
+                child.styleSave = undefined;
+            }, this);
+    };
+
     var RegisterFocusStyle = function (focusStyle) {
         if (IsEmpty(focusStyle)) {
             return;
@@ -7216,6 +7265,7 @@
 
             var focusStyle = ExtractByPrefix(config.background, 'focus');
             var cursorStyle = ExtractByPrefix(config.style, 'cursor');
+            var rangeStyle = ExtractByPrefix(config.style, 'range');
 
             super(scene, x, y, fixedWidth, fixedHeight, config);
             this.type = 'rexCanvasInput';
@@ -7243,19 +7293,41 @@
             }
             RegisterCursorStyle.call(this, cursorStyle);
 
+            if (config.rangeStyle) {
+                Object.assign(rangeStyle, config.rangeStyle);
+            }
+            if (IsEmpty(rangeStyle)) {
+                Object.assign(rangeStyle, cursorStyle);
+            }
+            RegisterRangeStyle.call(this, rangeStyle);
+
+
             var addCharCallback = config.onAddChar;
             if (addCharCallback) {
                 this.on('addchar', addCharCallback);
             }
 
+            var cursorInCallback = config.onCursorIn;
+            if (cursorInCallback) {
+                this.on('cursorin', cursorInCallback);
+            }
+
             var cursorOutCallback = config.onCursorOut;
             if (cursorOutCallback) {
                 this.on('cursorout', cursorOutCallback);
             }
-            var cursorInCallback = config.onCursorIn;
-            if (cursorInCallback) {
-                this.on('cursorin', cursorInCallback);
+
+            var useCursorCallback = !config.onRangeIn && !config.onRangeOut;
+            var rangeInCallback = (!useCursorCallback) ? config.onRangeIn : config.onCursorIn;
+            if (rangeInCallback) {
+                this.on('rangein', rangeInCallback);
             }
+
+            var rangeOutCallback = (!useCursorCallback) ? config.onRangeOut : config.onCursorOut;
+            if (rangeOutCallback) {
+                this.on('rangeout', rangeOutCallback);
+            }
+
             var moveCursorCallback = config.onMoveCursor;
             if (moveCursorCallback) {
                 this.on('movecursor', moveCursorCallback);
@@ -7450,6 +7522,11 @@
             return this;
         }
 
+        setRangeStyle(style) {
+            this.rangeStyle = style;
+            return this;
+        }
+
         setNumberInput() {
             this.textEdit
                 .setNumberInput()

diff --git a/dist/rexcanvasinputplugin.min.js b/dist/rexcanvasinputplugin.min.js
diff --git a/dist/rexcolorcomponents.js b/dist/rexcolorcomponents.js
@@ -15596,6 +15596,8 @@
             this.setBackgroundColor(GetValue$K(o, 'backgroundColor', null));
             this.setBackgroundHeight(GetValue$K(o, 'backgroundHeight', undefined));
             this.setBackgroundBottomY(GetValue$K(o, 'backgroundBottomY', undefined));
+            this.setBackgroundLeftX(GetValue$K(o, 'backgroundLeftX', 0));
+            this.setBackgroundRightX(GetValue$K(o, 'backgroundRightX', 0));
 
             return this;
         }
@@ -15666,6 +15668,12 @@
             if (o.hasOwnProperty('backgroundBottomY')) {
                 this.setBackgroundBottomY(o.backgroundBottomY);
             }
+            if (o.hasOwnProperty('backgroundLeftX')) {
+                this.setBackgroundLeftX(o.backgroundLeftX);
+            }
+            if (o.hasOwnProperty('backgroundRightX')) {
+                this.setBackgroundRightX(o.backgroundRightX);
+            }        
 
             return this;
         }
@@ -15820,6 +15828,16 @@
             return this;
         }
 
+        setBackgroundLeftX(x) {
+            this.backgroundLeftX = x;
+            return this;
+        }
+
+        setBackgroundRightX(x) {
+            this.backgroundRightX = x;
+            return this;
+        }
+
         setOffsetX(offsetX) {
             if (offsetX === undefined) {
                 offsetX = 0;
@@ -16247,20 +16265,24 @@
             if (textStyle.hasBackgroundColor) {
                 context.fillStyle = textStyle.backgroundColor;
 
-                var x = this.drawTLX;
-                var width = this.drawTRX - x + 1; // Add extra 1 pixel width
+                var leftX = this.drawTLX + textStyle.backgroundLeftX;
+                var rightX = this.drawTRX + textStyle.backgroundRightX;
+                var x = leftX;
+                var width = rightX - leftX + 1; // Add extra 1 pixel width
 
-                var bottomY = textStyle.backgroundBottomY;
-                if (bottomY == null) {
-                    bottomY = this.drawBLY;
-                }
-                var height = textStyle.backgroundHeight;
-                if (height == null) {
-                    height = bottomY - this.drawTLY;
-                }
-                var y = bottomY - height;
+                if (width > 0) {
+                    var bottomY = textStyle.backgroundBottomY;
+                    if (bottomY == null) {
+                        bottomY = this.drawBLY;
+                    }
+                    var height = textStyle.backgroundHeight;
+                    if (height == null) {
+                        height = bottomY - this.drawTLY;
+                    }
+                    var y = bottomY - height;
 
-                context.fillRect(x, y, width, height);
+                    context.fillRect(x, y, width, height);
+                }
             }
 
             var hasFill = textStyle.hasFill,
@@ -33680,7 +33702,7 @@
 
             var child = textObject.getCharChild(i);
             if (child) {
-                var eventName = (inPrevSelectionRange) ? 'cursorout' : 'cursorin';
+                var eventName = (inPrevSelectionRange) ? 'rangeout' : 'rangein';
                 textObject.emit(eventName, child, i, textObject);
             }
         }
@@ -34087,6 +34109,33 @@
             }, this);
     };
 
+    var RegisterRangeStyle = function (rangeStyle) {
+        if (IsEmpty(rangeStyle)) {
+            return;
+        }
+
+        this
+            .setRangeStyle(rangeStyle)
+            .on('rangein', function (child) {
+                var rangeStyle = this.rangeStyle;
+                var styleSave = GetPartialData(child.style, rangeStyle);
+                if (IsKeyValueEqual(rangeStyle, styleSave)) {
+                    return;
+                }
+
+                child.styleSave = styleSave;
+                child.modifyStyle(rangeStyle);
+            }, this)
+            .on('rangeout', function (child) {
+                if (!child.styleSave) {
+                    return;
+                }
+
+                child.modifyStyle(child.styleSave);
+                child.styleSave = undefined;
+            }, this);
+    };
+
     var RegisterFocusStyle = function (focusStyle) {
         if (IsEmpty(focusStyle)) {
             return;
@@ -34735,6 +34784,7 @@
 
             var focusStyle = ExtractByPrefix(config.background, 'focus');
             var cursorStyle = ExtractByPrefix(config.style, 'cursor');
+            var rangeStyle = ExtractByPrefix(config.style, 'range');
 
             super(scene, x, y, fixedWidth, fixedHeight, config);
             this.type = 'rexCanvasInput';
@@ -34762,19 +34812,41 @@
             }
             RegisterCursorStyle.call(this, cursorStyle);
 
+            if (config.rangeStyle) {
+                Object.assign(rangeStyle, config.rangeStyle);
+            }
+            if (IsEmpty(rangeStyle)) {
+                Object.assign(rangeStyle, cursorStyle);
+            }
+            RegisterRangeStyle.call(this, rangeStyle);
+
+
             var addCharCallback = config.onAddChar;
             if (addCharCallback) {
                 this.on('addchar', addCharCallback);
             }
 
+            var cursorInCallback = config.onCursorIn;
+            if (cursorInCallback) {
+                this.on('cursorin', cursorInCallback);
+            }
+
             var cursorOutCallback = config.onCursorOut;
             if (cursorOutCallback) {
                 this.on('cursorout', cursorOutCallback);
             }
-            var cursorInCallback = config.onCursorIn;
-            if (cursorInCallback) {
-                this.on('cursorin', cursorInCallback);
+
+            var useCursorCallback = !config.onRangeIn && !config.onRangeOut;
+            var rangeInCallback = (!useCursorCallback) ? config.onRangeIn : config.onCursorIn;
+            if (rangeInCallback) {
+                this.on('rangein', rangeInCallback);
             }
+
+            var rangeOutCallback = (!useCursorCallback) ? config.onRangeOut : config.onCursorOut;
+            if (rangeOutCallback) {
+                this.on('rangeout', rangeOutCallback);
+            }
+
             var moveCursorCallback = config.onMoveCursor;
             if (moveCursorCallback) {
                 this.on('movecursor', moveCursorCallback);
@@ -34969,6 +35041,11 @@
             return this;
         }
 
+        setRangeStyle(style) {
+            this.rangeStyle = style;
+            return this;
+        }
+
         setNumberInput() {
             this.textEdit
                 .setNumberInput()

diff --git a/dist/rexcolorcomponents.min.js b/dist/rexcolorcomponents.min.js