@leafer-in/robot 1.0.3

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023-present, Chao (Leafer) Wan
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1 @@
+# @leafer-in/robot

package/dist/robot.cjs

@@ -0,0 +1,187 @@
+'use strict';
+
+var draw = require('@leafer-ui/draw');
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+class RobotData extends draw.UIData {
+    setRobot(value) {
+        this._robot = value;
+        this.__leaf.__updateRobot();
+    }
+    setAction(value) {
+        this._action = value;
+        this.__leaf.__updateAction();
+    }
+}
+
+exports.Robot = class Robot extends draw.UI {
+    get __tag() { return 'Robot'; }
+    get nowFrame() { return this.robotFrames && this.robotFrames[this.now]; }
+    constructor(data) {
+        super(data);
+        this.__.__drawAfterFill = true;
+    }
+    play() {
+        this.running = true;
+    }
+    pause() {
+        this.running = false;
+    }
+    stop() {
+        this.pause();
+    }
+    __updateRobot() {
+        const { robot } = this;
+        this.robotFrames = [];
+        if (!robot)
+            return;
+        let start = 0;
+        if (robot instanceof Array)
+            robot.forEach(frame => this.__loadRobot(frame, start, start += frame.total || 1));
+        else
+            this.__loadRobot(robot, 0, robot.total);
+    }
+    __updateAction() {
+        const action = this.actions[this.action];
+        this.stop();
+        if (this.__timer)
+            clearTimeout(this.__timer);
+        if (action === undefined)
+            return;
+        if (typeof action === 'number') {
+            this.now = action;
+        }
+        else if (action instanceof Array) {
+            const { length } = action;
+            if (length > 1) {
+                const start = this.now = action[0], end = action[action.length - 1];
+                this.play();
+                this.__runAction(start, end);
+            }
+            else if (length)
+                this.now = action[0];
+        }
+    }
+    __loadRobot(frame, start, end) {
+        for (let i = start; i < end; i++)
+            this.robotFrames.push(undefined);
+        const image = draw.ImageManager.get(frame);
+        if (image.ready)
+            this.__createFrames(image, frame, start, end);
+        else
+            image.load(() => this.__createFrames(image, frame, start, end));
+    }
+    __createFrames(image, frame, start, end) {
+        const { offset, size, total } = frame;
+        const { width, height } = size && (typeof size === 'number' ? { width: size, height: size } : size) || (total > 1 ? this : image);
+        let x = offset ? offset.x : 0, y = offset ? offset.y : 0;
+        for (let i = start; i < end; i++) {
+            this.robotFrames[i] = { view: image.view, x, y, width, height };
+            if (x + width >= image.width)
+                x = 0, y += height;
+            else
+                x += width;
+        }
+        this.__updateRobotBounds();
+        this.forceRender();
+        this.emitEvent(new draw.ImageEvent(draw.ImageEvent.LOADED, { image }));
+    }
+    __runAction(start, end) {
+        this.__timer = setTimeout(() => {
+            if (this.running) {
+                if (this.now === end)
+                    this.now = start;
+                else
+                    this.now++;
+                this.__updateRobotBounds();
+            }
+            this.__runAction(start, end);
+        }, 1000 / this.FPS);
+    }
+    __updateRobotBounds() {
+        const { nowFrame } = this;
+        if (nowFrame) {
+            const data = this.__;
+            const width = nowFrame.width / data.pixelRatio;
+            const height = nowFrame.height / data.pixelRatio;
+            if (data.width !== width || data.height !== height)
+                this.forceUpdate('width');
+            data.__naturalWidth = width;
+            data.__naturalHeight = height;
+        }
+    }
+    __drawAfterFill(canvas, _options) {
+        const { nowFrame } = this;
+        if (nowFrame) {
+            const { width, height, cornerRadius } = this.__;
+            if (cornerRadius || this.pathInputed) {
+                canvas.save();
+                canvas.clip();
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+                canvas.restore();
+            }
+            else {
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+            }
+        }
+    }
+    destroy() {
+        if (this.robotFrames)
+            this.robotFrames = null;
+        super.destroy();
+    }
+};
+__decorate([
+    draw.dataProcessor(RobotData)
+], exports.Robot.prototype, "__", void 0);
+__decorate([
+    draw.boundsType()
+], exports.Robot.prototype, "robot", void 0);
+__decorate([
+    draw.dataType()
+], exports.Robot.prototype, "actions", void 0);
+__decorate([
+    draw.dataType('')
+], exports.Robot.prototype, "action", void 0);
+__decorate([
+    draw.surfaceType(0)
+], exports.Robot.prototype, "now", void 0);
+__decorate([
+    draw.dataType(12)
+], exports.Robot.prototype, "FPS", void 0);
+__decorate([
+    draw.dataType(true)
+], exports.Robot.prototype, "loop", void 0);
+exports.Robot = __decorate([
+    draw.registerUI()
+], exports.Robot);
+
+exports.RobotData = RobotData;

package/dist/robot.esm.js

@@ -0,0 +1,185 @@
+import { UIData, dataProcessor, boundsType, dataType, surfaceType, registerUI, UI, ImageManager, ImageEvent } from '@leafer-ui/draw';
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+class RobotData extends UIData {
+    setRobot(value) {
+        this._robot = value;
+        this.__leaf.__updateRobot();
+    }
+    setAction(value) {
+        this._action = value;
+        this.__leaf.__updateAction();
+    }
+}
+
+let Robot = class Robot extends UI {
+    get __tag() { return 'Robot'; }
+    get nowFrame() { return this.robotFrames && this.robotFrames[this.now]; }
+    constructor(data) {
+        super(data);
+        this.__.__drawAfterFill = true;
+    }
+    play() {
+        this.running = true;
+    }
+    pause() {
+        this.running = false;
+    }
+    stop() {
+        this.pause();
+    }
+    __updateRobot() {
+        const { robot } = this;
+        this.robotFrames = [];
+        if (!robot)
+            return;
+        let start = 0;
+        if (robot instanceof Array)
+            robot.forEach(frame => this.__loadRobot(frame, start, start += frame.total || 1));
+        else
+            this.__loadRobot(robot, 0, robot.total);
+    }
+    __updateAction() {
+        const action = this.actions[this.action];
+        this.stop();
+        if (this.__timer)
+            clearTimeout(this.__timer);
+        if (action === undefined)
+            return;
+        if (typeof action === 'number') {
+            this.now = action;
+        }
+        else if (action instanceof Array) {
+            const { length } = action;
+            if (length > 1) {
+                const start = this.now = action[0], end = action[action.length - 1];
+                this.play();
+                this.__runAction(start, end);
+            }
+            else if (length)
+                this.now = action[0];
+        }
+    }
+    __loadRobot(frame, start, end) {
+        for (let i = start; i < end; i++)
+            this.robotFrames.push(undefined);
+        const image = ImageManager.get(frame);
+        if (image.ready)
+            this.__createFrames(image, frame, start, end);
+        else
+            image.load(() => this.__createFrames(image, frame, start, end));
+    }
+    __createFrames(image, frame, start, end) {
+        const { offset, size, total } = frame;
+        const { width, height } = size && (typeof size === 'number' ? { width: size, height: size } : size) || (total > 1 ? this : image);
+        let x = offset ? offset.x : 0, y = offset ? offset.y : 0;
+        for (let i = start; i < end; i++) {
+            this.robotFrames[i] = { view: image.view, x, y, width, height };
+            if (x + width >= image.width)
+                x = 0, y += height;
+            else
+                x += width;
+        }
+        this.__updateRobotBounds();
+        this.forceRender();
+        this.emitEvent(new ImageEvent(ImageEvent.LOADED, { image }));
+    }
+    __runAction(start, end) {
+        this.__timer = setTimeout(() => {
+            if (this.running) {
+                if (this.now === end)
+                    this.now = start;
+                else
+                    this.now++;
+                this.__updateRobotBounds();
+            }
+            this.__runAction(start, end);
+        }, 1000 / this.FPS);
+    }
+    __updateRobotBounds() {
+        const { nowFrame } = this;
+        if (nowFrame) {
+            const data = this.__;
+            const width = nowFrame.width / data.pixelRatio;
+            const height = nowFrame.height / data.pixelRatio;
+            if (data.width !== width || data.height !== height)
+                this.forceUpdate('width');
+            data.__naturalWidth = width;
+            data.__naturalHeight = height;
+        }
+    }
+    __drawAfterFill(canvas, _options) {
+        const { nowFrame } = this;
+        if (nowFrame) {
+            const { width, height, cornerRadius } = this.__;
+            if (cornerRadius || this.pathInputed) {
+                canvas.save();
+                canvas.clip();
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+                canvas.restore();
+            }
+            else {
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+            }
+        }
+    }
+    destroy() {
+        if (this.robotFrames)
+            this.robotFrames = null;
+        super.destroy();
+    }
+};
+__decorate([
+    dataProcessor(RobotData)
+], Robot.prototype, "__", void 0);
+__decorate([
+    boundsType()
+], Robot.prototype, "robot", void 0);
+__decorate([
+    dataType()
+], Robot.prototype, "actions", void 0);
+__decorate([
+    dataType('')
+], Robot.prototype, "action", void 0);
+__decorate([
+    surfaceType(0)
+], Robot.prototype, "now", void 0);
+__decorate([
+    dataType(12)
+], Robot.prototype, "FPS", void 0);
+__decorate([
+    dataType(true)
+], Robot.prototype, "loop", void 0);
+Robot = __decorate([
+    registerUI()
+], Robot);
+
+export { Robot, RobotData };

package/dist/robot.esm.min.js

@@ -0,0 +1 @@
+import{UIData as t,dataProcessor as e,boundsType as o,dataType as i,surfaceType as s,registerUI as r,UI as h,ImageManager as n,ImageEvent as a}from"@leafer-ui/draw";function _(t,e,o,i){var s,r=arguments.length,h=r<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)h=Reflect.decorate(t,e,o,i);else for(var n=t.length-1;n>=0;n--)(s=t[n])&&(h=(r<3?s(h):r>3?s(e,o,h):s(e,o))||h);return r>3&&h&&Object.defineProperty(e,o,h),h}"function"==typeof SuppressedError&&SuppressedError;class d extends t{setRobot(t){this._robot=t,this.__leaf.__updateRobot()}setAction(t){this._action=t,this.__leaf.__updateAction()}}let p=class extends h{get __tag(){return"Robot"}get nowFrame(){return this.robotFrames&&this.robotFrames[this.now]}constructor(t){super(t),this.__.__drawAfterFill=!0}play(){this.running=!0}pause(){this.running=!1}stop(){this.pause()}__updateRobot(){const{robot:t}=this;if(this.robotFrames=[],!t)return;let e=0;t instanceof Array?t.forEach((t=>this.__loadRobot(t,e,e+=t.total||1))):this.__loadRobot(t,0,t.total)}__updateAction(){const t=this.actions[this.action];if(this.stop(),this.__timer&&clearTimeout(this.__timer),void 0!==t)if("number"==typeof t)this.now=t;else if(t instanceof Array){const{length:e}=t;if(e>1){const e=this.now=t[0],o=t[t.length-1];this.play(),this.__runAction(e,o)}else e&&(this.now=t[0])}}__loadRobot(t,e,o){for(let t=e;t<o;t++)this.robotFrames.push(void 0);const i=n.get(t);i.ready?this.__createFrames(i,t,e,o):i.load((()=>this.__createFrames(i,t,e,o)))}__createFrames(t,e,o,i){const{offset:s,size:r,total:h}=e,{width:n,height:_}=r&&("number"==typeof r?{width:r,height:r}:r)||(h>1?this:t);let d=s?s.x:0,p=s?s.y:0;for(let e=o;e<i;e++)this.robotFrames[e]={view:t.view,x:d,y:p,width:n,height:_},d+n>=t.width?(d=0,p+=_):d+=n;this.__updateRobotBounds(),this.forceRender(),this.emitEvent(new a(a.LOADED,{image:t}))}__runAction(t,e){this.__timer=setTimeout((()=>{this.running&&(this.now===e?this.now=t:this.now++,this.__updateRobotBounds()),this.__runAction(t,e)}),1e3/this.FPS)}__updateRobotBounds(){const{nowFrame:t}=this;if(t){const e=this.__,o=t.width/e.pixelRatio,i=t.height/e.pixelRatio;e.width===o&&e.height===i||this.forceUpdate("width"),e.__naturalWidth=o,e.__naturalHeight=i}}__drawAfterFill(t,e){const{nowFrame:o}=this;if(o){const{width:e,height:i,cornerRadius:s}=this.__;s||this.pathInputed?(t.save(),t.clip(),t.drawImage(o.view,o.x,o.y,o.width,o.height,0,0,e,i),t.restore()):t.drawImage(o.view,o.x,o.y,o.width,o.height,0,0,e,i)}}destroy(){this.robotFrames&&(this.robotFrames=null),super.destroy()}};_([e(d)],p.prototype,"__",void 0),_([o()],p.prototype,"robot",void 0),_([i()],p.prototype,"actions",void 0),_([i("")],p.prototype,"action",void 0),_([s(0)],p.prototype,"now",void 0),_([i(12)],p.prototype,"FPS",void 0),_([i(!0)],p.prototype,"loop",void 0),p=_([r()],p);export{p as Robot,d as RobotData};

package/dist/robot.js

@@ -0,0 +1,191 @@
+this.LeaferIN = this.LeaferIN || {};
+this.LeaferIN.Robot = (function (exports, draw) {
+    'use strict';
+
+    /******************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+    /* global Reflect, Promise, SuppressedError, Symbol */
+
+
+    function __decorate(decorators, target, key, desc) {
+        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+    }
+
+    typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+        var e = new Error(message);
+        return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+    };
+
+    class RobotData extends draw.UIData {
+        setRobot(value) {
+            this._robot = value;
+            this.__leaf.__updateRobot();
+        }
+        setAction(value) {
+            this._action = value;
+            this.__leaf.__updateAction();
+        }
+    }
+
+    exports.Robot = class Robot extends draw.UI {
+        get __tag() { return 'Robot'; }
+        get nowFrame() { return this.robotFrames && this.robotFrames[this.now]; }
+        constructor(data) {
+            super(data);
+            this.__.__drawAfterFill = true;
+        }
+        play() {
+            this.running = true;
+        }
+        pause() {
+            this.running = false;
+        }
+        stop() {
+            this.pause();
+        }
+        __updateRobot() {
+            const { robot } = this;
+            this.robotFrames = [];
+            if (!robot)
+                return;
+            let start = 0;
+            if (robot instanceof Array)
+                robot.forEach(frame => this.__loadRobot(frame, start, start += frame.total || 1));
+            else
+                this.__loadRobot(robot, 0, robot.total);
+        }
+        __updateAction() {
+            const action = this.actions[this.action];
+            this.stop();
+            if (this.__timer)
+                clearTimeout(this.__timer);
+            if (action === undefined)
+                return;
+            if (typeof action === 'number') {
+                this.now = action;
+            }
+            else if (action instanceof Array) {
+                const { length } = action;
+                if (length > 1) {
+                    const start = this.now = action[0], end = action[action.length - 1];
+                    this.play();
+                    this.__runAction(start, end);
+                }
+                else if (length)
+                    this.now = action[0];
+            }
+        }
+        __loadRobot(frame, start, end) {
+            for (let i = start; i < end; i++)
+                this.robotFrames.push(undefined);
+            const image = draw.ImageManager.get(frame);
+            if (image.ready)
+                this.__createFrames(image, frame, start, end);
+            else
+                image.load(() => this.__createFrames(image, frame, start, end));
+        }
+        __createFrames(image, frame, start, end) {
+            const { offset, size, total } = frame;
+            const { width, height } = size && (typeof size === 'number' ? { width: size, height: size } : size) || (total > 1 ? this : image);
+            let x = offset ? offset.x : 0, y = offset ? offset.y : 0;
+            for (let i = start; i < end; i++) {
+                this.robotFrames[i] = { view: image.view, x, y, width, height };
+                if (x + width >= image.width)
+                    x = 0, y += height;
+                else
+                    x += width;
+            }
+            this.__updateRobotBounds();
+            this.forceRender();
+            this.emitEvent(new draw.ImageEvent(draw.ImageEvent.LOADED, { image }));
+        }
+        __runAction(start, end) {
+            this.__timer = setTimeout(() => {
+                if (this.running) {
+                    if (this.now === end)
+                        this.now = start;
+                    else
+                        this.now++;
+                    this.__updateRobotBounds();
+                }
+                this.__runAction(start, end);
+            }, 1000 / this.FPS);
+        }
+        __updateRobotBounds() {
+            const { nowFrame } = this;
+            if (nowFrame) {
+                const data = this.__;
+                const width = nowFrame.width / data.pixelRatio;
+                const height = nowFrame.height / data.pixelRatio;
+                if (data.width !== width || data.height !== height)
+                    this.forceUpdate('width');
+                data.__naturalWidth = width;
+                data.__naturalHeight = height;
+            }
+        }
+        __drawAfterFill(canvas, _options) {
+            const { nowFrame } = this;
+            if (nowFrame) {
+                const { width, height, cornerRadius } = this.__;
+                if (cornerRadius || this.pathInputed) {
+                    canvas.save();
+                    canvas.clip();
+                    canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+                    canvas.restore();
+                }
+                else {
+                    canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height);
+                }
+            }
+        }
+        destroy() {
+            if (this.robotFrames)
+                this.robotFrames = null;
+            super.destroy();
+        }
+    };
+    __decorate([
+        draw.dataProcessor(RobotData)
+    ], exports.Robot.prototype, "__", void 0);
+    __decorate([
+        draw.boundsType()
+    ], exports.Robot.prototype, "robot", void 0);
+    __decorate([
+        draw.dataType()
+    ], exports.Robot.prototype, "actions", void 0);
+    __decorate([
+        draw.dataType('')
+    ], exports.Robot.prototype, "action", void 0);
+    __decorate([
+        draw.surfaceType(0)
+    ], exports.Robot.prototype, "now", void 0);
+    __decorate([
+        draw.dataType(12)
+    ], exports.Robot.prototype, "FPS", void 0);
+    __decorate([
+        draw.dataType(true)
+    ], exports.Robot.prototype, "loop", void 0);
+    exports.Robot = __decorate([
+        draw.registerUI()
+    ], exports.Robot);
+
+    exports.RobotData = RobotData;
+
+    return exports;
+
+})({}, LeaferUI);

package/dist/robot.min.cjs

@@ -0,0 +1 @@
+"use strict";var t=require("@leafer-ui/draw");function o(t,o,e,i){var s,r=arguments.length,a=r<3?o:null===i?i=Object.getOwnPropertyDescriptor(o,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,o,e,i);else for(var n=t.length-1;n>=0;n--)(s=t[n])&&(a=(r<3?s(a):r>3?s(o,e,a):s(o,e))||a);return r>3&&a&&Object.defineProperty(o,e,a),a}"function"==typeof SuppressedError&&SuppressedError;class e extends t.UIData{setRobot(t){this._robot=t,this.__leaf.__updateRobot()}setAction(t){this._action=t,this.__leaf.__updateAction()}}exports.Robot=class extends t.UI{get __tag(){return"Robot"}get nowFrame(){return this.robotFrames&&this.robotFrames[this.now]}constructor(t){super(t),this.__.__drawAfterFill=!0}play(){this.running=!0}pause(){this.running=!1}stop(){this.pause()}__updateRobot(){const{robot:t}=this;if(this.robotFrames=[],!t)return;let o=0;t instanceof Array?t.forEach((t=>this.__loadRobot(t,o,o+=t.total||1))):this.__loadRobot(t,0,t.total)}__updateAction(){const t=this.actions[this.action];if(this.stop(),this.__timer&&clearTimeout(this.__timer),void 0!==t)if("number"==typeof t)this.now=t;else if(t instanceof Array){const{length:o}=t;if(o>1){const o=this.now=t[0],e=t[t.length-1];this.play(),this.__runAction(o,e)}else o&&(this.now=t[0])}}__loadRobot(o,e,i){for(let t=e;t<i;t++)this.robotFrames.push(void 0);const s=t.ImageManager.get(o);s.ready?this.__createFrames(s,o,e,i):s.load((()=>this.__createFrames(s,o,e,i)))}__createFrames(o,e,i,s){const{offset:r,size:a,total:n}=e,{width:h,height:p}=a&&("number"==typeof a?{width:a,height:a}:a)||(n>1?this:o);let _=r?r.x:0,d=r?r.y:0;for(let t=i;t<s;t++)this.robotFrames[t]={view:o.view,x:_,y:d,width:h,height:p},_+h>=o.width?(_=0,d+=p):_+=h;this.__updateRobotBounds(),this.forceRender(),this.emitEvent(new t.ImageEvent(t.ImageEvent.LOADED,{image:o}))}__runAction(t,o){this.__timer=setTimeout((()=>{this.running&&(this.now===o?this.now=t:this.now++,this.__updateRobotBounds()),this.__runAction(t,o)}),1e3/this.FPS)}__updateRobotBounds(){const{nowFrame:t}=this;if(t){const o=this.__,e=t.width/o.pixelRatio,i=t.height/o.pixelRatio;o.width===e&&o.height===i||this.forceUpdate("width"),o.__naturalWidth=e,o.__naturalHeight=i}}__drawAfterFill(t,o){const{nowFrame:e}=this;if(e){const{width:o,height:i,cornerRadius:s}=this.__;s||this.pathInputed?(t.save(),t.clip(),t.drawImage(e.view,e.x,e.y,e.width,e.height,0,0,o,i),t.restore()):t.drawImage(e.view,e.x,e.y,e.width,e.height,0,0,o,i)}}destroy(){this.robotFrames&&(this.robotFrames=null),super.destroy()}},o([t.dataProcessor(e)],exports.Robot.prototype,"__",void 0),o([t.boundsType()],exports.Robot.prototype,"robot",void 0),o([t.dataType()],exports.Robot.prototype,"actions",void 0),o([t.dataType("")],exports.Robot.prototype,"action",void 0),o([t.surfaceType(0)],exports.Robot.prototype,"now",void 0),o([t.dataType(12)],exports.Robot.prototype,"FPS",void 0),o([t.dataType(!0)],exports.Robot.prototype,"loop",void 0),exports.Robot=o([t.registerUI()],exports.Robot),exports.RobotData=e;

package/dist/robot.min.js

@@ -0,0 +1 @@
+this.LeaferIN=this.LeaferIN||{},this.LeaferIN.Robot=function(t,o){"use strict";function e(t,o,e,i){var s,r=arguments.length,a=r<3?o:null===i?i=Object.getOwnPropertyDescriptor(o,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,o,e,i);else for(var n=t.length-1;n>=0;n--)(s=t[n])&&(a=(r<3?s(a):r>3?s(o,e,a):s(o,e))||a);return r>3&&a&&Object.defineProperty(o,e,a),a}"function"==typeof SuppressedError&&SuppressedError;class i extends o.UIData{setRobot(t){this._robot=t,this.__leaf.__updateRobot()}setAction(t){this._action=t,this.__leaf.__updateAction()}}return t.Robot=class extends o.UI{get __tag(){return"Robot"}get nowFrame(){return this.robotFrames&&this.robotFrames[this.now]}constructor(t){super(t),this.__.__drawAfterFill=!0}play(){this.running=!0}pause(){this.running=!1}stop(){this.pause()}__updateRobot(){const{robot:t}=this;if(this.robotFrames=[],!t)return;let o=0;t instanceof Array?t.forEach((t=>this.__loadRobot(t,o,o+=t.total||1))):this.__loadRobot(t,0,t.total)}__updateAction(){const t=this.actions[this.action];if(this.stop(),this.__timer&&clearTimeout(this.__timer),void 0!==t)if("number"==typeof t)this.now=t;else if(t instanceof Array){const{length:o}=t;if(o>1){const o=this.now=t[0],e=t[t.length-1];this.play(),this.__runAction(o,e)}else o&&(this.now=t[0])}}__loadRobot(t,e,i){for(let t=e;t<i;t++)this.robotFrames.push(void 0);const s=o.ImageManager.get(t);s.ready?this.__createFrames(s,t,e,i):s.load((()=>this.__createFrames(s,t,e,i)))}__createFrames(t,e,i,s){const{offset:r,size:a,total:n}=e,{width:h,height:_}=a&&("number"==typeof a?{width:a,height:a}:a)||(n>1?this:t);let d=r?r.x:0,p=r?r.y:0;for(let o=i;o<s;o++)this.robotFrames[o]={view:t.view,x:d,y:p,width:h,height:_},d+h>=t.width?(d=0,p+=_):d+=h;this.__updateRobotBounds(),this.forceRender(),this.emitEvent(new o.ImageEvent(o.ImageEvent.LOADED,{image:t}))}__runAction(t,o){this.__timer=setTimeout((()=>{this.running&&(this.now===o?this.now=t:this.now++,this.__updateRobotBounds()),this.__runAction(t,o)}),1e3/this.FPS)}__updateRobotBounds(){const{nowFrame:t}=this;if(t){const o=this.__,e=t.width/o.pixelRatio,i=t.height/o.pixelRatio;o.width===e&&o.height===i||this.forceUpdate("width"),o.__naturalWidth=e,o.__naturalHeight=i}}__drawAfterFill(t,o){const{nowFrame:e}=this;if(e){const{width:o,height:i,cornerRadius:s}=this.__;s||this.pathInputed?(t.save(),t.clip(),t.drawImage(e.view,e.x,e.y,e.width,e.height,0,0,o,i),t.restore()):t.drawImage(e.view,e.x,e.y,e.width,e.height,0,0,o,i)}}destroy(){this.robotFrames&&(this.robotFrames=null),super.destroy()}},e([o.dataProcessor(i)],t.Robot.prototype,"__",void 0),e([o.boundsType()],t.Robot.prototype,"robot",void 0),e([o.dataType()],t.Robot.prototype,"actions",void 0),e([o.dataType("")],t.Robot.prototype,"action",void 0),e([o.surfaceType(0)],t.Robot.prototype,"now",void 0),e([o.dataType(12)],t.Robot.prototype,"FPS",void 0),e([o.dataType(!0)],t.Robot.prototype,"loop",void 0),t.Robot=e([o.registerUI()],t.Robot),t.RobotData=i,t}({},LeaferUI);

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@leafer-in/robot",
+  "version": "1.0.3",
+  "description": "@leafer-in/robot",
+  "author": "Chao (Leafer) Wan",
+  "license": "MIT",
+  "type": "module",
+  "main": "dist/robot.esm.js",
+  "exports": {
+    "import": "./dist/robot.esm.js",
+    "require": "./dist/robot.cjs",
+    "types": "./types/index.d.ts"
+  },
+  "types": "types/index.d.ts",
+  "unpkg": "dist/robot.js",
+  "jsdelivr": "dist/robot.js",
+  "files": [
+    "src",
+    "types",
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/leaferjs/in.git"
+  },
+  "homepage": "https://github.com/leaferjs/in/tree/main/packages/robot",
+  "bugs": "https://github.com/leaferjs/in/issues",
+  "keywords": [
+    "leafer robot",
+    "leafer-robot",
+    "leafer-in",
+    "robot",
+    "leafer-ui",
+    "leaferjs"
+  ],
+  "dependencies": {
+    "@leafer-ui/draw": "^1.0.3",
+    "@leafer-ui/interface": "^1.0.3",
+    "@leafer-in/interface": "^1.0.3"
+  }
+}

package/src/Robot.ts

@@ -0,0 +1,169 @@
+import { ILeaferCanvas, IRenderOptions, ILeaferImage, IRobot, IRobotData, IRobotInputData, IRobotKeyframe, IRobotActions, IRobotActionName, IRobotComputedKeyframe } from '@leafer-ui/interface'
+import { UI, registerUI, dataProcessor, ImageEvent, surfaceType, ImageManager, dataType, boundsType } from '@leafer-ui/draw'
+
+import { RobotData } from './data/RobotData'
+
+
+@registerUI()
+export class Robot extends UI implements IRobot {
+
+    public get __tag() { return 'Robot' }
+
+    public running: boolean
+
+    public get nowFrame(): IRobotComputedKeyframe { return this.robotFrames && this.robotFrames[this.now] }
+
+    public robotFrames?: IRobotComputedKeyframe[]
+
+
+    @dataProcessor(RobotData)
+    declare public __: IRobotData
+
+    @boundsType()
+    public robot?: IRobotKeyframe | IRobotKeyframe[]
+
+    @dataType()
+    public actions?: IRobotActions
+
+    @dataType('')
+    public action?: IRobotActionName
+
+    @surfaceType(0)
+    public now?: number
+
+    @dataType(12)
+    public FPS?: number
+
+    @dataType(true)
+    public loop?: boolean
+
+
+    protected __timer: any
+
+
+    constructor(data?: IRobotInputData) {
+        super(data)
+        this.__.__drawAfterFill = true
+    }
+
+
+    public play(): void {
+        this.running = true
+    }
+
+    public pause(): void {
+        this.running = false
+    }
+
+    public stop(): void {
+        this.pause()
+    }
+
+
+    public __updateRobot(): void {
+        const { robot } = this
+        this.robotFrames = []
+        if (!robot) return
+
+        let start = 0
+        if (robot instanceof Array) robot.forEach(frame => this.__loadRobot(frame, start, start += frame.total || 1))
+        else this.__loadRobot(robot, 0, robot.total)
+    }
+
+    public __updateAction(): void {
+        const action = this.actions[this.action]
+
+        this.stop()
+
+        if (this.__timer) clearTimeout(this.__timer)
+        if (action === undefined) return
+
+        if (typeof action === 'number') {
+
+            this.now = action
+
+        } else if (action instanceof Array) {
+
+            const { length } = action
+            if (length > 1) {
+                const start = this.now = action[0], end = action[action.length - 1]
+                this.play()
+                this.__runAction(start, end)
+            } else if (length) this.now = action[0]
+
+        }
+    }
+
+
+    protected __loadRobot(frame: IRobotKeyframe, start: number, end: number): void {
+        for (let i = start; i < end; i++) this.robotFrames.push(undefined)
+
+        const image = ImageManager.get(frame)
+        if (image.ready) this.__createFrames(image, frame, start, end)
+        else image.load(() => this.__createFrames(image, frame, start, end))
+    }
+
+    protected __createFrames(image: ILeaferImage, frame: IRobotKeyframe, start: number, end: number): void {
+        const { offset, size, total } = frame
+        const { width, height } = size && (typeof size === 'number' ? { width: size, height: size } : size) || (total > 1 ? this : image)
+
+        let x = offset ? offset.x : 0, y = offset ? offset.y : 0
+
+        for (let i = start; i < end; i++) {
+            this.robotFrames[i] = { view: image.view, x, y, width, height }
+            if (x + width >= image.width) x = 0, y += height
+            else x += width
+        }
+
+        this.__updateRobotBounds()
+        this.forceRender()
+        this.emitEvent(new ImageEvent(ImageEvent.LOADED, { image }))
+    }
+
+
+    protected __runAction(start: number, end: number): void {
+        this.__timer = setTimeout(() => {
+            if (this.running) {
+                if (this.now === end) this.now = start
+                else this.now++
+                this.__updateRobotBounds()
+            }
+
+            this.__runAction(start, end)
+        }, 1000 / this.FPS)
+    }
+
+    protected __updateRobotBounds(): void {
+        const { nowFrame } = this
+        if (nowFrame) {
+            const data = this.__
+            const width = nowFrame.width / data.pixelRatio
+            const height = nowFrame.height / data.pixelRatio
+            if (data.width !== width || data.height !== height) this.forceUpdate('width')
+
+            data.__naturalWidth = width
+            data.__naturalHeight = height
+        }
+    }
+
+    public __drawAfterFill(canvas: ILeaferCanvas, _options: IRenderOptions): void {
+        const { nowFrame } = this
+        if (nowFrame) {
+            const { width, height, cornerRadius } = this.__
+            if (cornerRadius || this.pathInputed) {
+                canvas.save()
+                canvas.clip()
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height)
+                canvas.restore()
+            } else {
+                canvas.drawImage(nowFrame.view, nowFrame.x, nowFrame.y, nowFrame.width, nowFrame.height, 0, 0, width, height)
+            }
+        }
+    }
+
+    public destroy(): void {
+        if (this.robotFrames) this.robotFrames = null
+        super.destroy()
+    }
+
+}

package/src/data/RobotData.ts

@@ -0,0 +1,20 @@
+import { IRobot, IRobotActionName, IRobotKeyframe } from '@leafer-ui/interface'
+import { UIData } from '@leafer-ui/draw'
+
+
+export class RobotData extends UIData {
+
+    protected _robot: IRobotKeyframe | IRobotKeyframe[]
+    protected _action: IRobotActionName
+
+    protected setRobot(value: IRobotKeyframe | IRobotKeyframe[]): void {
+        this._robot = value;
+        (this.__leaf as IRobot).__updateRobot()
+    }
+
+    protected setAction(value: IRobotActionName): void {
+        this._action = value;
+        (this.__leaf as IRobot).__updateAction()
+    }
+
+}

package/src/index.ts

@@ -0,0 +1,2 @@
+export { Robot } from './Robot'
+export { RobotData } from './data/RobotData'

package/types/index.d.ts

@@ -0,0 +1,38 @@
+import { IRobot, IRobotComputedKeyframe, IRobotData, IRobotKeyframe, IRobotActions, IRobotActionName, IRobotInputData, ILeaferImage, ILeaferCanvas, IRenderOptions } from '@leafer-ui/interface';
+import { UI, UIData } from '@leafer-ui/draw';
+
+declare class Robot extends UI implements IRobot {
+    get __tag(): string;
+    running: boolean;
+    get nowFrame(): IRobotComputedKeyframe;
+    robotFrames?: IRobotComputedKeyframe[];
+    __: IRobotData;
+    robot?: IRobotKeyframe | IRobotKeyframe[];
+    actions?: IRobotActions;
+    action?: IRobotActionName;
+    now?: number;
+    FPS?: number;
+    loop?: boolean;
+    protected __timer: any;
+    constructor(data?: IRobotInputData);
+    play(): void;
+    pause(): void;
+    stop(): void;
+    __updateRobot(): void;
+    __updateAction(): void;
+    protected __loadRobot(frame: IRobotKeyframe, start: number, end: number): void;
+    protected __createFrames(image: ILeaferImage, frame: IRobotKeyframe, start: number, end: number): void;
+    protected __runAction(start: number, end: number): void;
+    protected __updateRobotBounds(): void;
+    __drawAfterFill(canvas: ILeaferCanvas, _options: IRenderOptions): void;
+    destroy(): void;
+}
+
+declare class RobotData extends UIData {
+    protected _robot: IRobotKeyframe | IRobotKeyframe[];
+    protected _action: IRobotActionName;
+    protected setRobot(value: IRobotKeyframe | IRobotKeyframe[]): void;
+    protected setAction(value: IRobotActionName): void;
+}
+
+export { Robot, RobotData };