@rive-app/webgl2 2.15.5 → 2.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rive-app/webgl2",
-  "version": "2.15.5",
+  "version": "2.16.0",
   "description": "Rive's webgl2 based web api.",
   "main": "rive.js",
   "homepage": "https://rive.app",

package/rive.d.ts

@@ -123,7 +123,7 @@ export declare enum EventType {
 export type RiveEventPayload = rc.RiveEvent | rc.OpenUrlEvent;
 export interface Event {
     type: EventType;
-    data?: string | string[] | LoopEvent | number | RiveEventPayload;
+    data?: string | string[] | LoopEvent | number | RiveEventPayload | RiveFile;
 }
 /**
  * Looping types: one-shot, loop, and ping-pong
@@ -189,6 +189,7 @@ export interface RiveParameters {
     canvas: HTMLCanvasElement | OffscreenCanvas;
     src?: string;
     buffer?: ArrayBuffer;
+    riveFile?: RiveFile;
     artboard?: string;
     animations?: string | string[];
     stateMachines?: string | string[];
@@ -265,6 +266,7 @@ export interface RiveParameters {
 export interface RiveLoadParameters {
     src?: string;
     buffer?: ArrayBuffer;
+    riveFile?: RiveFile;
     autoplay?: boolean;
     artboard?: string;
     animations?: string | string[];
@@ -278,6 +280,50 @@ export interface RiveResetParameters {
     stateMachines?: string | string[];
     autoplay?: boolean;
 }
+export interface RiveFileParameters {
+    src?: string;
+    buffer?: ArrayBuffer;
+    assetLoader?: AssetLoadCallback;
+    enableRiveAssetCDN?: boolean;
+    onLoad?: EventCallback;
+    onLoadError?: EventCallback;
+}
+export declare class RiveFile {
+    private static readonly missingErrorMessage;
+    private static readonly fileLoadErrorMessage;
+    private src;
+    private buffer;
+    private runtime;
+    private file;
+    private assetLoader;
+    private enableRiveAssetCDN;
+    private eventManager;
+    private referenceCount;
+    constructor(params: RiveFileParameters);
+    private initData;
+    init(): Promise<void>;
+    /**
+     * Subscribe to Rive-generated events
+     * @param type the type of event to subscribe to
+     * @param callback callback to fire when the event occurs
+     */
+    on(type: EventType, callback: EventCallback): void;
+    /**
+     * Unsubscribes from a Rive-generated event
+     * @param type the type of event to unsubscribe from
+     * @param callback the callback to unsubscribe
+     */
+    off(type: EventType, callback: EventCallback): void;
+    cleanup(): void;
+    /**
+     * Unsubscribes all Rive listeners from an event type, or everything if no type is
+     * given
+     * @param type the type of event to unsubscribe from, or all types if
+     * undefined
+     */
+    removeAllRiveEventListeners(type?: EventType): void;
+    getInstance(): rc.File;
+}
 export declare class Rive {
     private readonly canvas;
     private src;
@@ -298,6 +344,7 @@ export declare class Rive {
     private artboard;
     private eventCleanup;
     private file;
+    private riveFile;
     private eventManager;
     private taskQueue;
     private animator;

package/rive.js

@@ -415,7 +415,7 @@ function Na(a, b) {
     return Ma(c, a, b);
   }));
 }
-var Oa, Pa, Ta = {470208:(a, b, c, d, e) => {
+var Oa, Pa, Ta = {470384:(a, b, c, d, e) => {
   if ("undefined" === typeof window || void 0 === (window.AudioContext || window.webkitAudioContext)) {
     return 0;
   }
@@ -478,9 +478,9 @@ var Oa, Pa, Ta = {470208:(a, b, c, d, e) => {
   }
   window.h.Da += 1;
   return 1;
-}, 472386:() => {
+}, 472562:() => {
   "undefined" !== typeof window.h && (--window.h.Da, 0 === window.h.Da && delete window.h);
-}, 472550:() => void 0 !== navigator.mediaDevices && void 0 !== navigator.mediaDevices.getUserMedia, 472654:() => {
+}, 472726:() => void 0 !== navigator.mediaDevices && void 0 !== navigator.mediaDevices.getUserMedia, 472830:() => {
   try {
     var a = new (window.AudioContext || window.webkitAudioContext)(), b = a.sampleRate;
     a.close();
@@ -488,7 +488,7 @@ var Oa, Pa, Ta = {470208:(a, b, c, d, e) => {
   } catch (c) {
     return 0;
   }
-}, 472825:(a, b, c, d, e, f) => {
+}, 473001:(a, b, c, d, e, f) => {
   if ("undefined" === typeof window.h) {
     return -1;
   }
@@ -534,7 +534,7 @@ var Oa, Pa, Ta = {470208:(a, b, c, d, e) => {
   a == window.h.I.Ba && g.Y.connect(g.J.destination);
   g.jb = f;
   return window.h.lc(g);
-}, 475702:a => window.h.va(a).J.sampleRate, 475775:a => {
+}, 475878:a => window.h.va(a).J.sampleRate, 475951:a => {
   a = window.h.va(a);
   void 0 !== a.Y && (a.Y.onaudioprocess = function() {
   }, a.Y.disconnect(), a.Y = void 0);
@@ -542,13 +542,13 @@ var Oa, Pa, Ta = {470208:(a, b, c, d, e) => {
   a.J.close();
   a.J = void 0;
   a.jb = void 0;
-}, 476175:a => {
+}, 476351:a => {
   window.h.wb(a);
-}, 476225:a => {
+}, 476401:a => {
   a = window.h.va(a);
   a.J.resume();
   a.state = window.h.ha.rb;
-}, 476364:a => {
+}, 476540:a => {
   a = window.h.va(a);
   a.J.suspend();
   a.state = window.h.ha.stopped;
@@ -3459,8 +3459,8 @@ n.dynCall_viijii = (a, b, c, d, e, f, g) => (n.dynCall_viijii = B.dynCall_viijii
 n.dynCall_iiiiij = (a, b, c, d, e, f, g) => (n.dynCall_iiiiij = B.dynCall_iiiiij)(a, b, c, d, e, f, g);
 n.dynCall_iiiiijj = (a, b, c, d, e, f, g, m, p) => (n.dynCall_iiiiijj = B.dynCall_iiiiijj)(a, b, c, d, e, f, g, m, p);
 n.dynCall_iiiiiijj = (a, b, c, d, e, f, g, m, p, l) => (n.dynCall_iiiiiijj = B.dynCall_iiiiiijj)(a, b, c, d, e, f, g, m, p, l);
-n.___start_em_js = 467584;
-n.___stop_em_js = 470208;
+n.___start_em_js = 467760;
+n.___stop_em_js = 470384;
 var Wd;
 Ga = function Xd() {
   Wd || Yd();
@@ -3520,7 +3520,7 @@ Yd();
 /* 2 */
 /***/ ((module) => {
 
-module.exports = JSON.parse('{"name":"@rive-app/webgl2","version":"2.15.5","description":"Rive\'s webgl2 based web api.","main":"rive.js","homepage":"https://rive.app","repository":{"type":"git","url":"https://github.com/rive-app/rive-wasm/tree/master/js"},"keywords":["rive","animation"],"author":"Rive","contributors":["Luigi Rosso <luigi@rive.app> (https://rive.app)","Maxwell Talbot <max@rive.app> (https://rive.app)","Arthur Vivian <arthur@rive.app> (https://rive.app)","Umberto Sonnino <umberto@rive.app> (https://rive.app)","Matthew Sullivan <matt.j.sullivan@gmail.com> (mailto:matt.j.sullivan@gmail.com)","Chris Dalton <chris@rive.app> (https://rive.app)"],"license":"MIT","files":["rive.js","rive.wasm","rive.js.map","rive.d.ts","rive_advanced.mjs.d.ts"],"typings":"rive.d.ts","dependencies":{},"browser":{"fs":false,"path":false}}');
+module.exports = JSON.parse('{"name":"@rive-app/webgl2","version":"2.16.0","description":"Rive\'s webgl2 based web api.","main":"rive.js","homepage":"https://rive.app","repository":{"type":"git","url":"https://github.com/rive-app/rive-wasm/tree/master/js"},"keywords":["rive","animation"],"author":"Rive","contributors":["Luigi Rosso <luigi@rive.app> (https://rive.app)","Maxwell Talbot <max@rive.app> (https://rive.app)","Arthur Vivian <arthur@rive.app> (https://rive.app)","Umberto Sonnino <umberto@rive.app> (https://rive.app)","Matthew Sullivan <matt.j.sullivan@gmail.com> (mailto:matt.j.sullivan@gmail.com)","Chris Dalton <chris@rive.app> (https://rive.app)"],"license":"MIT","files":["rive.js","rive.wasm","rive.js.map","rive.d.ts","rive_advanced.mjs.d.ts"],"typings":"rive.d.ts","dependencies":{},"browser":{"fs":false,"path":false}}');
 
 /***/ }),
 /* 3 */
@@ -3814,6 +3814,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   LoopType: () => (/* binding */ LoopType),
 /* harmony export */   Rive: () => (/* binding */ Rive),
 /* harmony export */   RiveEventType: () => (/* binding */ RiveEventType),
+/* harmony export */   RiveFile: () => (/* binding */ RiveFile),
 /* harmony export */   RuntimeLoader: () => (/* binding */ RuntimeLoader),
 /* harmony export */   StateMachineInput: () => (/* binding */ StateMachineInput),
 /* harmony export */   StateMachineInputType: () => (/* binding */ StateMachineInputType),
@@ -4999,6 +5000,142 @@ var ObjectObservers = /** @class */ (function () {
     return ObjectObservers;
 }());
 var observers = new ObjectObservers();
+var RiveFile = /** @class */ (function () {
+    function RiveFile(params) {
+        // Allow the runtime to automatically load assets hosted in Rive's runtime.
+        this.enableRiveAssetCDN = true;
+        this.referenceCount = 0;
+        this.src = params.src;
+        this.buffer = params.buffer;
+        if (params.assetLoader)
+            this.assetLoader = params.assetLoader;
+        this.enableRiveAssetCDN =
+            typeof params.enableRiveAssetCDN == "boolean"
+                ? params.enableRiveAssetCDN
+                : true;
+        // New event management system
+        this.eventManager = new EventManager();
+        if (params.onLoad)
+            this.on(EventType.Load, params.onLoad);
+        if (params.onLoadError)
+            this.on(EventType.LoadError, params.onLoadError);
+    }
+    RiveFile.prototype.initData = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, loader, _b;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        if (!this.src) return [3 /*break*/, 2];
+                        _a = this;
+                        return [4 /*yield*/, loadRiveFile(this.src)];
+                    case 1:
+                        _a.buffer = _c.sent();
+                        _c.label = 2;
+                    case 2:
+                        if (this.assetLoader) {
+                            loader = new this.runtime.CustomFileAssetLoader({
+                                loadContents: this.assetLoader,
+                            });
+                        }
+                        // Load the Rive file
+                        _b = this;
+                        return [4 /*yield*/, this.runtime.load(new Uint8Array(this.buffer), loader, this.enableRiveAssetCDN)];
+                    case 3:
+                        // Load the Rive file
+                        _b.file = _c.sent();
+                        if (this.file !== null) {
+                            this.eventManager.fire({
+                                type: EventType.Load,
+                                data: this,
+                            });
+                        }
+                        else {
+                            this.eventManager.fire({
+                                type: EventType.LoadError,
+                                data: null,
+                            });
+                            throw new Error(RiveFile.fileLoadErrorMessage);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    RiveFile.prototype.init = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        // If no source file url specified, it's a bust
+                        if (!this.src && !this.buffer) {
+                            throw new Error(RiveFile.missingErrorMessage);
+                        }
+                        _a = this;
+                        return [4 /*yield*/, RuntimeLoader.awaitInstance()];
+                    case 1:
+                        _a.runtime = _b.sent();
+                        return [4 /*yield*/, this.initData()];
+                    case 2:
+                        _b.sent();
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    /**
+     * Subscribe to Rive-generated events
+     * @param type the type of event to subscribe to
+     * @param callback callback to fire when the event occurs
+     */
+    RiveFile.prototype.on = function (type, callback) {
+        this.eventManager.add({
+            type: type,
+            callback: callback,
+        });
+    };
+    /**
+     * Unsubscribes from a Rive-generated event
+     * @param type the type of event to unsubscribe from
+     * @param callback the callback to unsubscribe
+     */
+    RiveFile.prototype.off = function (type, callback) {
+        this.eventManager.remove({
+            type: type,
+            callback: callback,
+        });
+    };
+    RiveFile.prototype.cleanup = function () {
+        var _a;
+        this.referenceCount -= 1;
+        if (this.referenceCount <= 0) {
+            this.removeAllRiveEventListeners();
+            (_a = this.file) === null || _a === void 0 ? void 0 : _a.delete();
+        }
+    };
+    /**
+     * Unsubscribes all Rive listeners from an event type, or everything if no type is
+     * given
+     * @param type the type of event to unsubscribe from, or all types if
+     * undefined
+     */
+    RiveFile.prototype.removeAllRiveEventListeners = function (type) {
+        this.eventManager.removeAll(type);
+    };
+    RiveFile.prototype.getInstance = function () {
+        if (this.file !== null) {
+            this.referenceCount += 1;
+            return this.file;
+        }
+    };
+    // Error message for missing source or buffer
+    RiveFile.missingErrorMessage = "Rive source file or data buffer required";
+    // Error message for file load error
+    RiveFile.fileLoadErrorMessage = "The file failed to load";
+    return RiveFile;
+}());
+
 var Rive = /** @class */ (function () {
     function Rive(params) {
         var _this = this;
@@ -5047,6 +5184,7 @@ var Rive = /** @class */ (function () {
         }
         this.src = params.src;
         this.buffer = params.buffer;
+        this.riveFile = params.riveFile;
         this.layout = (_a = params.layout) !== null && _a !== void 0 ? _a : new Layout();
         this.shouldDisableRiveListeners = !!params.shouldDisableRiveListeners;
         this.isTouchScrollEnabled = !!params.isTouchScrollEnabled;
@@ -5100,6 +5238,7 @@ var Rive = /** @class */ (function () {
         this.init({
             src: this.src,
             buffer: this.buffer,
+            riveFile: this.riveFile,
             autoplay: params.autoplay,
             animations: params.animations,
             stateMachines: params.stateMachines,
@@ -5119,11 +5258,12 @@ var Rive = /** @class */ (function () {
     // Initializes the Rive object either from constructor or load()
     Rive.prototype.init = function (_a) {
         var _this = this;
-        var src = _a.src, buffer = _a.buffer, animations = _a.animations, stateMachines = _a.stateMachines, artboard = _a.artboard, _b = _a.autoplay, autoplay = _b === void 0 ? false : _b, _c = _a.useOffscreenRenderer, useOffscreenRenderer = _c === void 0 ? false : _c;
+        var src = _a.src, buffer = _a.buffer, riveFile = _a.riveFile, animations = _a.animations, stateMachines = _a.stateMachines, artboard = _a.artboard, _b = _a.autoplay, autoplay = _b === void 0 ? false : _b, _c = _a.useOffscreenRenderer, useOffscreenRenderer = _c === void 0 ? false : _c;
         this.src = src;
         this.buffer = buffer;
+        this.riveFile = riveFile;
         // If no source file url specified, it's a bust
-        if (!this.src && !this.buffer) {
+        if (!this.src && !this.buffer && !this.riveFile) {
             throw new Error(Rive.missingErrorMessage);
         }
         // List of animations that should be initialized.
@@ -5214,59 +5354,56 @@ var Rive = /** @class */ (function () {
     Rive.prototype.initData = function (artboardName, animationNames, stateMachineNames, autoplay) {
         var _a;
         return __awaiter(this, void 0, void 0, function () {
-            var _b, loader, _c, msg;
-            return __generator(this, function (_d) {
-                switch (_d.label) {
+            var error_1, msg;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0:
-                        if (!this.src) return [3 /*break*/, 2];
-                        _b = this;
-                        return [4 /*yield*/, loadRiveFile(this.src)];
+                        _b.trys.push([0, 3, , 4]);
+                        if (!(this.riveFile == null)) return [3 /*break*/, 2];
+                        this.riveFile = new RiveFile({
+                            src: this.src,
+                            buffer: this.buffer,
+                            enableRiveAssetCDN: this.enableRiveAssetCDN,
+                            assetLoader: this.assetLoader,
+                        });
+                        return [4 /*yield*/, this.riveFile.init()];
                     case 1:
-                        _b.buffer = _d.sent();
-                        _d.label = 2;
+                        _b.sent();
+                        _b.label = 2;
                     case 2:
-                        if (this.assetLoader) {
-                            loader = new this.runtime.CustomFileAssetLoader({
-                                loadContents: this.assetLoader,
-                            });
-                        }
-                        // Load the Rive file
-                        _c = this;
-                        return [4 /*yield*/, this.runtime.load(new Uint8Array(this.buffer), loader, this.enableRiveAssetCDN)];
+                        this.file = this.riveFile.getInstance();
+                        // Initialize and draw frame
+                        this.initArtboard(artboardName, animationNames, stateMachineNames, autoplay);
+                        // Check for audio
+                        this.initializeAudio();
+                        // Everything's set up, emit a load event
+                        this.loaded = true;
+                        this.eventManager.fire({
+                            type: EventType.Load,
+                            data: (_a = this.src) !== null && _a !== void 0 ? _a : "buffer",
+                        });
+                        // Flag ready for playback commands and clear the task queue; this order
+                        // is important or it may infinitely recurse
+                        this.readyForPlaying = true;
+                        this.taskQueue.process();
+                        this.drawFrame();
+                        return [2 /*return*/, Promise.resolve()];
                     case 3:
-                        // Load the Rive file
-                        _c.file = _d.sent();
-                        if (this.file) {
-                            // Initialize and draw frame
-                            this.initArtboard(artboardName, animationNames, stateMachineNames, autoplay);
-                            // Check for audio
-                            this.initializeAudio();
-                            // Everything's set up, emit a load event
-                            this.loaded = true;
-                            this.eventManager.fire({
-                                type: EventType.Load,
-                                data: (_a = this.src) !== null && _a !== void 0 ? _a : "buffer",
-                            });
-                            // Flag ready for playback commands and clear the task queue; this order
-                            // is important or it may infinitely recurse
-                            this.readyForPlaying = true;
-                            this.taskQueue.process();
-                            this.drawFrame();
-                            return [2 /*return*/, Promise.resolve()];
-                        }
-                        else {
-                            msg = "Problem loading file; may be corrupt!";
-                            console.warn(msg);
-                            this.eventManager.fire({ type: EventType.LoadError, data: msg });
-                            return [2 /*return*/, Promise.reject(msg)];
-                        }
-                        return [2 /*return*/];
+                        error_1 = _b.sent();
+                        msg = "Problem loading file; may be corrupt!";
+                        console.warn(msg);
+                        this.eventManager.fire({ type: EventType.LoadError, data: msg });
+                        return [2 /*return*/, Promise.reject(msg)];
+                    case 4: return [2 /*return*/];
                 }
             });
         });
     };
     // Initialize for playback
     Rive.prototype.initArtboard = function (artboardName, animationNames, stateMachineNames, autoplay) {
+        if (!this.file) {
+            return;
+        }
         // Fetch the artboard
         var rootArtboard = artboardName
             ? this.file.artboardByName(artboardName)
@@ -5486,8 +5623,8 @@ var Rive = /** @class */ (function () {
         if (this._observed !== null) {
             observers.remove(this._observed);
         }
-        // Delete the rive file
-        (_a = this.file) === null || _a === void 0 ? void 0 : _a.delete();
+        (_a = this.riveFile) === null || _a === void 0 ? void 0 : _a.cleanup();
+        this.riveFile = null;
         this.file = null;
     };
     /**
@@ -5651,6 +5788,7 @@ var Rive = /** @class */ (function () {
     };
     // Loads a new Rive file, keeping listeners in place
     Rive.prototype.load = function (params) {
+        this.file = null;
         // Stop all animations
         this.stop();
         // Reinitialize
@@ -5729,7 +5867,7 @@ var Rive = /** @class */ (function () {
         // Returns a list of animation names on the chosen artboard
         get: function () {
             // If the file's not loaded, we got nothing to return
-            if (!this.loaded) {
+            if (!this.loaded || !this.artboard) {
                 return [];
             }
             var animationNames = [];
@@ -5747,7 +5885,7 @@ var Rive = /** @class */ (function () {
          */
         get: function () {
             // If the file's not loaded, we got nothing to return
-            if (!this.loaded) {
+            if (!this.loaded || !this.artboard) {
                 return [];
             }
             var stateMachineNames = [];