@vunk/plus 1.10.3 → 1.11.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/agent-chat-provider/index.mjs +1 -1
- package/components/avatar/index.mjs +1 -1
- package/components/broadcasting-markdown/index.mjs +25 -16
- package/components/broadcasting-markdown/src/ctx.d.ts +7 -0
- package/components/broadcasting-markdown/src/index.vue.d.ts +84 -1
- package/components/bubble-list/index.mjs +4 -4
- package/components/bubble-templates/index.mjs +1 -1
- package/components/chat-independent/index.mjs +1 -1
- package/components/drawer/index.css +92 -92
- package/components/drawer/index.mjs +2 -2
- package/components/index2.mjs +64 -26444
- package/components/lottie-animation/index.mjs +1 -1
- package/components/metahuman-broadcasting/index.mjs +28 -3062
- package/components/metahuman-broadcasting/src/ctx.d.ts +4 -0
- package/components/metahuman-broadcasting/src/index.vue.d.ts +102 -9
- package/components/monaco-editor/index.mjs +1 -1
- package/components/monaco-environment/index.mjs +1 -1
- package/components/pixi-frame/index.mjs +1988 -7
- package/components/pixi-frame/src/bitmap.vue.d.ts +4 -5
- package/components/pixi-frame/src/index.vue.d.ts +4 -5
- package/components/recorder-button/index.mjs +1 -1
- package/components/routes-menu-content/index.mjs +3 -3
- package/components/scrollbar/index.mjs +3 -3
- package/components/sender/index.mjs +2 -2
- package/components/speech-button/index.mjs +3 -3
- package/components/table-columns/index.mjs +1 -1
- package/components/tables-v1/index.mjs +1 -1
- package/components/tables-v1-checkbox/index.mjs +1 -1
- package/components/text/index.mjs +1 -1
- package/components/typing-markdown/index.mjs +1 -1
- package/components/vditor/index.mjs +3 -3
- package/components/xgplayer/index.mjs +2 -2
- package/icons/end/index.mjs +1 -1
- package/icons/keyboard/index.mjs +1 -1
- package/icons/start/index.mjs +1 -1
- package/icons/voice/index.mjs +1 -1
- package/index.css +92 -92
- package/package.json +1 -1
- package/components/SharedSystems.mjs +0 -3413
- package/components/WebGLRenderer.mjs +0 -3631
- package/components/WebGPURenderer.mjs +0 -2143
- package/components/browserAll.mjs +0 -2960
- package/components/colorToUniform.mjs +0 -268
- package/components/index3.mjs +0 -78
- package/components/init.mjs +0 -4505
- package/components/webworkerAll.mjs +0 -10
|
@@ -1,8 +1,1989 @@
|
|
|
1
|
-
|
|
1
|
+
import { provide, inject, watchEffect, onBeforeUnmount, defineComponent, useId, ref, onMounted, renderSlot, watch, computed, openBlock, createElementBlock, resolveComponent, createBlock, withCtx, createVNode } from 'vue';
|
|
2
|
+
import { TickerStatus } from '@vunk/shared/enum';
|
|
2
3
|
export { TickerStatus } from '@vunk/shared/enum';
|
|
3
|
-
import '
|
|
4
|
-
import '
|
|
5
|
-
import '
|
|
6
|
-
import '../_plugin-vue_export-helper.mjs';
|
|
7
|
-
import '@vunk/shared/object';
|
|
8
|
-
import '@vunk/core/composables';
|
|
4
|
+
import { Deferred, sleep } from '@vunk/shared/promise';
|
|
5
|
+
import { c as commonjsGlobal, g as getDefaultExportFromCjs } from '../_commonjsHelpers.mjs';
|
|
6
|
+
import { Application, Sprite, Assets, Texture, ImageSource } from 'pixi.js';
|
|
7
|
+
import { _ as _export_sfc } from '../_plugin-vue_export-helper.mjs';
|
|
8
|
+
import { pickObject } from '@vunk/shared/object';
|
|
9
|
+
import { useModelComputed, useDeferred } from '@vunk/core/composables';
|
|
10
|
+
|
|
11
|
+
var lib = {exports: {}};
|
|
12
|
+
|
|
13
|
+
(function (module, exports) {
|
|
14
|
+
(function webpackUniversalModuleDefinition(root, factory) {
|
|
15
|
+
module.exports = factory();
|
|
16
|
+
})(commonjsGlobal, function() {
|
|
17
|
+
return /******/ (function(modules) { // webpackBootstrap
|
|
18
|
+
/******/ // The module cache
|
|
19
|
+
/******/ var installedModules = {};
|
|
20
|
+
|
|
21
|
+
/******/ // The require function
|
|
22
|
+
/******/ function __webpack_require__(moduleId) {
|
|
23
|
+
|
|
24
|
+
/******/ // Check if module is in cache
|
|
25
|
+
/******/ if(installedModules[moduleId])
|
|
26
|
+
/******/ return installedModules[moduleId].exports;
|
|
27
|
+
|
|
28
|
+
/******/ // Create a new module (and put it into the cache)
|
|
29
|
+
/******/ var module = installedModules[moduleId] = {
|
|
30
|
+
/******/ exports: {},
|
|
31
|
+
/******/ id: moduleId,
|
|
32
|
+
/******/ loaded: false
|
|
33
|
+
/******/ };
|
|
34
|
+
|
|
35
|
+
/******/ // Execute the module function
|
|
36
|
+
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
|
37
|
+
|
|
38
|
+
/******/ // Flag the module as loaded
|
|
39
|
+
/******/ module.loaded = true;
|
|
40
|
+
|
|
41
|
+
/******/ // Return the exports of the module
|
|
42
|
+
/******/ return module.exports;
|
|
43
|
+
/******/ }
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
/******/ // expose the modules object (__webpack_modules__)
|
|
47
|
+
/******/ __webpack_require__.m = modules;
|
|
48
|
+
|
|
49
|
+
/******/ // expose the module cache
|
|
50
|
+
/******/ __webpack_require__.c = installedModules;
|
|
51
|
+
|
|
52
|
+
/******/ // __webpack_public_path__
|
|
53
|
+
/******/ __webpack_require__.p = "";
|
|
54
|
+
|
|
55
|
+
/******/ // Load entry module and return exports
|
|
56
|
+
/******/ return __webpack_require__(0);
|
|
57
|
+
/******/ })
|
|
58
|
+
/************************************************************************/
|
|
59
|
+
/******/ ([
|
|
60
|
+
/* 0 */
|
|
61
|
+
/***/ (function(module, exports, __webpack_require__) {
|
|
62
|
+
|
|
63
|
+
Object.defineProperty(exports, "__esModule", {
|
|
64
|
+
value: true
|
|
65
|
+
});
|
|
66
|
+
exports.isNotPNG = isNotPNG;
|
|
67
|
+
exports.isNotAPNG = isNotAPNG;
|
|
68
|
+
exports.default = parseAPNG;
|
|
69
|
+
|
|
70
|
+
var _crc = __webpack_require__(1);
|
|
71
|
+
|
|
72
|
+
var _crc2 = _interopRequireDefault(_crc);
|
|
73
|
+
|
|
74
|
+
var _structs = __webpack_require__(2);
|
|
75
|
+
|
|
76
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
77
|
+
|
|
78
|
+
var errNotPNG = new Error('Not a PNG');
|
|
79
|
+
var errNotAPNG = new Error('Not an animated PNG');
|
|
80
|
+
|
|
81
|
+
function isNotPNG(err) {
|
|
82
|
+
return err === errNotPNG;
|
|
83
|
+
}
|
|
84
|
+
function isNotAPNG(err) {
|
|
85
|
+
return err === errNotAPNG;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
// '\x89PNG\x0d\x0a\x1a\x0a'
|
|
89
|
+
var PNGSignature = new Uint8Array([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a]);
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Parse APNG data
|
|
93
|
+
* @param {ArrayBuffer} buffer
|
|
94
|
+
* @return {APNG|Error}
|
|
95
|
+
*/
|
|
96
|
+
function parseAPNG(buffer) {
|
|
97
|
+
var bytes = new Uint8Array(buffer);
|
|
98
|
+
|
|
99
|
+
if (Array.prototype.some.call(PNGSignature, function (b, i) {
|
|
100
|
+
return b !== bytes[i];
|
|
101
|
+
})) {
|
|
102
|
+
return errNotPNG;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
// fast animation test
|
|
106
|
+
var isAnimated = false;
|
|
107
|
+
eachChunk(bytes, function (type) {
|
|
108
|
+
return !(isAnimated = type === 'acTL');
|
|
109
|
+
});
|
|
110
|
+
if (!isAnimated) {
|
|
111
|
+
return errNotAPNG;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
var preDataParts = [],
|
|
115
|
+
postDataParts = [];
|
|
116
|
+
var headerDataBytes = null,
|
|
117
|
+
frame = null,
|
|
118
|
+
frameNumber = 0,
|
|
119
|
+
apng = new _structs.APNG();
|
|
120
|
+
|
|
121
|
+
eachChunk(bytes, function (type, bytes, off, length) {
|
|
122
|
+
var dv = new DataView(bytes.buffer);
|
|
123
|
+
switch (type) {
|
|
124
|
+
case 'IHDR':
|
|
125
|
+
headerDataBytes = bytes.subarray(off + 8, off + 8 + length);
|
|
126
|
+
apng.width = dv.getUint32(off + 8);
|
|
127
|
+
apng.height = dv.getUint32(off + 12);
|
|
128
|
+
break;
|
|
129
|
+
case 'acTL':
|
|
130
|
+
apng.numPlays = dv.getUint32(off + 8 + 4);
|
|
131
|
+
break;
|
|
132
|
+
case 'fcTL':
|
|
133
|
+
if (frame) {
|
|
134
|
+
apng.frames.push(frame);
|
|
135
|
+
frameNumber++;
|
|
136
|
+
}
|
|
137
|
+
frame = new _structs.Frame();
|
|
138
|
+
frame.width = dv.getUint32(off + 8 + 4);
|
|
139
|
+
frame.height = dv.getUint32(off + 8 + 8);
|
|
140
|
+
frame.left = dv.getUint32(off + 8 + 12);
|
|
141
|
+
frame.top = dv.getUint32(off + 8 + 16);
|
|
142
|
+
var delayN = dv.getUint16(off + 8 + 20);
|
|
143
|
+
var delayD = dv.getUint16(off + 8 + 22);
|
|
144
|
+
if (delayD === 0) {
|
|
145
|
+
delayD = 100;
|
|
146
|
+
}
|
|
147
|
+
frame.delay = 1000 * delayN / delayD;
|
|
148
|
+
// https://bugzilla.mozilla.org/show_bug.cgi?id=125137
|
|
149
|
+
// https://bugzilla.mozilla.org/show_bug.cgi?id=139677
|
|
150
|
+
// https://bugzilla.mozilla.org/show_bug.cgi?id=207059
|
|
151
|
+
if (frame.delay <= 10) {
|
|
152
|
+
frame.delay = 100;
|
|
153
|
+
}
|
|
154
|
+
apng.playTime += frame.delay;
|
|
155
|
+
frame.disposeOp = dv.getUint8(off + 8 + 24);
|
|
156
|
+
frame.blendOp = dv.getUint8(off + 8 + 25);
|
|
157
|
+
frame.dataParts = [];
|
|
158
|
+
if (frameNumber === 0 && frame.disposeOp === 2) {
|
|
159
|
+
frame.disposeOp = 1;
|
|
160
|
+
}
|
|
161
|
+
break;
|
|
162
|
+
case 'fdAT':
|
|
163
|
+
if (frame) {
|
|
164
|
+
frame.dataParts.push(bytes.subarray(off + 8 + 4, off + 8 + length));
|
|
165
|
+
}
|
|
166
|
+
break;
|
|
167
|
+
case 'IDAT':
|
|
168
|
+
if (frame) {
|
|
169
|
+
frame.dataParts.push(bytes.subarray(off + 8, off + 8 + length));
|
|
170
|
+
}
|
|
171
|
+
break;
|
|
172
|
+
case 'IEND':
|
|
173
|
+
postDataParts.push(subBuffer(bytes, off, 12 + length));
|
|
174
|
+
break;
|
|
175
|
+
default:
|
|
176
|
+
preDataParts.push(subBuffer(bytes, off, 12 + length));
|
|
177
|
+
}
|
|
178
|
+
});
|
|
179
|
+
|
|
180
|
+
if (frame) {
|
|
181
|
+
apng.frames.push(frame);
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
if (apng.frames.length == 0) {
|
|
185
|
+
return errNotAPNG;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
var preBlob = new Blob(preDataParts),
|
|
189
|
+
postBlob = new Blob(postDataParts);
|
|
190
|
+
|
|
191
|
+
apng.frames.forEach(function (frame) {
|
|
192
|
+
var bb = [];
|
|
193
|
+
bb.push(PNGSignature);
|
|
194
|
+
headerDataBytes.set(makeDWordArray(frame.width), 0);
|
|
195
|
+
headerDataBytes.set(makeDWordArray(frame.height), 4);
|
|
196
|
+
bb.push(makeChunkBytes('IHDR', headerDataBytes));
|
|
197
|
+
bb.push(preBlob);
|
|
198
|
+
frame.dataParts.forEach(function (p) {
|
|
199
|
+
return bb.push(makeChunkBytes('IDAT', p));
|
|
200
|
+
});
|
|
201
|
+
bb.push(postBlob);
|
|
202
|
+
frame.imageData = new Blob(bb, { 'type': 'image/png' });
|
|
203
|
+
delete frame.dataParts;
|
|
204
|
+
bb = null;
|
|
205
|
+
});
|
|
206
|
+
|
|
207
|
+
return apng;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
/**
|
|
211
|
+
* @param {Uint8Array} bytes
|
|
212
|
+
* @param {function(string, Uint8Array, int, int): boolean} callback
|
|
213
|
+
*/
|
|
214
|
+
function eachChunk(bytes, callback) {
|
|
215
|
+
var dv = new DataView(bytes.buffer);
|
|
216
|
+
var off = 8,
|
|
217
|
+
type = void 0,
|
|
218
|
+
length = void 0,
|
|
219
|
+
res = void 0;
|
|
220
|
+
do {
|
|
221
|
+
length = dv.getUint32(off);
|
|
222
|
+
type = readString(bytes, off + 4, 4);
|
|
223
|
+
res = callback(type, bytes, off, length);
|
|
224
|
+
off += 12 + length;
|
|
225
|
+
} while (res !== false && type != 'IEND' && off < bytes.length);
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
/**
|
|
229
|
+
*
|
|
230
|
+
* @param {Uint8Array} bytes
|
|
231
|
+
* @param {number} off
|
|
232
|
+
* @param {number} length
|
|
233
|
+
* @return {string}
|
|
234
|
+
*/
|
|
235
|
+
function readString(bytes, off, length) {
|
|
236
|
+
var chars = Array.prototype.slice.call(bytes.subarray(off, off + length));
|
|
237
|
+
return String.fromCharCode.apply(String, chars);
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
/**
|
|
241
|
+
*
|
|
242
|
+
* @param {string} x
|
|
243
|
+
* @return {Uint8Array}
|
|
244
|
+
*/
|
|
245
|
+
function makeStringArray(x) {
|
|
246
|
+
var res = new Uint8Array(x.length);
|
|
247
|
+
for (var i = 0; i < x.length; i++) {
|
|
248
|
+
res[i] = x.charCodeAt(i);
|
|
249
|
+
}
|
|
250
|
+
return res;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
/**
|
|
254
|
+
* @param {Uint8Array} bytes
|
|
255
|
+
* @param {int} start
|
|
256
|
+
* @param {int} length
|
|
257
|
+
* @return {Uint8Array}
|
|
258
|
+
*/
|
|
259
|
+
function subBuffer(bytes, start, length) {
|
|
260
|
+
var a = new Uint8Array(length);
|
|
261
|
+
a.set(bytes.subarray(start, start + length));
|
|
262
|
+
return a;
|
|
263
|
+
}
|
|
264
|
+
|
|
265
|
+
/**
|
|
266
|
+
* @param {string} type
|
|
267
|
+
* @param {Uint8Array} dataBytes
|
|
268
|
+
* @return {Uint8Array}
|
|
269
|
+
*/
|
|
270
|
+
var makeChunkBytes = function makeChunkBytes(type, dataBytes) {
|
|
271
|
+
var crcLen = type.length + dataBytes.length;
|
|
272
|
+
var bytes = new Uint8Array(crcLen + 8);
|
|
273
|
+
var dv = new DataView(bytes.buffer);
|
|
274
|
+
|
|
275
|
+
dv.setUint32(0, dataBytes.length);
|
|
276
|
+
bytes.set(makeStringArray(type), 4);
|
|
277
|
+
bytes.set(dataBytes, 8);
|
|
278
|
+
var crc = (0, _crc2.default)(bytes, 4, crcLen);
|
|
279
|
+
dv.setUint32(crcLen + 4, crc);
|
|
280
|
+
return bytes;
|
|
281
|
+
};
|
|
282
|
+
|
|
283
|
+
var makeDWordArray = function makeDWordArray(x) {
|
|
284
|
+
return new Uint8Array([x >>> 24 & 0xff, x >>> 16 & 0xff, x >>> 8 & 0xff, x & 0xff]);
|
|
285
|
+
};
|
|
286
|
+
|
|
287
|
+
/***/ }),
|
|
288
|
+
/* 1 */
|
|
289
|
+
/***/ (function(module, exports) {
|
|
290
|
+
|
|
291
|
+
Object.defineProperty(exports, "__esModule", {
|
|
292
|
+
value: true
|
|
293
|
+
});
|
|
294
|
+
|
|
295
|
+
exports.default = function (bytes) {
|
|
296
|
+
var start = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
297
|
+
var length = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : bytes.length - start;
|
|
298
|
+
|
|
299
|
+
var crc = -1;
|
|
300
|
+
for (var _i = start, l = start + length; _i < l; _i++) {
|
|
301
|
+
crc = crc >>> 8 ^ table[(crc ^ bytes[_i]) & 0xFF];
|
|
302
|
+
}
|
|
303
|
+
return crc ^ -1;
|
|
304
|
+
};
|
|
305
|
+
|
|
306
|
+
var table = new Uint32Array(256);
|
|
307
|
+
|
|
308
|
+
for (var i = 0; i < 256; i++) {
|
|
309
|
+
var c = i;
|
|
310
|
+
for (var k = 0; k < 8; k++) {
|
|
311
|
+
c = (c & 1) !== 0 ? 0xEDB88320 ^ c >>> 1 : c >>> 1;
|
|
312
|
+
}
|
|
313
|
+
table[i] = c;
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
/**
|
|
317
|
+
*
|
|
318
|
+
* @param {Uint8Array} bytes
|
|
319
|
+
* @param {number} start
|
|
320
|
+
* @param {number} length
|
|
321
|
+
* @return {number}
|
|
322
|
+
*/
|
|
323
|
+
|
|
324
|
+
/***/ }),
|
|
325
|
+
/* 2 */
|
|
326
|
+
/***/ (function(module, exports, __webpack_require__) {
|
|
327
|
+
|
|
328
|
+
Object.defineProperty(exports, "__esModule", {
|
|
329
|
+
value: true
|
|
330
|
+
});
|
|
331
|
+
exports.Frame = exports.APNG = undefined;
|
|
332
|
+
|
|
333
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
334
|
+
|
|
335
|
+
var _player = __webpack_require__(3);
|
|
336
|
+
|
|
337
|
+
var _player2 = _interopRequireDefault(_player);
|
|
338
|
+
|
|
339
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
340
|
+
|
|
341
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
342
|
+
|
|
343
|
+
/**
|
|
344
|
+
* @property {number} currFrameNumber
|
|
345
|
+
* @property {Frame} currFrame
|
|
346
|
+
* @property {boolean} paused
|
|
347
|
+
* @property {boolean} ended
|
|
348
|
+
*/
|
|
349
|
+
exports.APNG = function () {
|
|
350
|
+
function APNG() {
|
|
351
|
+
_classCallCheck(this, APNG);
|
|
352
|
+
|
|
353
|
+
this.width = 0;
|
|
354
|
+
this.height = 0;
|
|
355
|
+
this.numPlays = 0;
|
|
356
|
+
this.playTime = 0;
|
|
357
|
+
this.frames = [];
|
|
358
|
+
}
|
|
359
|
+
/** @type {number} */
|
|
360
|
+
|
|
361
|
+
/** @type {number} */
|
|
362
|
+
|
|
363
|
+
/** @type {number} */
|
|
364
|
+
|
|
365
|
+
/** @type {number} */
|
|
366
|
+
|
|
367
|
+
/** @type {Frame[]} */
|
|
368
|
+
|
|
369
|
+
|
|
370
|
+
_createClass(APNG, [{
|
|
371
|
+
key: 'createImages',
|
|
372
|
+
|
|
373
|
+
|
|
374
|
+
/**
|
|
375
|
+
*
|
|
376
|
+
* @return {Promise.<*>}
|
|
377
|
+
*/
|
|
378
|
+
value: function createImages() {
|
|
379
|
+
return Promise.all(this.frames.map(function (f) {
|
|
380
|
+
return f.createImage();
|
|
381
|
+
}));
|
|
382
|
+
}
|
|
383
|
+
|
|
384
|
+
/**
|
|
385
|
+
*
|
|
386
|
+
* @param {CanvasRenderingContext2D} context
|
|
387
|
+
* @param {boolean} autoPlay
|
|
388
|
+
* @return {Promise.<Player>}
|
|
389
|
+
*/
|
|
390
|
+
|
|
391
|
+
}, {
|
|
392
|
+
key: 'getPlayer',
|
|
393
|
+
value: function getPlayer(context) {
|
|
394
|
+
var _this = this;
|
|
395
|
+
|
|
396
|
+
var autoPlay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
397
|
+
|
|
398
|
+
return this.createImages().then(function () {
|
|
399
|
+
return new _player2.default(_this, context, autoPlay);
|
|
400
|
+
});
|
|
401
|
+
}
|
|
402
|
+
}]);
|
|
403
|
+
|
|
404
|
+
return APNG;
|
|
405
|
+
}();
|
|
406
|
+
|
|
407
|
+
exports.Frame = function () {
|
|
408
|
+
function Frame() {
|
|
409
|
+
_classCallCheck(this, Frame);
|
|
410
|
+
|
|
411
|
+
this.left = 0;
|
|
412
|
+
this.top = 0;
|
|
413
|
+
this.width = 0;
|
|
414
|
+
this.height = 0;
|
|
415
|
+
this.delay = 0;
|
|
416
|
+
this.disposeOp = 0;
|
|
417
|
+
this.blendOp = 0;
|
|
418
|
+
this.imageData = null;
|
|
419
|
+
this.imageElement = null;
|
|
420
|
+
}
|
|
421
|
+
/** @type {number} */
|
|
422
|
+
|
|
423
|
+
/** @type {number} */
|
|
424
|
+
|
|
425
|
+
/** @type {number} */
|
|
426
|
+
|
|
427
|
+
/** @type {number} */
|
|
428
|
+
|
|
429
|
+
/** @type {number} */
|
|
430
|
+
|
|
431
|
+
/** @type {number} */
|
|
432
|
+
|
|
433
|
+
/** @type {number} */
|
|
434
|
+
|
|
435
|
+
/** @type {Blob} */
|
|
436
|
+
|
|
437
|
+
/** @type {HTMLImageElement} */
|
|
438
|
+
|
|
439
|
+
|
|
440
|
+
_createClass(Frame, [{
|
|
441
|
+
key: 'createImage',
|
|
442
|
+
value: function createImage() {
|
|
443
|
+
var _this2 = this;
|
|
444
|
+
|
|
445
|
+
if (this.imageElement) {
|
|
446
|
+
return Promise.resolve();
|
|
447
|
+
}
|
|
448
|
+
return new Promise(function (resolve, reject) {
|
|
449
|
+
var url = URL.createObjectURL(_this2.imageData);
|
|
450
|
+
_this2.imageElement = document.createElement('img');
|
|
451
|
+
_this2.imageElement.onload = function () {
|
|
452
|
+
URL.revokeObjectURL(url);
|
|
453
|
+
resolve();
|
|
454
|
+
};
|
|
455
|
+
_this2.imageElement.onerror = function () {
|
|
456
|
+
URL.revokeObjectURL(url);
|
|
457
|
+
_this2.imageElement = null;
|
|
458
|
+
reject(new Error("Image creation error"));
|
|
459
|
+
};
|
|
460
|
+
_this2.imageElement.src = url;
|
|
461
|
+
});
|
|
462
|
+
}
|
|
463
|
+
}]);
|
|
464
|
+
|
|
465
|
+
return Frame;
|
|
466
|
+
}();
|
|
467
|
+
|
|
468
|
+
/***/ }),
|
|
469
|
+
/* 3 */
|
|
470
|
+
/***/ (function(module, exports, __webpack_require__) {
|
|
471
|
+
|
|
472
|
+
Object.defineProperty(exports, "__esModule", {
|
|
473
|
+
value: true
|
|
474
|
+
});
|
|
475
|
+
|
|
476
|
+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
477
|
+
|
|
478
|
+
var _events = __webpack_require__(4);
|
|
479
|
+
|
|
480
|
+
var _events2 = _interopRequireDefault(_events);
|
|
481
|
+
|
|
482
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
483
|
+
|
|
484
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
485
|
+
|
|
486
|
+
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
487
|
+
|
|
488
|
+
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
489
|
+
|
|
490
|
+
var _class = function (_EventEmitter) {
|
|
491
|
+
_inherits(_class, _EventEmitter);
|
|
492
|
+
|
|
493
|
+
/**
|
|
494
|
+
* @param {APNG} apng
|
|
495
|
+
* @param {CanvasRenderingContext2D} context
|
|
496
|
+
* @param {boolean} autoPlay
|
|
497
|
+
*/
|
|
498
|
+
|
|
499
|
+
/** @type {number} */
|
|
500
|
+
|
|
501
|
+
|
|
502
|
+
/** @type {boolean} */
|
|
503
|
+
|
|
504
|
+
/** @type {ImageData} */
|
|
505
|
+
|
|
506
|
+
|
|
507
|
+
/** @type {APNG} */
|
|
508
|
+
|
|
509
|
+
/** @type {CanvasRenderingContext2D} */
|
|
510
|
+
function _class(apng, context, autoPlay) {
|
|
511
|
+
_classCallCheck(this, _class);
|
|
512
|
+
|
|
513
|
+
var _this = _possibleConstructorReturn(this, (_class.__proto__ || Object.getPrototypeOf(_class)).call(this));
|
|
514
|
+
|
|
515
|
+
_this.playbackRate = 1.0;
|
|
516
|
+
_this._currentFrameNumber = 0;
|
|
517
|
+
_this._ended = false;
|
|
518
|
+
_this._paused = true;
|
|
519
|
+
_this._numPlays = 0;
|
|
520
|
+
_this._rafId = null;
|
|
521
|
+
|
|
522
|
+
_this._apng = apng;
|
|
523
|
+
_this.context = context;
|
|
524
|
+
_this.stop();
|
|
525
|
+
if (autoPlay) {
|
|
526
|
+
_this.play();
|
|
527
|
+
}
|
|
528
|
+
return _this;
|
|
529
|
+
}
|
|
530
|
+
|
|
531
|
+
/**
|
|
532
|
+
*
|
|
533
|
+
* @return {number}
|
|
534
|
+
*/
|
|
535
|
+
|
|
536
|
+
/** @type {number|null} */
|
|
537
|
+
|
|
538
|
+
/** @type {boolean} */
|
|
539
|
+
|
|
540
|
+
/** @type {number} */
|
|
541
|
+
|
|
542
|
+
/** @type {Frame} */
|
|
543
|
+
|
|
544
|
+
/** @type {number} */
|
|
545
|
+
|
|
546
|
+
|
|
547
|
+
_createClass(_class, [{
|
|
548
|
+
key: 'renderNextFrame',
|
|
549
|
+
value: function renderNextFrame() {
|
|
550
|
+
this._currentFrameNumber = (this._currentFrameNumber + 1) % this._apng.frames.length;
|
|
551
|
+
if (this._currentFrameNumber === this._apng.frames.length - 1) {
|
|
552
|
+
this._numPlays++;
|
|
553
|
+
if (this._apng.numPlays !== 0 && this._numPlays >= this._apng.numPlays) {
|
|
554
|
+
this._ended = true;
|
|
555
|
+
this._paused = true;
|
|
556
|
+
}
|
|
557
|
+
}
|
|
558
|
+
|
|
559
|
+
if (this._prevFrame && this._prevFrame.disposeOp == 1) {
|
|
560
|
+
this.context.clearRect(this._prevFrame.left, this._prevFrame.top, this._prevFrame.width, this._prevFrame.height);
|
|
561
|
+
} else if (this._prevFrame && this._prevFrame.disposeOp == 2) {
|
|
562
|
+
this.context.putImageData(this._prevFrameData, this._prevFrame.left, this._prevFrame.top);
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
var frame = this.currentFrame;
|
|
566
|
+
this._prevFrame = frame;
|
|
567
|
+
this._prevFrameData = null;
|
|
568
|
+
if (frame.disposeOp == 2) {
|
|
569
|
+
this._prevFrameData = this.context.getImageData(frame.left, frame.top, frame.width, frame.height);
|
|
570
|
+
}
|
|
571
|
+
if (frame.blendOp == 0) {
|
|
572
|
+
this.context.clearRect(frame.left, frame.top, frame.width, frame.height);
|
|
573
|
+
}
|
|
574
|
+
|
|
575
|
+
this.context.drawImage(frame.imageElement, frame.left, frame.top);
|
|
576
|
+
|
|
577
|
+
this.emit('frame', this._currentFrameNumber);
|
|
578
|
+
if (this._ended) {
|
|
579
|
+
this.emit('end');
|
|
580
|
+
}
|
|
581
|
+
}
|
|
582
|
+
|
|
583
|
+
// playback
|
|
584
|
+
|
|
585
|
+
}, {
|
|
586
|
+
key: 'play',
|
|
587
|
+
value: function play() {
|
|
588
|
+
var _this2 = this;
|
|
589
|
+
|
|
590
|
+
if (this._rafId) {
|
|
591
|
+
cancelAnimationFrame(this._rafId);
|
|
592
|
+
}
|
|
593
|
+
|
|
594
|
+
this.emit('play');
|
|
595
|
+
|
|
596
|
+
if (this._ended) {
|
|
597
|
+
this.stop();
|
|
598
|
+
}
|
|
599
|
+
this._paused = false;
|
|
600
|
+
|
|
601
|
+
var nextRenderTime = performance.now() + this.currentFrame.delay / this.playbackRate;
|
|
602
|
+
var tick = function tick(now) {
|
|
603
|
+
if (_this2._ended || _this2._paused) {
|
|
604
|
+
return;
|
|
605
|
+
}
|
|
606
|
+
if (now >= nextRenderTime) {
|
|
607
|
+
while (now - nextRenderTime >= _this2._apng.playTime / _this2.playbackRate) {
|
|
608
|
+
nextRenderTime += _this2._apng.playTime / _this2.playbackRate;
|
|
609
|
+
_this2._numPlays++;
|
|
610
|
+
}
|
|
611
|
+
do {
|
|
612
|
+
_this2.renderNextFrame();
|
|
613
|
+
nextRenderTime += _this2.currentFrame.delay / _this2.playbackRate;
|
|
614
|
+
} while (!_this2._ended && !_this2._paused && now > nextRenderTime);
|
|
615
|
+
}
|
|
616
|
+
_this2._rafId = requestAnimationFrame(tick);
|
|
617
|
+
};
|
|
618
|
+
this._rafId = requestAnimationFrame(tick);
|
|
619
|
+
}
|
|
620
|
+
}, {
|
|
621
|
+
key: 'pause',
|
|
622
|
+
value: function pause() {
|
|
623
|
+
if (!this._paused) {
|
|
624
|
+
if (this._rafId) {
|
|
625
|
+
cancelAnimationFrame(this._rafId);
|
|
626
|
+
this._rafId = null;
|
|
627
|
+
}
|
|
628
|
+
this.emit('pause');
|
|
629
|
+
this._paused = true;
|
|
630
|
+
}
|
|
631
|
+
}
|
|
632
|
+
}, {
|
|
633
|
+
key: 'stop',
|
|
634
|
+
value: function stop() {
|
|
635
|
+
if (this._rafId) {
|
|
636
|
+
cancelAnimationFrame(this._rafId);
|
|
637
|
+
this._rafId = null;
|
|
638
|
+
}
|
|
639
|
+
this.emit('stop');
|
|
640
|
+
this._numPlays = 0;
|
|
641
|
+
this._ended = false;
|
|
642
|
+
this._paused = true;
|
|
643
|
+
// render first frame
|
|
644
|
+
this._currentFrameNumber = -1;
|
|
645
|
+
this.context.clearRect(0, 0, this._apng.width, this._apng.height);
|
|
646
|
+
this.renderNextFrame();
|
|
647
|
+
}
|
|
648
|
+
}, {
|
|
649
|
+
key: 'currentFrameNumber',
|
|
650
|
+
get: function get() {
|
|
651
|
+
return this._currentFrameNumber;
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
/**
|
|
655
|
+
*
|
|
656
|
+
* @return {Frame}
|
|
657
|
+
*/
|
|
658
|
+
|
|
659
|
+
}, {
|
|
660
|
+
key: 'currentFrame',
|
|
661
|
+
get: function get() {
|
|
662
|
+
return this._apng.frames[this._currentFrameNumber];
|
|
663
|
+
}
|
|
664
|
+
}, {
|
|
665
|
+
key: 'paused',
|
|
666
|
+
get: function get() {
|
|
667
|
+
return this._paused;
|
|
668
|
+
}
|
|
669
|
+
}, {
|
|
670
|
+
key: 'ended',
|
|
671
|
+
get: function get() {
|
|
672
|
+
return this._ended;
|
|
673
|
+
}
|
|
674
|
+
}]);
|
|
675
|
+
|
|
676
|
+
return _class;
|
|
677
|
+
}(_events2.default);
|
|
678
|
+
|
|
679
|
+
exports.default = _class;
|
|
680
|
+
|
|
681
|
+
/***/ }),
|
|
682
|
+
/* 4 */
|
|
683
|
+
/***/ (function(module, exports) {
|
|
684
|
+
|
|
685
|
+
// Copyright Joyent, Inc. and other Node contributors.
|
|
686
|
+
//
|
|
687
|
+
// Permission is hereby granted, free of charge, to any person obtaining a
|
|
688
|
+
// copy of this software and associated documentation files (the
|
|
689
|
+
// "Software"), to deal in the Software without restriction, including
|
|
690
|
+
// without limitation the rights to use, copy, modify, merge, publish,
|
|
691
|
+
// distribute, sublicense, and/or sell copies of the Software, and to permit
|
|
692
|
+
// persons to whom the Software is furnished to do so, subject to the
|
|
693
|
+
// following conditions:
|
|
694
|
+
//
|
|
695
|
+
// The above copyright notice and this permission notice shall be included
|
|
696
|
+
// in all copies or substantial portions of the Software.
|
|
697
|
+
//
|
|
698
|
+
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
|
|
699
|
+
// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
|
700
|
+
// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
|
|
701
|
+
// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
|
|
702
|
+
// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
|
|
703
|
+
// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
|
|
704
|
+
// USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
705
|
+
|
|
706
|
+
function EventEmitter() {
|
|
707
|
+
this._events = this._events || {};
|
|
708
|
+
this._maxListeners = this._maxListeners || undefined;
|
|
709
|
+
}
|
|
710
|
+
module.exports = EventEmitter;
|
|
711
|
+
|
|
712
|
+
// Backwards-compat with node 0.10.x
|
|
713
|
+
EventEmitter.EventEmitter = EventEmitter;
|
|
714
|
+
|
|
715
|
+
EventEmitter.prototype._events = undefined;
|
|
716
|
+
EventEmitter.prototype._maxListeners = undefined;
|
|
717
|
+
|
|
718
|
+
// By default EventEmitters will print a warning if more than 10 listeners are
|
|
719
|
+
// added to it. This is a useful default which helps finding memory leaks.
|
|
720
|
+
EventEmitter.defaultMaxListeners = 10;
|
|
721
|
+
|
|
722
|
+
// Obviously not all Emitters should be limited to 10. This function allows
|
|
723
|
+
// that to be increased. Set to zero for unlimited.
|
|
724
|
+
EventEmitter.prototype.setMaxListeners = function(n) {
|
|
725
|
+
if (!isNumber(n) || n < 0 || isNaN(n))
|
|
726
|
+
throw TypeError('n must be a positive number');
|
|
727
|
+
this._maxListeners = n;
|
|
728
|
+
return this;
|
|
729
|
+
};
|
|
730
|
+
|
|
731
|
+
EventEmitter.prototype.emit = function(type) {
|
|
732
|
+
var er, handler, len, args, i, listeners;
|
|
733
|
+
|
|
734
|
+
if (!this._events)
|
|
735
|
+
this._events = {};
|
|
736
|
+
|
|
737
|
+
// If there is no 'error' event listener then throw.
|
|
738
|
+
if (type === 'error') {
|
|
739
|
+
if (!this._events.error ||
|
|
740
|
+
(isObject(this._events.error) && !this._events.error.length)) {
|
|
741
|
+
er = arguments[1];
|
|
742
|
+
if (er instanceof Error) {
|
|
743
|
+
throw er; // Unhandled 'error' event
|
|
744
|
+
} else {
|
|
745
|
+
// At least give some kind of context to the user
|
|
746
|
+
var err = new Error('Uncaught, unspecified "error" event. (' + er + ')');
|
|
747
|
+
err.context = er;
|
|
748
|
+
throw err;
|
|
749
|
+
}
|
|
750
|
+
}
|
|
751
|
+
}
|
|
752
|
+
|
|
753
|
+
handler = this._events[type];
|
|
754
|
+
|
|
755
|
+
if (isUndefined(handler))
|
|
756
|
+
return false;
|
|
757
|
+
|
|
758
|
+
if (isFunction(handler)) {
|
|
759
|
+
switch (arguments.length) {
|
|
760
|
+
// fast cases
|
|
761
|
+
case 1:
|
|
762
|
+
handler.call(this);
|
|
763
|
+
break;
|
|
764
|
+
case 2:
|
|
765
|
+
handler.call(this, arguments[1]);
|
|
766
|
+
break;
|
|
767
|
+
case 3:
|
|
768
|
+
handler.call(this, arguments[1], arguments[2]);
|
|
769
|
+
break;
|
|
770
|
+
// slower
|
|
771
|
+
default:
|
|
772
|
+
args = Array.prototype.slice.call(arguments, 1);
|
|
773
|
+
handler.apply(this, args);
|
|
774
|
+
}
|
|
775
|
+
} else if (isObject(handler)) {
|
|
776
|
+
args = Array.prototype.slice.call(arguments, 1);
|
|
777
|
+
listeners = handler.slice();
|
|
778
|
+
len = listeners.length;
|
|
779
|
+
for (i = 0; i < len; i++)
|
|
780
|
+
listeners[i].apply(this, args);
|
|
781
|
+
}
|
|
782
|
+
|
|
783
|
+
return true;
|
|
784
|
+
};
|
|
785
|
+
|
|
786
|
+
EventEmitter.prototype.addListener = function(type, listener) {
|
|
787
|
+
var m;
|
|
788
|
+
|
|
789
|
+
if (!isFunction(listener))
|
|
790
|
+
throw TypeError('listener must be a function');
|
|
791
|
+
|
|
792
|
+
if (!this._events)
|
|
793
|
+
this._events = {};
|
|
794
|
+
|
|
795
|
+
// To avoid recursion in the case that type === "newListener"! Before
|
|
796
|
+
// adding it to the listeners, first emit "newListener".
|
|
797
|
+
if (this._events.newListener)
|
|
798
|
+
this.emit('newListener', type,
|
|
799
|
+
isFunction(listener.listener) ?
|
|
800
|
+
listener.listener : listener);
|
|
801
|
+
|
|
802
|
+
if (!this._events[type])
|
|
803
|
+
// Optimize the case of one listener. Don't need the extra array object.
|
|
804
|
+
this._events[type] = listener;
|
|
805
|
+
else if (isObject(this._events[type]))
|
|
806
|
+
// If we've already got an array, just append.
|
|
807
|
+
this._events[type].push(listener);
|
|
808
|
+
else
|
|
809
|
+
// Adding the second element, need to change to array.
|
|
810
|
+
this._events[type] = [this._events[type], listener];
|
|
811
|
+
|
|
812
|
+
// Check for listener leak
|
|
813
|
+
if (isObject(this._events[type]) && !this._events[type].warned) {
|
|
814
|
+
if (!isUndefined(this._maxListeners)) {
|
|
815
|
+
m = this._maxListeners;
|
|
816
|
+
} else {
|
|
817
|
+
m = EventEmitter.defaultMaxListeners;
|
|
818
|
+
}
|
|
819
|
+
|
|
820
|
+
if (m && m > 0 && this._events[type].length > m) {
|
|
821
|
+
this._events[type].warned = true;
|
|
822
|
+
console.error('(node) warning: possible EventEmitter memory ' +
|
|
823
|
+
'leak detected. %d listeners added. ' +
|
|
824
|
+
'Use emitter.setMaxListeners() to increase limit.',
|
|
825
|
+
this._events[type].length);
|
|
826
|
+
if (typeof console.trace === 'function') {
|
|
827
|
+
// not supported in IE 10
|
|
828
|
+
console.trace();
|
|
829
|
+
}
|
|
830
|
+
}
|
|
831
|
+
}
|
|
832
|
+
|
|
833
|
+
return this;
|
|
834
|
+
};
|
|
835
|
+
|
|
836
|
+
EventEmitter.prototype.on = EventEmitter.prototype.addListener;
|
|
837
|
+
|
|
838
|
+
EventEmitter.prototype.once = function(type, listener) {
|
|
839
|
+
if (!isFunction(listener))
|
|
840
|
+
throw TypeError('listener must be a function');
|
|
841
|
+
|
|
842
|
+
var fired = false;
|
|
843
|
+
|
|
844
|
+
function g() {
|
|
845
|
+
this.removeListener(type, g);
|
|
846
|
+
|
|
847
|
+
if (!fired) {
|
|
848
|
+
fired = true;
|
|
849
|
+
listener.apply(this, arguments);
|
|
850
|
+
}
|
|
851
|
+
}
|
|
852
|
+
|
|
853
|
+
g.listener = listener;
|
|
854
|
+
this.on(type, g);
|
|
855
|
+
|
|
856
|
+
return this;
|
|
857
|
+
};
|
|
858
|
+
|
|
859
|
+
// emits a 'removeListener' event iff the listener was removed
|
|
860
|
+
EventEmitter.prototype.removeListener = function(type, listener) {
|
|
861
|
+
var list, position, length, i;
|
|
862
|
+
|
|
863
|
+
if (!isFunction(listener))
|
|
864
|
+
throw TypeError('listener must be a function');
|
|
865
|
+
|
|
866
|
+
if (!this._events || !this._events[type])
|
|
867
|
+
return this;
|
|
868
|
+
|
|
869
|
+
list = this._events[type];
|
|
870
|
+
length = list.length;
|
|
871
|
+
position = -1;
|
|
872
|
+
|
|
873
|
+
if (list === listener ||
|
|
874
|
+
(isFunction(list.listener) && list.listener === listener)) {
|
|
875
|
+
delete this._events[type];
|
|
876
|
+
if (this._events.removeListener)
|
|
877
|
+
this.emit('removeListener', type, listener);
|
|
878
|
+
|
|
879
|
+
} else if (isObject(list)) {
|
|
880
|
+
for (i = length; i-- > 0;) {
|
|
881
|
+
if (list[i] === listener ||
|
|
882
|
+
(list[i].listener && list[i].listener === listener)) {
|
|
883
|
+
position = i;
|
|
884
|
+
break;
|
|
885
|
+
}
|
|
886
|
+
}
|
|
887
|
+
|
|
888
|
+
if (position < 0)
|
|
889
|
+
return this;
|
|
890
|
+
|
|
891
|
+
if (list.length === 1) {
|
|
892
|
+
list.length = 0;
|
|
893
|
+
delete this._events[type];
|
|
894
|
+
} else {
|
|
895
|
+
list.splice(position, 1);
|
|
896
|
+
}
|
|
897
|
+
|
|
898
|
+
if (this._events.removeListener)
|
|
899
|
+
this.emit('removeListener', type, listener);
|
|
900
|
+
}
|
|
901
|
+
|
|
902
|
+
return this;
|
|
903
|
+
};
|
|
904
|
+
|
|
905
|
+
EventEmitter.prototype.removeAllListeners = function(type) {
|
|
906
|
+
var key, listeners;
|
|
907
|
+
|
|
908
|
+
if (!this._events)
|
|
909
|
+
return this;
|
|
910
|
+
|
|
911
|
+
// not listening for removeListener, no need to emit
|
|
912
|
+
if (!this._events.removeListener) {
|
|
913
|
+
if (arguments.length === 0)
|
|
914
|
+
this._events = {};
|
|
915
|
+
else if (this._events[type])
|
|
916
|
+
delete this._events[type];
|
|
917
|
+
return this;
|
|
918
|
+
}
|
|
919
|
+
|
|
920
|
+
// emit removeListener for all listeners on all events
|
|
921
|
+
if (arguments.length === 0) {
|
|
922
|
+
for (key in this._events) {
|
|
923
|
+
if (key === 'removeListener') continue;
|
|
924
|
+
this.removeAllListeners(key);
|
|
925
|
+
}
|
|
926
|
+
this.removeAllListeners('removeListener');
|
|
927
|
+
this._events = {};
|
|
928
|
+
return this;
|
|
929
|
+
}
|
|
930
|
+
|
|
931
|
+
listeners = this._events[type];
|
|
932
|
+
|
|
933
|
+
if (isFunction(listeners)) {
|
|
934
|
+
this.removeListener(type, listeners);
|
|
935
|
+
} else if (listeners) {
|
|
936
|
+
// LIFO order
|
|
937
|
+
while (listeners.length)
|
|
938
|
+
this.removeListener(type, listeners[listeners.length - 1]);
|
|
939
|
+
}
|
|
940
|
+
delete this._events[type];
|
|
941
|
+
|
|
942
|
+
return this;
|
|
943
|
+
};
|
|
944
|
+
|
|
945
|
+
EventEmitter.prototype.listeners = function(type) {
|
|
946
|
+
var ret;
|
|
947
|
+
if (!this._events || !this._events[type])
|
|
948
|
+
ret = [];
|
|
949
|
+
else if (isFunction(this._events[type]))
|
|
950
|
+
ret = [this._events[type]];
|
|
951
|
+
else
|
|
952
|
+
ret = this._events[type].slice();
|
|
953
|
+
return ret;
|
|
954
|
+
};
|
|
955
|
+
|
|
956
|
+
EventEmitter.prototype.listenerCount = function(type) {
|
|
957
|
+
if (this._events) {
|
|
958
|
+
var evlistener = this._events[type];
|
|
959
|
+
|
|
960
|
+
if (isFunction(evlistener))
|
|
961
|
+
return 1;
|
|
962
|
+
else if (evlistener)
|
|
963
|
+
return evlistener.length;
|
|
964
|
+
}
|
|
965
|
+
return 0;
|
|
966
|
+
};
|
|
967
|
+
|
|
968
|
+
EventEmitter.listenerCount = function(emitter, type) {
|
|
969
|
+
return emitter.listenerCount(type);
|
|
970
|
+
};
|
|
971
|
+
|
|
972
|
+
function isFunction(arg) {
|
|
973
|
+
return typeof arg === 'function';
|
|
974
|
+
}
|
|
975
|
+
|
|
976
|
+
function isNumber(arg) {
|
|
977
|
+
return typeof arg === 'number';
|
|
978
|
+
}
|
|
979
|
+
|
|
980
|
+
function isObject(arg) {
|
|
981
|
+
return typeof arg === 'object' && arg !== null;
|
|
982
|
+
}
|
|
983
|
+
|
|
984
|
+
function isUndefined(arg) {
|
|
985
|
+
return arg === void 0;
|
|
986
|
+
}
|
|
987
|
+
|
|
988
|
+
|
|
989
|
+
/***/ })
|
|
990
|
+
/******/ ])
|
|
991
|
+
});
|
|
992
|
+
} (lib));
|
|
993
|
+
|
|
994
|
+
var libExports = lib.exports;
|
|
995
|
+
var parseAPNG = /*@__PURE__*/getDefaultExportFromCjs(libExports);
|
|
996
|
+
|
|
997
|
+
const props = {
|
|
998
|
+
url: {
|
|
999
|
+
type: String,
|
|
1000
|
+
requierd: false
|
|
1001
|
+
},
|
|
1002
|
+
data: {
|
|
1003
|
+
type: Array,
|
|
1004
|
+
default: () => []
|
|
1005
|
+
},
|
|
1006
|
+
/**
|
|
1007
|
+
* @description 控制动画是否循环播放
|
|
1008
|
+
*/
|
|
1009
|
+
loop: {
|
|
1010
|
+
type: Boolean,
|
|
1011
|
+
default: false
|
|
1012
|
+
},
|
|
1013
|
+
/**
|
|
1014
|
+
* @description v-model:status 控制动画状态
|
|
1015
|
+
*/
|
|
1016
|
+
status: {
|
|
1017
|
+
type: String,
|
|
1018
|
+
default: TickerStatus.pending
|
|
1019
|
+
},
|
|
1020
|
+
frameRate: {
|
|
1021
|
+
type: Number,
|
|
1022
|
+
default: 25
|
|
1023
|
+
},
|
|
1024
|
+
label: {
|
|
1025
|
+
type: String,
|
|
1026
|
+
default: ""
|
|
1027
|
+
},
|
|
1028
|
+
resize: {
|
|
1029
|
+
type: Function,
|
|
1030
|
+
default: void 0
|
|
1031
|
+
},
|
|
1032
|
+
/**
|
|
1033
|
+
* @description 是否在有资源时预渲染第一帧
|
|
1034
|
+
*/
|
|
1035
|
+
prerender: {
|
|
1036
|
+
type: Boolean,
|
|
1037
|
+
default: false
|
|
1038
|
+
},
|
|
1039
|
+
visible: {
|
|
1040
|
+
type: Boolean,
|
|
1041
|
+
default: true
|
|
1042
|
+
}
|
|
1043
|
+
};
|
|
1044
|
+
const emits = {
|
|
1045
|
+
"update:status": null,
|
|
1046
|
+
"update:data": null,
|
|
1047
|
+
"setData": null
|
|
1048
|
+
};
|
|
1049
|
+
|
|
1050
|
+
const appInjectKey = Symbol("appInjectKey");
|
|
1051
|
+
function initPixiApp() {
|
|
1052
|
+
const application = new Application();
|
|
1053
|
+
const whenDef = new Deferred();
|
|
1054
|
+
const context = {
|
|
1055
|
+
whenDef,
|
|
1056
|
+
when: () => whenDef.promise
|
|
1057
|
+
};
|
|
1058
|
+
provide(appInjectKey, {
|
|
1059
|
+
application,
|
|
1060
|
+
context
|
|
1061
|
+
});
|
|
1062
|
+
return { application, context };
|
|
1063
|
+
}
|
|
1064
|
+
function usePixiApp() {
|
|
1065
|
+
const core = inject(appInjectKey);
|
|
1066
|
+
if (!core) {
|
|
1067
|
+
throw new Error("Pixi app not provided");
|
|
1068
|
+
}
|
|
1069
|
+
return core;
|
|
1070
|
+
}
|
|
1071
|
+
|
|
1072
|
+
function useSprite(props) {
|
|
1073
|
+
const autoResize = props.autoResize ?? true;
|
|
1074
|
+
const resize = props.resize ?? defaultResize;
|
|
1075
|
+
const { application: app, context } = usePixiApp();
|
|
1076
|
+
const sprite = new Sprite();
|
|
1077
|
+
app.stage.addChild(sprite);
|
|
1078
|
+
watchEffect(() => {
|
|
1079
|
+
sprite.visible = props.visible ?? true;
|
|
1080
|
+
});
|
|
1081
|
+
watchEffect(() => {
|
|
1082
|
+
props.label && (sprite.label = props.label);
|
|
1083
|
+
});
|
|
1084
|
+
autoResize && context.when().then((app2) => {
|
|
1085
|
+
if (sprite.texture) {
|
|
1086
|
+
resizeSprite();
|
|
1087
|
+
app2.renderer.on("resize", resizeSprite);
|
|
1088
|
+
}
|
|
1089
|
+
});
|
|
1090
|
+
function resizeSprite() {
|
|
1091
|
+
if (!app.renderer?.screen)
|
|
1092
|
+
return;
|
|
1093
|
+
const meta = sprite.texture._meta;
|
|
1094
|
+
resize({
|
|
1095
|
+
application: app,
|
|
1096
|
+
sprite,
|
|
1097
|
+
meta
|
|
1098
|
+
});
|
|
1099
|
+
}
|
|
1100
|
+
onBeforeUnmount(() => {
|
|
1101
|
+
app.renderer.off("resize", resizeSprite);
|
|
1102
|
+
app.stage.removeChild(sprite);
|
|
1103
|
+
});
|
|
1104
|
+
function defaultResize() {
|
|
1105
|
+
const scaleX = app.screen.width / sprite.texture.width;
|
|
1106
|
+
const scaleY = app.screen.height / sprite.texture.height;
|
|
1107
|
+
const scale = Math.min(scaleX, scaleY);
|
|
1108
|
+
sprite.scale.set(scale);
|
|
1109
|
+
sprite.x = (app.screen.width - sprite.width) / 2;
|
|
1110
|
+
sprite.y = (app.screen.height - sprite.height) / 2;
|
|
1111
|
+
}
|
|
1112
|
+
return {
|
|
1113
|
+
sprite,
|
|
1114
|
+
resizeSprite,
|
|
1115
|
+
application: app
|
|
1116
|
+
};
|
|
1117
|
+
}
|
|
1118
|
+
|
|
1119
|
+
var _sfc_main$7 = /* @__PURE__ */ defineComponent({
|
|
1120
|
+
__name: "apng",
|
|
1121
|
+
props: {
|
|
1122
|
+
...props,
|
|
1123
|
+
url: {
|
|
1124
|
+
type: String,
|
|
1125
|
+
required: true
|
|
1126
|
+
}
|
|
1127
|
+
},
|
|
1128
|
+
emits,
|
|
1129
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1130
|
+
__expose();
|
|
1131
|
+
const props = __props;
|
|
1132
|
+
const emit = __emit;
|
|
1133
|
+
const compId = useId();
|
|
1134
|
+
const getAlias = (frameIndex) => `${compId}-apng-frame-${frameIndex}`;
|
|
1135
|
+
const { sprite, resizeSprite } = useSprite(props);
|
|
1136
|
+
const frames = ref([]);
|
|
1137
|
+
const index = ref(0);
|
|
1138
|
+
const isLoaded = ref(false);
|
|
1139
|
+
const error = ref("");
|
|
1140
|
+
const textureMap = /* @__PURE__ */ new Map();
|
|
1141
|
+
let timer = null;
|
|
1142
|
+
let reusableCanvas = null;
|
|
1143
|
+
let reusableCtx = null;
|
|
1144
|
+
onMounted(() => loadAPNG(props.url));
|
|
1145
|
+
function getReusableCanvas(width, height) {
|
|
1146
|
+
if (!reusableCanvas) {
|
|
1147
|
+
reusableCanvas = document.createElement("canvas");
|
|
1148
|
+
reusableCtx = reusableCanvas.getContext("2d", {
|
|
1149
|
+
willReadFrequently: true
|
|
1150
|
+
});
|
|
1151
|
+
}
|
|
1152
|
+
if (reusableCanvas.width !== width || reusableCanvas.height !== height) {
|
|
1153
|
+
reusableCanvas.width = width;
|
|
1154
|
+
reusableCanvas.height = height;
|
|
1155
|
+
}
|
|
1156
|
+
return { canvas: reusableCanvas, ctx: reusableCtx };
|
|
1157
|
+
}
|
|
1158
|
+
async function loadAPNG(url) {
|
|
1159
|
+
try {
|
|
1160
|
+
error.value = "";
|
|
1161
|
+
isLoaded.value = false;
|
|
1162
|
+
await cleanup();
|
|
1163
|
+
const response = await fetch(url);
|
|
1164
|
+
if (!response.ok) {
|
|
1165
|
+
throw new Error(`\u52A0\u8F7DAPNG\u5931\u8D25: ${response.status}`);
|
|
1166
|
+
}
|
|
1167
|
+
const arrayBuffer = await response.arrayBuffer();
|
|
1168
|
+
const apng = parseAPNG(arrayBuffer);
|
|
1169
|
+
if (apng instanceof Error) {
|
|
1170
|
+
throw new TypeError(`APNG\u89E3\u6790\u5931\u8D25: ${apng.message}`);
|
|
1171
|
+
}
|
|
1172
|
+
const { canvas, ctx } = getReusableCanvas(apng.width, apng.height);
|
|
1173
|
+
const framePromises = apng.frames.map(async (frame, frameIndex) => {
|
|
1174
|
+
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
1175
|
+
await frame.createImage();
|
|
1176
|
+
const img = frame.imageElement;
|
|
1177
|
+
ctx.drawImage(img, frame.left, frame.top);
|
|
1178
|
+
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
|
1179
|
+
const alias = getAlias(frameIndex);
|
|
1180
|
+
textureMap.set(alias, void 0);
|
|
1181
|
+
ctx.putImageData(imageData, 0, 0);
|
|
1182
|
+
const dataUrl = canvas.toDataURL();
|
|
1183
|
+
Assets.add({ alias, src: dataUrl });
|
|
1184
|
+
const texture = await Assets.load(alias);
|
|
1185
|
+
textureMap.set(alias, texture);
|
|
1186
|
+
if (frameIndex === 0) {
|
|
1187
|
+
sprite.texture = texture;
|
|
1188
|
+
resizeSprite();
|
|
1189
|
+
}
|
|
1190
|
+
return alias;
|
|
1191
|
+
});
|
|
1192
|
+
frames.value = await Promise.all(framePromises);
|
|
1193
|
+
isLoaded.value = true;
|
|
1194
|
+
} catch (err) {
|
|
1195
|
+
console.error("\u52A0\u8F7DAPNG\u5931\u8D25:", err);
|
|
1196
|
+
error.value = err instanceof Error ? err.message : "\u52A0\u8F7DAPNG\u5931\u8D25";
|
|
1197
|
+
emit("update:status", TickerStatus.stopped);
|
|
1198
|
+
}
|
|
1199
|
+
}
|
|
1200
|
+
function startFrameLoop() {
|
|
1201
|
+
if (timer !== null)
|
|
1202
|
+
return;
|
|
1203
|
+
timer = window.setInterval(() => {
|
|
1204
|
+
if (frames.value.length === 0 || props.status !== TickerStatus.playing) {
|
|
1205
|
+
return;
|
|
1206
|
+
}
|
|
1207
|
+
const currentTexture = textureMap.get(
|
|
1208
|
+
getAlias(index.value)
|
|
1209
|
+
);
|
|
1210
|
+
if (currentTexture) {
|
|
1211
|
+
const originIndex = index.value - 1;
|
|
1212
|
+
if (originIndex >= 0 && !props.loop) {
|
|
1213
|
+
Promise.resolve().then(() => sleep(500)).then(() => {
|
|
1214
|
+
Assets.unload(getAlias(originIndex));
|
|
1215
|
+
textureMap.delete(getAlias(originIndex));
|
|
1216
|
+
});
|
|
1217
|
+
}
|
|
1218
|
+
sprite.texture = currentTexture;
|
|
1219
|
+
resizeSprite();
|
|
1220
|
+
index.value = props.loop ? (index.value + 1) % frames.value.length : index.value + 1;
|
|
1221
|
+
} else {
|
|
1222
|
+
if (!props.loop)
|
|
1223
|
+
emit("update:status", TickerStatus.paused);
|
|
1224
|
+
}
|
|
1225
|
+
}, 1e3 / props.frameRate);
|
|
1226
|
+
}
|
|
1227
|
+
function play() {
|
|
1228
|
+
if (!isLoaded.value || frames.value.length <= 1) {
|
|
1229
|
+
return;
|
|
1230
|
+
}
|
|
1231
|
+
emit("update:status", TickerStatus.playing);
|
|
1232
|
+
startFrameLoop();
|
|
1233
|
+
}
|
|
1234
|
+
function pause() {
|
|
1235
|
+
if (timer !== null) {
|
|
1236
|
+
clearInterval(timer);
|
|
1237
|
+
timer = null;
|
|
1238
|
+
}
|
|
1239
|
+
emit("update:status", TickerStatus.paused);
|
|
1240
|
+
}
|
|
1241
|
+
function stop() {
|
|
1242
|
+
if (timer !== null) {
|
|
1243
|
+
clearInterval(timer);
|
|
1244
|
+
timer = null;
|
|
1245
|
+
}
|
|
1246
|
+
index.value = 0;
|
|
1247
|
+
const firstTexture = textureMap.get(getAlias(0));
|
|
1248
|
+
if (firstTexture) {
|
|
1249
|
+
sprite.texture = firstTexture;
|
|
1250
|
+
resizeSprite();
|
|
1251
|
+
}
|
|
1252
|
+
emit("update:status", TickerStatus.stopped);
|
|
1253
|
+
}
|
|
1254
|
+
async function cleanup() {
|
|
1255
|
+
if (timer !== null) {
|
|
1256
|
+
clearInterval(timer);
|
|
1257
|
+
timer = null;
|
|
1258
|
+
}
|
|
1259
|
+
const unloadPromises = [];
|
|
1260
|
+
for (const [alias, texture] of textureMap) {
|
|
1261
|
+
if (texture && texture !== Texture.EMPTY) {
|
|
1262
|
+
unloadPromises.push(Assets.unload(alias));
|
|
1263
|
+
}
|
|
1264
|
+
}
|
|
1265
|
+
await Promise.all(unloadPromises);
|
|
1266
|
+
textureMap.clear();
|
|
1267
|
+
frames.value = [];
|
|
1268
|
+
index.value = 0;
|
|
1269
|
+
isLoaded.value = false;
|
|
1270
|
+
error.value = "";
|
|
1271
|
+
if (reusableCanvas) {
|
|
1272
|
+
reusableCanvas.width = 0;
|
|
1273
|
+
reusableCanvas.height = 0;
|
|
1274
|
+
}
|
|
1275
|
+
}
|
|
1276
|
+
watchEffect(() => {
|
|
1277
|
+
switch (props.status) {
|
|
1278
|
+
case TickerStatus.play:
|
|
1279
|
+
play();
|
|
1280
|
+
break;
|
|
1281
|
+
case TickerStatus.pause:
|
|
1282
|
+
pause();
|
|
1283
|
+
break;
|
|
1284
|
+
case TickerStatus.stop:
|
|
1285
|
+
stop();
|
|
1286
|
+
break;
|
|
1287
|
+
}
|
|
1288
|
+
});
|
|
1289
|
+
onBeforeUnmount(async () => {
|
|
1290
|
+
await cleanup();
|
|
1291
|
+
reusableCanvas = null;
|
|
1292
|
+
reusableCtx = null;
|
|
1293
|
+
});
|
|
1294
|
+
const __returned__ = { props, emit, compId, getAlias, sprite, resizeSprite, frames, index, isLoaded, error, textureMap, get timer() {
|
|
1295
|
+
return timer;
|
|
1296
|
+
}, set timer(v) {
|
|
1297
|
+
timer = v;
|
|
1298
|
+
}, get reusableCanvas() {
|
|
1299
|
+
return reusableCanvas;
|
|
1300
|
+
}, set reusableCanvas(v) {
|
|
1301
|
+
reusableCanvas = v;
|
|
1302
|
+
}, get reusableCtx() {
|
|
1303
|
+
return reusableCtx;
|
|
1304
|
+
}, set reusableCtx(v) {
|
|
1305
|
+
reusableCtx = v;
|
|
1306
|
+
}, getReusableCanvas, loadAPNG, startFrameLoop, play, pause, stop, cleanup };
|
|
1307
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1308
|
+
return __returned__;
|
|
1309
|
+
}
|
|
1310
|
+
});
|
|
1311
|
+
|
|
1312
|
+
function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1313
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1314
|
+
}
|
|
1315
|
+
var ApngComp = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$7], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/apng.vue"]]);
|
|
1316
|
+
|
|
1317
|
+
var _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
1318
|
+
__name: "bitmap-generator",
|
|
1319
|
+
props: {
|
|
1320
|
+
...pickObject(props, {
|
|
1321
|
+
excludes: ["loop"]
|
|
1322
|
+
}),
|
|
1323
|
+
generator: {
|
|
1324
|
+
type: Object,
|
|
1325
|
+
required: true
|
|
1326
|
+
}
|
|
1327
|
+
},
|
|
1328
|
+
emits: {
|
|
1329
|
+
"update:status": null,
|
|
1330
|
+
"load": (e) => e
|
|
1331
|
+
},
|
|
1332
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1333
|
+
__expose();
|
|
1334
|
+
const props = __props;
|
|
1335
|
+
const emit = __emit;
|
|
1336
|
+
const { sprite, resizeSprite, application } = useSprite(props);
|
|
1337
|
+
const texture = new Texture({
|
|
1338
|
+
dynamic: true
|
|
1339
|
+
});
|
|
1340
|
+
sprite.texture = texture;
|
|
1341
|
+
function updateTextureFromBitmap(bitmap) {
|
|
1342
|
+
texture.source.destroy();
|
|
1343
|
+
const source = new ImageSource({
|
|
1344
|
+
resource: bitmap
|
|
1345
|
+
});
|
|
1346
|
+
texture.source = source;
|
|
1347
|
+
texture.update();
|
|
1348
|
+
resizeSprite();
|
|
1349
|
+
}
|
|
1350
|
+
emit("load", {
|
|
1351
|
+
application,
|
|
1352
|
+
sprite
|
|
1353
|
+
});
|
|
1354
|
+
watch(() => props.status, (newStatus) => {
|
|
1355
|
+
newStatus === TickerStatus.play && play();
|
|
1356
|
+
newStatus === TickerStatus.pause && pause();
|
|
1357
|
+
newStatus === TickerStatus.stop && stop();
|
|
1358
|
+
}, { immediate: true });
|
|
1359
|
+
function drawFrame() {
|
|
1360
|
+
if (props.status !== TickerStatus.playing) {
|
|
1361
|
+
return;
|
|
1362
|
+
}
|
|
1363
|
+
props.generator.next().then(({ value, done }) => {
|
|
1364
|
+
if (done) {
|
|
1365
|
+
return emit("update:status", TickerStatus.stopped);
|
|
1366
|
+
}
|
|
1367
|
+
updateTextureFromBitmap(value);
|
|
1368
|
+
});
|
|
1369
|
+
}
|
|
1370
|
+
function play() {
|
|
1371
|
+
application.ticker.minFPS = props.frameRate;
|
|
1372
|
+
application.ticker.maxFPS = props.frameRate;
|
|
1373
|
+
emit("update:status", TickerStatus.playing);
|
|
1374
|
+
application.ticker.add(drawFrame);
|
|
1375
|
+
}
|
|
1376
|
+
function pause() {
|
|
1377
|
+
application.ticker.remove(drawFrame);
|
|
1378
|
+
emit("update:status", TickerStatus.paused);
|
|
1379
|
+
}
|
|
1380
|
+
function stop() {
|
|
1381
|
+
application.ticker.remove(drawFrame);
|
|
1382
|
+
emit("update:status", TickerStatus.stopped);
|
|
1383
|
+
}
|
|
1384
|
+
onBeforeUnmount(() => {
|
|
1385
|
+
stop();
|
|
1386
|
+
texture.destroy();
|
|
1387
|
+
});
|
|
1388
|
+
const __returned__ = { props, emit, sprite, resizeSprite, application, texture, updateTextureFromBitmap, drawFrame, play, pause, stop };
|
|
1389
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1390
|
+
return __returned__;
|
|
1391
|
+
}
|
|
1392
|
+
});
|
|
1393
|
+
|
|
1394
|
+
function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1395
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1396
|
+
}
|
|
1397
|
+
var bitmapGenerator = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/bitmap-generator.vue"]]);
|
|
1398
|
+
|
|
1399
|
+
var _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
1400
|
+
__name: "bitmap",
|
|
1401
|
+
props: {
|
|
1402
|
+
...pickObject(props, {
|
|
1403
|
+
excludes: ["loop"]
|
|
1404
|
+
}),
|
|
1405
|
+
data: {
|
|
1406
|
+
type: void 0,
|
|
1407
|
+
required: true
|
|
1408
|
+
},
|
|
1409
|
+
frameIndex: {
|
|
1410
|
+
type: Number
|
|
1411
|
+
}
|
|
1412
|
+
},
|
|
1413
|
+
emits: {
|
|
1414
|
+
...emits,
|
|
1415
|
+
"load": (e) => e,
|
|
1416
|
+
"update:frameIndex": null,
|
|
1417
|
+
"notFound": (_index) => true
|
|
1418
|
+
},
|
|
1419
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1420
|
+
__expose();
|
|
1421
|
+
const props = __props;
|
|
1422
|
+
const emit = __emit;
|
|
1423
|
+
const { sprite, resizeSprite, application } = useSprite(props);
|
|
1424
|
+
const texture = new Texture({
|
|
1425
|
+
dynamic: true
|
|
1426
|
+
});
|
|
1427
|
+
sprite.texture = texture;
|
|
1428
|
+
function updateTextureFromBitmap(bitmap) {
|
|
1429
|
+
texture.source?.destroy();
|
|
1430
|
+
const source = new ImageSource({
|
|
1431
|
+
resource: bitmap
|
|
1432
|
+
});
|
|
1433
|
+
texture.source = source;
|
|
1434
|
+
texture.update();
|
|
1435
|
+
resizeSprite();
|
|
1436
|
+
}
|
|
1437
|
+
emit("load", {
|
|
1438
|
+
application,
|
|
1439
|
+
sprite
|
|
1440
|
+
});
|
|
1441
|
+
const index = useModelComputed({
|
|
1442
|
+
default: 0,
|
|
1443
|
+
key: "frameIndex"
|
|
1444
|
+
}, props, emit);
|
|
1445
|
+
const lastScheduledClearIndex = ref(-1);
|
|
1446
|
+
function scheduleClearFrame(frameIndex) {
|
|
1447
|
+
if (frameIndex <= lastScheduledClearIndex.value)
|
|
1448
|
+
return;
|
|
1449
|
+
lastScheduledClearIndex.value = frameIndex;
|
|
1450
|
+
Promise.resolve(sleep(500)).then(() => {
|
|
1451
|
+
emit("setData", {
|
|
1452
|
+
k: frameIndex,
|
|
1453
|
+
v: null
|
|
1454
|
+
});
|
|
1455
|
+
});
|
|
1456
|
+
}
|
|
1457
|
+
function drawFrame() {
|
|
1458
|
+
if (props.data.length === 0 || props.status !== TickerStatus.playing) {
|
|
1459
|
+
return;
|
|
1460
|
+
}
|
|
1461
|
+
const bitmap = props.data[index.value];
|
|
1462
|
+
if (bitmap) {
|
|
1463
|
+
const originIndex = index.value - 1;
|
|
1464
|
+
if (originIndex >= 0) {
|
|
1465
|
+
scheduleClearFrame(originIndex);
|
|
1466
|
+
}
|
|
1467
|
+
updateTextureFromBitmap(bitmap);
|
|
1468
|
+
index.value = index.value + 1;
|
|
1469
|
+
} else {
|
|
1470
|
+
console.warn(
|
|
1471
|
+
`Bitmap for index ${index.value} not found. Ensure the data is loaded.`
|
|
1472
|
+
);
|
|
1473
|
+
emit("notFound", index.value);
|
|
1474
|
+
}
|
|
1475
|
+
}
|
|
1476
|
+
watchEffect(() => {
|
|
1477
|
+
if (props.prerender && index.value === 0 && props.data.length > 0 && props.data[0]) {
|
|
1478
|
+
updateTextureFromBitmap(props.data[0]);
|
|
1479
|
+
}
|
|
1480
|
+
});
|
|
1481
|
+
watch(() => props.status, (newStatus) => {
|
|
1482
|
+
newStatus === TickerStatus.play && play();
|
|
1483
|
+
newStatus === TickerStatus.pause && pause();
|
|
1484
|
+
newStatus === TickerStatus.stop && stop();
|
|
1485
|
+
}, { immediate: true });
|
|
1486
|
+
function play() {
|
|
1487
|
+
if (props.data.length > 0) {
|
|
1488
|
+
application.ticker.minFPS = props.frameRate;
|
|
1489
|
+
application.ticker.maxFPS = props.frameRate;
|
|
1490
|
+
emit("update:status", TickerStatus.playing);
|
|
1491
|
+
application.ticker.add(drawFrame);
|
|
1492
|
+
} else {
|
|
1493
|
+
emit("update:status", TickerStatus.stopped);
|
|
1494
|
+
}
|
|
1495
|
+
}
|
|
1496
|
+
function pause() {
|
|
1497
|
+
application.ticker.remove(drawFrame);
|
|
1498
|
+
emit("update:status", TickerStatus.paused);
|
|
1499
|
+
}
|
|
1500
|
+
function stop() {
|
|
1501
|
+
application.ticker.remove(drawFrame);
|
|
1502
|
+
emit("update:status", TickerStatus.stopped);
|
|
1503
|
+
emit("update:data", []);
|
|
1504
|
+
index.value = 0;
|
|
1505
|
+
lastScheduledClearIndex.value = -1;
|
|
1506
|
+
}
|
|
1507
|
+
onBeforeUnmount(() => {
|
|
1508
|
+
stop();
|
|
1509
|
+
texture.destroy();
|
|
1510
|
+
});
|
|
1511
|
+
const __returned__ = { props, emit, sprite, resizeSprite, application, texture, updateTextureFromBitmap, index, lastScheduledClearIndex, scheduleClearFrame, drawFrame, play, pause, stop };
|
|
1512
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1513
|
+
return __returned__;
|
|
1514
|
+
}
|
|
1515
|
+
});
|
|
1516
|
+
|
|
1517
|
+
function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1518
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1519
|
+
}
|
|
1520
|
+
var Bitmap = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$5], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/bitmap.vue"]]);
|
|
1521
|
+
|
|
1522
|
+
var _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
1523
|
+
__name: "core",
|
|
1524
|
+
props: {
|
|
1525
|
+
...props,
|
|
1526
|
+
data: {
|
|
1527
|
+
type: void 0,
|
|
1528
|
+
required: true
|
|
1529
|
+
},
|
|
1530
|
+
frameIndex: {
|
|
1531
|
+
type: Number
|
|
1532
|
+
}
|
|
1533
|
+
},
|
|
1534
|
+
emits: {
|
|
1535
|
+
...emits,
|
|
1536
|
+
"load": (e) => e,
|
|
1537
|
+
"update:frameIndex": null,
|
|
1538
|
+
"notFound": (_index) => true
|
|
1539
|
+
},
|
|
1540
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1541
|
+
__expose();
|
|
1542
|
+
const props = __props;
|
|
1543
|
+
const emit = __emit;
|
|
1544
|
+
const compId = useId();
|
|
1545
|
+
const getAlias = (key) => `${compId}-${key}`;
|
|
1546
|
+
const { sprite, resizeSprite, application } = useSprite(props);
|
|
1547
|
+
const textureMap = /* @__PURE__ */ new Map();
|
|
1548
|
+
const completedIndex = ref(0);
|
|
1549
|
+
const enabledData = computed(() => {
|
|
1550
|
+
return props.data.slice(completedIndex.value);
|
|
1551
|
+
});
|
|
1552
|
+
watchEffect(() => {
|
|
1553
|
+
for (const key in enabledData.value) {
|
|
1554
|
+
const theKey = +key + completedIndex.value;
|
|
1555
|
+
const alias = `${compId}-${theKey}`;
|
|
1556
|
+
const src = typeof enabledData.value[key] === "string" ? enabledData.value[key] : enabledData.value[key]?.src;
|
|
1557
|
+
if (!src) {
|
|
1558
|
+
continue;
|
|
1559
|
+
}
|
|
1560
|
+
if (textureMap.has(alias)) {
|
|
1561
|
+
continue;
|
|
1562
|
+
}
|
|
1563
|
+
Assets.add({
|
|
1564
|
+
alias,
|
|
1565
|
+
src,
|
|
1566
|
+
loadParser: "loadTextures"
|
|
1567
|
+
});
|
|
1568
|
+
textureMap.set(alias, void 0);
|
|
1569
|
+
Assets.load(alias).then((res) => {
|
|
1570
|
+
res._meta = enabledData.value[key];
|
|
1571
|
+
textureMap.set(alias, res);
|
|
1572
|
+
if (props.prerender && theKey === 0) {
|
|
1573
|
+
sprite.texture = res;
|
|
1574
|
+
resizeSprite();
|
|
1575
|
+
}
|
|
1576
|
+
});
|
|
1577
|
+
}
|
|
1578
|
+
});
|
|
1579
|
+
emit("load", {
|
|
1580
|
+
application,
|
|
1581
|
+
sprite
|
|
1582
|
+
});
|
|
1583
|
+
const index = useModelComputed({
|
|
1584
|
+
default: 0,
|
|
1585
|
+
key: "frameIndex"
|
|
1586
|
+
}, props, emit);
|
|
1587
|
+
let animationId = null;
|
|
1588
|
+
let lastFrameTime = 0;
|
|
1589
|
+
function startFrameLoop() {
|
|
1590
|
+
if (animationId !== null)
|
|
1591
|
+
return;
|
|
1592
|
+
lastFrameTime = performance.now();
|
|
1593
|
+
function renderFrame() {
|
|
1594
|
+
const now = performance.now();
|
|
1595
|
+
const frameDuration = 1e3 / props.frameRate;
|
|
1596
|
+
const delta = now - lastFrameTime;
|
|
1597
|
+
if (delta >= frameDuration) {
|
|
1598
|
+
lastFrameTime = now - delta % frameDuration;
|
|
1599
|
+
drawFrame();
|
|
1600
|
+
}
|
|
1601
|
+
if (props.status === TickerStatus.playing) {
|
|
1602
|
+
animationId = requestAnimationFrame(renderFrame);
|
|
1603
|
+
} else {
|
|
1604
|
+
animationId = null;
|
|
1605
|
+
}
|
|
1606
|
+
}
|
|
1607
|
+
function drawFrame() {
|
|
1608
|
+
if (props.data.length === 0 || props.status !== TickerStatus.playing) {
|
|
1609
|
+
return;
|
|
1610
|
+
}
|
|
1611
|
+
const currentTexture = textureMap.get(
|
|
1612
|
+
getAlias(index.value)
|
|
1613
|
+
);
|
|
1614
|
+
if (currentTexture) {
|
|
1615
|
+
const originTexture = sprite.texture;
|
|
1616
|
+
const originIndex = index.value - 1;
|
|
1617
|
+
if (originTexture && originIndex >= 0 && !props.loop) {
|
|
1618
|
+
Promise.resolve(sleep(500)).then(() => Assets.unload(
|
|
1619
|
+
getAlias(originIndex)
|
|
1620
|
+
)).then(() => {
|
|
1621
|
+
textureMap.set(
|
|
1622
|
+
getAlias(originIndex),
|
|
1623
|
+
void 0
|
|
1624
|
+
);
|
|
1625
|
+
emit("setData", {
|
|
1626
|
+
k: originIndex,
|
|
1627
|
+
v: ""
|
|
1628
|
+
});
|
|
1629
|
+
completedIndex.value = originIndex;
|
|
1630
|
+
});
|
|
1631
|
+
}
|
|
1632
|
+
sprite.texture = currentTexture;
|
|
1633
|
+
resizeSprite();
|
|
1634
|
+
index.value = props.loop ? (index.value + 1) % props.data.length : index.value + 1;
|
|
1635
|
+
} else {
|
|
1636
|
+
console.warn(
|
|
1637
|
+
`Texture for index ${index.value} not found. Ensure the texture is loaded.`
|
|
1638
|
+
);
|
|
1639
|
+
emit("notFound", index.value);
|
|
1640
|
+
if (!props.loop)
|
|
1641
|
+
emit("update:status", TickerStatus.paused);
|
|
1642
|
+
}
|
|
1643
|
+
}
|
|
1644
|
+
animationId = requestAnimationFrame(renderFrame);
|
|
1645
|
+
}
|
|
1646
|
+
watch(() => props.status, (newStatus) => {
|
|
1647
|
+
newStatus === TickerStatus.play && play();
|
|
1648
|
+
newStatus === TickerStatus.pause && pause();
|
|
1649
|
+
newStatus === TickerStatus.stop && stop();
|
|
1650
|
+
}, { immediate: true });
|
|
1651
|
+
function play() {
|
|
1652
|
+
if (props.data.length > 0) {
|
|
1653
|
+
emit("update:status", TickerStatus.playing);
|
|
1654
|
+
startFrameLoop();
|
|
1655
|
+
} else {
|
|
1656
|
+
emit("update:status", TickerStatus.stopped);
|
|
1657
|
+
}
|
|
1658
|
+
}
|
|
1659
|
+
function pause() {
|
|
1660
|
+
emit("update:status", TickerStatus.paused);
|
|
1661
|
+
}
|
|
1662
|
+
function stop() {
|
|
1663
|
+
emit("update:status", TickerStatus.stopped);
|
|
1664
|
+
if (animationId !== null) {
|
|
1665
|
+
cancelAnimationFrame(animationId);
|
|
1666
|
+
animationId = null;
|
|
1667
|
+
}
|
|
1668
|
+
emit("update:data", []);
|
|
1669
|
+
textureMap.clear();
|
|
1670
|
+
index.value = 0;
|
|
1671
|
+
}
|
|
1672
|
+
onBeforeUnmount(() => {
|
|
1673
|
+
const entries = Array.from(textureMap.entries());
|
|
1674
|
+
entries.forEach(([alias, texture]) => {
|
|
1675
|
+
if (texture) {
|
|
1676
|
+
Assets.unload(alias);
|
|
1677
|
+
}
|
|
1678
|
+
});
|
|
1679
|
+
stop();
|
|
1680
|
+
});
|
|
1681
|
+
const __returned__ = { props, emit, compId, getAlias, sprite, resizeSprite, application, textureMap, completedIndex, enabledData, index, get animationId() {
|
|
1682
|
+
return animationId;
|
|
1683
|
+
}, set animationId(v) {
|
|
1684
|
+
animationId = v;
|
|
1685
|
+
}, get lastFrameTime() {
|
|
1686
|
+
return lastFrameTime;
|
|
1687
|
+
}, set lastFrameTime(v) {
|
|
1688
|
+
lastFrameTime = v;
|
|
1689
|
+
}, startFrameLoop, play, pause, stop };
|
|
1690
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1691
|
+
return __returned__;
|
|
1692
|
+
}
|
|
1693
|
+
});
|
|
1694
|
+
|
|
1695
|
+
function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1696
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1697
|
+
}
|
|
1698
|
+
var core = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$4], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/core.vue"]]);
|
|
1699
|
+
|
|
1700
|
+
var _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
1701
|
+
__name: "provider",
|
|
1702
|
+
setup(__props, { expose: __expose }) {
|
|
1703
|
+
__expose();
|
|
1704
|
+
initPixiApp();
|
|
1705
|
+
const __returned__ = {};
|
|
1706
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1707
|
+
return __returned__;
|
|
1708
|
+
}
|
|
1709
|
+
});
|
|
1710
|
+
|
|
1711
|
+
function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1712
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1713
|
+
}
|
|
1714
|
+
var ProviderComp = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/provider.vue"]]);
|
|
1715
|
+
|
|
1716
|
+
var _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
1717
|
+
__name: "video",
|
|
1718
|
+
props: {
|
|
1719
|
+
...props,
|
|
1720
|
+
url: {
|
|
1721
|
+
type: String,
|
|
1722
|
+
required: true
|
|
1723
|
+
}
|
|
1724
|
+
},
|
|
1725
|
+
emits,
|
|
1726
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1727
|
+
__expose();
|
|
1728
|
+
const props = __props;
|
|
1729
|
+
const emit = __emit;
|
|
1730
|
+
const compId = useId();
|
|
1731
|
+
const getAlias = () => `${compId}-video`;
|
|
1732
|
+
const { sprite, resizeSprite } = useSprite(props);
|
|
1733
|
+
const texture = ref();
|
|
1734
|
+
const video = computed(() => {
|
|
1735
|
+
if (texture.value?.source && texture.value.source.resource) {
|
|
1736
|
+
const resource = texture.value.source.resource;
|
|
1737
|
+
if (resource instanceof HTMLVideoElement) {
|
|
1738
|
+
return resource;
|
|
1739
|
+
}
|
|
1740
|
+
}
|
|
1741
|
+
return null;
|
|
1742
|
+
});
|
|
1743
|
+
const readyDef = useDeferred();
|
|
1744
|
+
const videoError = ref("");
|
|
1745
|
+
readyDef.promise.then(() => {
|
|
1746
|
+
if (props.status === TickerStatus.play) {
|
|
1747
|
+
play();
|
|
1748
|
+
}
|
|
1749
|
+
});
|
|
1750
|
+
watchEffect(() => {
|
|
1751
|
+
video.value && (video.value.loop = props.loop);
|
|
1752
|
+
});
|
|
1753
|
+
onMounted(() => loadVideoTexture(props.url));
|
|
1754
|
+
async function loadVideoTexture(url) {
|
|
1755
|
+
try {
|
|
1756
|
+
videoError.value = "";
|
|
1757
|
+
const alias = getAlias();
|
|
1758
|
+
if (Assets.cache.has(alias)) {
|
|
1759
|
+
await Assets.unload(alias);
|
|
1760
|
+
}
|
|
1761
|
+
Assets.add({ alias, src: url });
|
|
1762
|
+
const videoTexture = await Assets.load(alias);
|
|
1763
|
+
texture.value = videoTexture;
|
|
1764
|
+
sprite.texture = videoTexture;
|
|
1765
|
+
if (video.value) {
|
|
1766
|
+
video.value.loop = props.loop;
|
|
1767
|
+
video.value.muted = true;
|
|
1768
|
+
video.value.crossOrigin = "anonymous";
|
|
1769
|
+
setupVideoEvents(video.value);
|
|
1770
|
+
readyDef.resolve();
|
|
1771
|
+
}
|
|
1772
|
+
resizeSprite();
|
|
1773
|
+
return videoTexture;
|
|
1774
|
+
} catch (error) {
|
|
1775
|
+
console.error("\u52A0\u8F7D\u89C6\u9891\u7EB9\u7406\u5931\u8D25:", error);
|
|
1776
|
+
videoError.value = "\u89C6\u9891\u52A0\u8F7D\u5931\u8D25";
|
|
1777
|
+
return null;
|
|
1778
|
+
}
|
|
1779
|
+
}
|
|
1780
|
+
function setupVideoEvents(video2) {
|
|
1781
|
+
video2.addEventListener("play", () => {
|
|
1782
|
+
if (props.status !== TickerStatus.playing) {
|
|
1783
|
+
emit("update:status", TickerStatus.playing);
|
|
1784
|
+
}
|
|
1785
|
+
});
|
|
1786
|
+
video2.addEventListener("pause", () => {
|
|
1787
|
+
if (props.status !== TickerStatus.paused) {
|
|
1788
|
+
emit("update:status", TickerStatus.paused);
|
|
1789
|
+
}
|
|
1790
|
+
});
|
|
1791
|
+
video2.addEventListener("ended", () => {
|
|
1792
|
+
if (props.loop) {
|
|
1793
|
+
video2.currentTime = 0;
|
|
1794
|
+
video2.play();
|
|
1795
|
+
} else {
|
|
1796
|
+
emit("update:status", TickerStatus.stopped);
|
|
1797
|
+
}
|
|
1798
|
+
});
|
|
1799
|
+
video2.addEventListener("error", (e) => {
|
|
1800
|
+
const error = video2.error;
|
|
1801
|
+
let errorMessage = "\u89C6\u9891\u64AD\u653E\u5931\u8D25";
|
|
1802
|
+
if (error) {
|
|
1803
|
+
switch (error.code) {
|
|
1804
|
+
case error.MEDIA_ERR_ABORTED:
|
|
1805
|
+
errorMessage = "\u89C6\u9891\u64AD\u653E\u88AB\u4E2D\u6B62";
|
|
1806
|
+
break;
|
|
1807
|
+
case error.MEDIA_ERR_NETWORK:
|
|
1808
|
+
errorMessage = "\u7F51\u7EDC\u9519\u8BEF\u5BFC\u81F4\u89C6\u9891\u64AD\u653E\u5931\u8D25";
|
|
1809
|
+
break;
|
|
1810
|
+
case error.MEDIA_ERR_DECODE:
|
|
1811
|
+
errorMessage = "\u89C6\u9891\u89E3\u7801\u5931\u8D25";
|
|
1812
|
+
break;
|
|
1813
|
+
case error.MEDIA_ERR_SRC_NOT_SUPPORTED:
|
|
1814
|
+
errorMessage = "\u4E0D\u652F\u6301\u7684\u89C6\u9891\u683C\u5F0F";
|
|
1815
|
+
break;
|
|
1816
|
+
}
|
|
1817
|
+
}
|
|
1818
|
+
console.error("\u89C6\u9891\u64AD\u653E\u9519\u8BEF:", errorMessage, e);
|
|
1819
|
+
videoError.value = errorMessage;
|
|
1820
|
+
emit("update:status", TickerStatus.stopped);
|
|
1821
|
+
});
|
|
1822
|
+
}
|
|
1823
|
+
async function cleanupVideo() {
|
|
1824
|
+
if (texture.value) {
|
|
1825
|
+
const alias = getAlias();
|
|
1826
|
+
texture.value.destroy(true);
|
|
1827
|
+
texture.value = void 0;
|
|
1828
|
+
if (Assets.cache.has(alias)) {
|
|
1829
|
+
await Assets.unload(alias);
|
|
1830
|
+
}
|
|
1831
|
+
}
|
|
1832
|
+
videoError.value = "";
|
|
1833
|
+
}
|
|
1834
|
+
watchEffect(() => {
|
|
1835
|
+
props.status === TickerStatus.play && play();
|
|
1836
|
+
props.status === TickerStatus.pause && pause();
|
|
1837
|
+
props.status === TickerStatus.stop && stop();
|
|
1838
|
+
});
|
|
1839
|
+
onBeforeUnmount(() => {
|
|
1840
|
+
cleanupVideo();
|
|
1841
|
+
});
|
|
1842
|
+
function play() {
|
|
1843
|
+
if (video.value) {
|
|
1844
|
+
video.value.play().catch((error) => {
|
|
1845
|
+
console.error("\u89C6\u9891\u64AD\u653E\u5931\u8D25:", error);
|
|
1846
|
+
videoError.value = "\u89C6\u9891\u64AD\u653E\u5931\u8D25";
|
|
1847
|
+
});
|
|
1848
|
+
}
|
|
1849
|
+
}
|
|
1850
|
+
function pause() {
|
|
1851
|
+
video.value?.pause();
|
|
1852
|
+
}
|
|
1853
|
+
function stop() {
|
|
1854
|
+
if (video.value) {
|
|
1855
|
+
video.value.pause();
|
|
1856
|
+
video.value.currentTime = 0;
|
|
1857
|
+
}
|
|
1858
|
+
emit("update:status", TickerStatus.stopped);
|
|
1859
|
+
}
|
|
1860
|
+
const __returned__ = { props, emit, compId, getAlias, sprite, resizeSprite, texture, video, readyDef, videoError, loadVideoTexture, setupVideoEvents, cleanupVideo, play, pause, stop };
|
|
1861
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1862
|
+
return __returned__;
|
|
1863
|
+
}
|
|
1864
|
+
});
|
|
1865
|
+
|
|
1866
|
+
function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1867
|
+
return renderSlot(_ctx.$slots, "default");
|
|
1868
|
+
}
|
|
1869
|
+
var VideoComp = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/video.vue"]]);
|
|
1870
|
+
|
|
1871
|
+
var _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
1872
|
+
__name: "view",
|
|
1873
|
+
props: {
|
|
1874
|
+
defaultOptions: {
|
|
1875
|
+
type: Object,
|
|
1876
|
+
default: () => ({})
|
|
1877
|
+
}
|
|
1878
|
+
},
|
|
1879
|
+
setup(__props, { expose: __expose }) {
|
|
1880
|
+
__expose();
|
|
1881
|
+
const props = __props;
|
|
1882
|
+
const { application: app, context } = usePixiApp();
|
|
1883
|
+
const appRef = ref();
|
|
1884
|
+
onMounted(async () => {
|
|
1885
|
+
await app.init({
|
|
1886
|
+
resizeTo: appRef.value,
|
|
1887
|
+
...props.defaultOptions
|
|
1888
|
+
});
|
|
1889
|
+
context.whenDef.resolve(app);
|
|
1890
|
+
appRef.value.appendChild(app.canvas);
|
|
1891
|
+
});
|
|
1892
|
+
const __returned__ = { props, app, context, appRef };
|
|
1893
|
+
Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
|
|
1894
|
+
return __returned__;
|
|
1895
|
+
}
|
|
1896
|
+
});
|
|
1897
|
+
|
|
1898
|
+
const _hoisted_1 = {
|
|
1899
|
+
ref: "appRef",
|
|
1900
|
+
class: "vk-pixi-frame"
|
|
1901
|
+
};
|
|
1902
|
+
function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1903
|
+
return openBlock(), createElementBlock(
|
|
1904
|
+
"div",
|
|
1905
|
+
_hoisted_1,
|
|
1906
|
+
null,
|
|
1907
|
+
512
|
|
1908
|
+
/* NEED_PATCH */
|
|
1909
|
+
);
|
|
1910
|
+
}
|
|
1911
|
+
var ViewComp = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/view.vue"]]);
|
|
1912
|
+
|
|
1913
|
+
var _sfc_main = defineComponent({
|
|
1914
|
+
name: "VkPixiFrame",
|
|
1915
|
+
components: {
|
|
1916
|
+
ApngComp,
|
|
1917
|
+
// CoreComp,
|
|
1918
|
+
ProviderComp,
|
|
1919
|
+
ViewComp,
|
|
1920
|
+
VideoComp,
|
|
1921
|
+
Bitmap
|
|
1922
|
+
},
|
|
1923
|
+
props,
|
|
1924
|
+
emits,
|
|
1925
|
+
setup(props2) {
|
|
1926
|
+
const isApng = computed(() => {
|
|
1927
|
+
if (!props2.url)
|
|
1928
|
+
return false;
|
|
1929
|
+
const url = props2.url.toLowerCase();
|
|
1930
|
+
return url.includes(".png") && !url.includes(".mp4") && !url.includes(".webm");
|
|
1931
|
+
});
|
|
1932
|
+
const isVideo = computed(() => {
|
|
1933
|
+
if (!props2.url)
|
|
1934
|
+
return false;
|
|
1935
|
+
const url = props2.url.toLowerCase();
|
|
1936
|
+
return url.includes(".mp4") || url.includes(".webm") || url.includes(".mov");
|
|
1937
|
+
});
|
|
1938
|
+
return {
|
|
1939
|
+
isApng,
|
|
1940
|
+
isVideo
|
|
1941
|
+
};
|
|
1942
|
+
}
|
|
1943
|
+
});
|
|
1944
|
+
|
|
1945
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1946
|
+
const _component_ViewComp = resolveComponent("ViewComp");
|
|
1947
|
+
const _component_ApngComp = resolveComponent("ApngComp");
|
|
1948
|
+
const _component_VideoComp = resolveComponent("VideoComp");
|
|
1949
|
+
const _component_Bitmap = resolveComponent("Bitmap");
|
|
1950
|
+
const _component_ProviderComp = resolveComponent("ProviderComp");
|
|
1951
|
+
return openBlock(), createBlock(_component_ProviderComp, null, {
|
|
1952
|
+
default: withCtx(() => [
|
|
1953
|
+
createVNode(_component_ViewComp),
|
|
1954
|
+
_ctx.isApng && _ctx.url ? (openBlock(), createBlock(_component_ApngComp, {
|
|
1955
|
+
key: 0,
|
|
1956
|
+
url: _ctx.url,
|
|
1957
|
+
loop: _ctx.loop,
|
|
1958
|
+
status: _ctx.status,
|
|
1959
|
+
"onUpdate:status": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:status", $event))
|
|
1960
|
+
}, null, 8, ["url", "loop", "status"])) : _ctx.isVideo && _ctx.url ? (openBlock(), createBlock(_component_VideoComp, {
|
|
1961
|
+
key: 1,
|
|
1962
|
+
url: _ctx.url,
|
|
1963
|
+
loop: _ctx.loop,
|
|
1964
|
+
status: _ctx.status,
|
|
1965
|
+
"onUpdate:status": _cache[1] || (_cache[1] = ($event) => _ctx.$emit("update:status", $event))
|
|
1966
|
+
}, null, 8, ["url", "loop", "status"])) : (openBlock(), createBlock(_component_Bitmap, {
|
|
1967
|
+
key: 2,
|
|
1968
|
+
data: _ctx.data,
|
|
1969
|
+
loop: _ctx.loop,
|
|
1970
|
+
status: _ctx.status,
|
|
1971
|
+
onSetData: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("setData", $event)),
|
|
1972
|
+
"onUpdate:status": _cache[3] || (_cache[3] = ($event) => _ctx.$emit("update:status", $event))
|
|
1973
|
+
}, null, 8, ["data", "loop", "status"]))
|
|
1974
|
+
]),
|
|
1975
|
+
_: 1
|
|
1976
|
+
/* STABLE */
|
|
1977
|
+
});
|
|
1978
|
+
}
|
|
1979
|
+
var VkPixiFrame = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/pixi-frame/src/index.vue"]]);
|
|
1980
|
+
|
|
1981
|
+
var types = /*#__PURE__*/Object.freeze({
|
|
1982
|
+
__proto__: null
|
|
1983
|
+
});
|
|
1984
|
+
|
|
1985
|
+
VkPixiFrame.install = (app) => {
|
|
1986
|
+
app.component(VkPixiFrame.name || "VkPixiFrame", VkPixiFrame);
|
|
1987
|
+
};
|
|
1988
|
+
|
|
1989
|
+
export { VkPixiFrame, ApngComp as VkPixiFrameApng, Bitmap as VkPixiFrameBitmap, bitmapGenerator as VkPixiFrameBitmapGenerator, core as VkPixiFrameCore, ProviderComp as VkPixiFrameProvider, VideoComp as VkPixiFrameVideo, ViewComp as VkPixiFrameView, types as __VkPixiFrame, VkPixiFrame as default, usePixiApp, useSprite };
|