@awayfl/awayfl-player 0.2.38 → 0.2.39

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.
Files changed (11) hide show
  1. package/bundle/awayfl-player.umd.js +1 -1
  2. package/bundle/awayfl-player.umd.js.gz +0 -0
  3. package/bundle/awayfl-player.umd.js.map +1 -1
  4. package/dist/index.js +1 -1
  5. package/index.ts +1 -1
  6. package/package.json +1 -1
  7. package/template/fonts.swf +0 -0
  8. package/template/game_template.html +85 -0
  9. package/template/index_template.html +90 -0
  10. package/template/loader.js +514 -0
  11. package/tsconfig.json +1 -1
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- console.debug("AwayFL-Player - 0.2.38");
1
+ console.debug("AwayFL-Player - 0.2.39");
2
2
  export { AVMPlayer } from "./lib/AVMPlayer";
3
3
  export { AVM1Player } from "./lib/AVM1Player";
4
4
  export { AVM2Player } from "./lib/AVM2Player";
package/index.ts CHANGED
@@ -1,4 +1,4 @@
1
- console.debug("AwayFL-Player - 0.2.38");
1
+ console.debug("AwayFL-Player - 0.2.39");
2
2
 
3
3
  export {AVMPlayer} from "./lib/AVMPlayer";
4
4
  export {AVM1Player} from "./lib/AVM1Player";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@awayfl/awayfl-player",
3
- "version": "0.2.38",
3
+ "version": "0.2.39",
4
4
  "description": "Flash Player emulator for executing SWF files (published for FP versions 6 and up) in javascript",
5
5
  "main": "bundle/awayfl-player.umd.js",
6
6
  "module": "dist/index.js",
package/template/fonts.swf ADDED
Binary file
package/template/game_template.html ADDED
@@ -0,0 +1,85 @@
1
+ <!DOCTYPE html>
2
+
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta http-equiv="content-type" content="text/html; charset=UTF8">
6
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
7
+ <meta name="apple-mobile-web-app-capable" content="yes">
8
+ <meta name="apple-mobile-web-app-status-bar-style" content="#382C2A">
9
+ <meta name="viewport"
10
+ content="height=device-height, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui" />
11
+ <title>INSERT_TITLE</title>
12
+
13
+ <script type="text/javascript" src="./js/loader.js"></script>
14
+ <style>
15
+ * {
16
+ margin: 0;
17
+ padding: 0;
18
+ }
19
+
20
+ canvas {
21
+ outline: none
22
+ }
23
+
24
+ html,
25
+ body,
26
+ #container {
27
+ margin: 0;
28
+ overflow: hidden;
29
+ width: 100%;
30
+ height: 100%;
31
+ background-color: white;
32
+ }
33
+
34
+ #splash {
35
+ position: absolute;
36
+ visibility: hidden;
37
+ z-index: 10;
38
+ }
39
+
40
+ #splash__image {
41
+ position: absolute;
42
+ background-size: contain;
43
+ background-position: center;
44
+ background-repeat: no-repeat;
45
+ background-image: url("INSERT_SPLASHSCREEN");
46
+ visibility: visible;
47
+ transition: all 0.5s;
48
+ z-index: 10;
49
+ }
50
+
51
+ #progress__root {
52
+ position: absolute;
53
+ }
54
+
55
+ #progress__line {
56
+ width: 0;
57
+ height: 100%;
58
+ transition: all 0.5s;
59
+ }
60
+ </style>
61
+ </head>
62
+
63
+ <body>
64
+ <div id="splash__image">
65
+ <div id="progress__root">
66
+ <div id="progress__line"></div>
67
+ </div>
68
+ </div>
69
+
70
+ <script>
71
+
72
+ window.addEventListener("load", () => {
73
+
74
+ INSERT_CODE
75
+
76
+ Loader.init(config);
77
+
78
+ Loader.runPlayer((fill) => { }, (instance) => { })
79
+
80
+ })
81
+
82
+ </script>
83
+ </body>
84
+
85
+ </html>
package/template/index_template.html ADDED
@@ -0,0 +1,90 @@
1
+ <!DOCTYPE html>
2
+ <!--[if lt IE 7 ]> <html lang="en" class="ie6" <% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>> <![endif]-->
3
+ <!--[if IE 7 ]> <html lang="en" class="ie7" <% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>> <![endif]-->
4
+ <!--[if IE 8 ]> <html lang="en" class="ie8" <% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>> <![endif]-->
5
+ <!--[if IE 9 ]> <html lang="en" class="ie9" <% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>> <![endif]-->
6
+ <!--[if (gt IE 9)|!(IE)]><!-->
7
+ <html lang="en" class="" <% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"
8
+ <% } %>>
9
+ <!--<![endif]-->
10
+
11
+ <head>
12
+ <meta charset="utf-8">
13
+ <title><%= htmlWebpackPlugin.options.title || 'Webpack App'%></title><% if (htmlWebpackPlugin.files.favicon) { %>
14
+ <link rel="shortcut icon" href="<%= htmlWebpackPlugin.files.favicon%>">
15
+ <% } if (htmlWebpackPlugin.options.mobile) { %>
16
+ <meta name="viewport" content="width=device-width, initial-scale=1">
17
+ <% } for (var css in htmlWebpackPlugin.files.css) { %>
18
+ <link href="<%= htmlWebpackPlugin.files.css[css] %>" rel="stylesheet">
19
+ <% } if (htmlWebpackPlugin.options.baseHref) { %>
20
+ <base href="<%= htmlWebpackPlugin.options.baseHref %>" /><% } %>
21
+ </head>
22
+
23
+ <body>
24
+ <style>
25
+ html {
26
+ height: 100%;
27
+ }
28
+
29
+ body {
30
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
31
+ font-size: 13px;
32
+ line-height: 1.5;
33
+ color: #666;
34
+ -webkit-background-size: cover;
35
+ -moz-background-size: cover;
36
+ -o-background-size: cover;
37
+ background-size: cover;
38
+ }
39
+
40
+ #examples {
41
+ padding: 0px 20px 20px 20px;
42
+ }
43
+
44
+ a {
45
+ color: #999;
46
+ text-decoration: none;
47
+ }
48
+
49
+ a:hover,
50
+ a:active,
51
+ a:focus {
52
+ text-decoration: none;
53
+ outline: none;
54
+ color: #d1382f;
55
+ }
56
+ </style>
57
+
58
+
59
+ <% if (htmlWebpackPlugin.options.unsupportedBrowser) { %>
60
+ <style>
61
+ .unsupported-browser {
62
+ display: none;
63
+ }
64
+ </style>
65
+ <div class="unsupported-browser">
66
+ Sorry, your browser is not supported. Please upgrade to
67
+ the latest version or switch your browser to use this site.
68
+ See <a href="http://outdatedbrowser.com/">outdatedbrowser.com</a>
69
+ for options.
70
+ </div>
71
+ <% } %>
72
+
73
+
74
+
75
+ <!-- EXAMPLES -->
76
+ <div id="examples">
77
+ <h1><%= htmlWebpackPlugin.options.title %></h1>
78
+ <% for (var game in htmlWebpackPlugin.options.games) { %>
79
+ <a href="<%= htmlWebpackPlugin.options.baseHref %><%= htmlWebpackPlugin.options.games[game].path %>"
80
+ class="" title="<%= htmlWebpackPlugin.options.games[game].name %>"><%= htmlWebpackPlugin.options.games[game].name %></br></a>
81
+ <% } %>
82
+ </div>
83
+
84
+
85
+
86
+
87
+
88
+ </body>
89
+
90
+ </html>
package/template/loader.js ADDED
@@ -0,0 +1,514 @@
1
+ const supportDecoderApi = ('DecompressionStream' in self);
2
+ const isSWC = (head) => (head[0] === 0x43 && head[1] === 0x57 && head[2] === 0x53);
3
+ const outputSize = (head) => new DataView(head.buffer).getUint32(4, true);
4
+
5
+ function Decoder(size, offset = 8) {
6
+ if(!supportDecoderApi) {
7
+ throw 'Your browser not support DecompressionStream =(';
8
+ }
9
+
10
+ const decoder = new self.DecompressionStream('deflate');
11
+ const decoderW = decoder.writable.getWriter();
12
+ const decoderR = decoder.readable.getReader();
13
+ const buffer = new Uint8Array(size);
14
+
15
+ let isRunned = false;
16
+ let isDone = false;
17
+
18
+ let donableCallback;
19
+
20
+ function run() {
21
+ decoderR.read().then(function next(state) {
22
+ const done = state.done;
23
+ const value = state.value;
24
+
25
+ if (value) {
26
+ buffer.set(value, offset);
27
+ //console.debug("[Loader] Decoded chunk:", offset);
28
+
29
+ offset += value.length;
30
+ }
31
+
32
+ if (done || offset >= size) {
33
+ isDone = true;
34
+
35
+ if(donableCallback) {
36
+ donableCallback();
37
+ }
38
+
39
+ console.debug("[Loader] Decoder closed:", offset);
40
+ return;
41
+ }
42
+
43
+ return decoderR.read().then(next);
44
+ });
45
+ }
46
+
47
+ return {
48
+ get buffer() {
49
+ return buffer;
50
+ },
51
+
52
+ write(buffer) {
53
+ decoderW.ready.then(()=>{
54
+ decoderW.write(buffer);
55
+
56
+ if(!isRunned) {
57
+ isRunned = true;
58
+ run();
59
+ }
60
+ });
61
+ },
62
+
63
+ readAll() {
64
+ if(isDone) {
65
+ return Promise.resolve(buffer);
66
+ }
67
+
68
+ return new Promise((res)=>{
69
+ donableCallback = () => {
70
+ res(buffer);
71
+ }
72
+ })
73
+ }
74
+ }
75
+ }
76
+
77
+ function Fetcher(url = '', progress = f => f) {
78
+ let total = 0;
79
+ let reader;
80
+ let chunks = [];
81
+
82
+ progress && progress(0);
83
+
84
+ return fetch(url)
85
+ .then((request) => {
86
+ total = +request.headers.get('Content-Length');
87
+ reader = request.body.getReader();
88
+
89
+ return reader.read();
90
+ })
91
+ .then( (data) => {
92
+ const firstChunk = data.value;
93
+
94
+ console.debug("[Loader] Header:", String.fromCharCode.apply(null,firstChunk.slice(0, 3).reverse()));
95
+
96
+ let loaded = 0;
97
+ let decoder;
98
+
99
+ if (supportDecoderApi && isSWC(firstChunk)) {
100
+ const totalDecodedSize = outputSize(firstChunk);
101
+ const swcHeader = firstChunk.slice(0, 8);
102
+
103
+ swcHeader[0] = 70; // SWC => SWF
104
+
105
+ console.debug("[Loader] SWC size:", outputSize(firstChunk));
106
+
107
+ decoder = Decoder(totalDecodedSize, 8);
108
+ decoder.buffer.set(swcHeader);
109
+
110
+ // push witout header
111
+ decoder.write(firstChunk.slice(8));
112
+
113
+ } else {
114
+ chunks.push(firstChunk);
115
+ }
116
+
117
+ loaded += firstChunk.length;
118
+
119
+ progress && progress( Math.min(1, loaded / total));
120
+
121
+ // update all other chunks reqursive while !done
122
+ return reader.read().then( function moveNext(state) {
123
+
124
+ if (state.done) {
125
+ if(!decoder) {
126
+ let buffer = new Uint8Array(loaded);
127
+ let offset = 0;
128
+
129
+ chunks.forEach((e) => {
130
+ buffer.set(e, offset);
131
+ offset += e.length;
132
+ });
133
+
134
+ return buffer;
135
+ }else {
136
+ return decoder.readAll();
137
+ }
138
+ }
139
+
140
+ const value = state.value;
141
+
142
+ loaded += value.length;
143
+ progress && progress( Math.min(1, loaded / total));
144
+
145
+ if (!decoder) {
146
+ chunks.push(value);
147
+ } else {
148
+ decoder.write(value);
149
+ }
150
+
151
+ return reader.read().then(moveNext);
152
+ });
153
+ })
154
+ }
155
+
156
+ var Loader = (function () {
157
+ function loadBinary(file, progressEvent = f => f) {
158
+ const isScript = file.path.indexOf(".js") > -1;
159
+
160
+ if (!isScript && supportDecoderApi ) {
161
+ return Fetcher(file.path, progressEvent)
162
+ .then((buffer)=>({
163
+ meta: file.meta || {},
164
+ name: file.name,
165
+ path: file.path,
166
+ resourceType: file.resourceType,
167
+ data: buffer.buffer,
168
+ type: "swf",
169
+ }));
170
+ }
171
+
172
+ const req = new XMLHttpRequest();
173
+
174
+ req.addEventListener("progress", e => {
175
+ const gzip = req.getAllResponseHeaders('content-encoding') === 'gzip';
176
+
177
+ // get from progress, then from request, and if not valid - from file
178
+ const total = e.total || (+req.getAllResponseHeaders('content-length')) || (file.size * (gzip ? 0.25 : 1));
179
+
180
+ if(!total) {
181
+ progressEvent(1);
182
+ return;
183
+ }
184
+
185
+ progressEvent(Math.min(1, e.loaded / total) );
186
+ });
187
+
188
+ req.open("GET", file.path, true);
189
+ req.responseType = isScript ? "text" : "arraybuffer";
190
+
191
+ return new Promise((res, rej) => {
192
+ req.addEventListener("error", rej);
193
+ req.addEventListener("load", () => {
194
+ progressEvent(1);
195
+
196
+ if (isScript) {
197
+ // unsafe
198
+ //eval(req.response);
199
+
200
+ const b = new Blob([req.response], { type: "text/javascript" });
201
+ // use blob
202
+ loadScript(URL.createObjectURL(b)).then(() => res(undefined));
203
+
204
+ return;
205
+ }
206
+ res({
207
+ meta: file.meta || {},
208
+ name: file.name,
209
+ path: file.path,
210
+ resourceType: file.resourceType,
211
+ data: req.response,
212
+ type: isScript ? "js" : "swf",
213
+ });
214
+ });
215
+
216
+ req.send();
217
+ });
218
+ }
219
+
220
+ function loadScript(file, progress) {
221
+ const head = document.querySelector("head");
222
+ const script = document.createElement("script");
223
+
224
+ return new Promise((res, rej) => {
225
+ Object.assign(script, {
226
+ type: "text/javascript",
227
+ async: true,
228
+ src: file.path || file,
229
+ onload: () => {
230
+ progress && progress(1);
231
+ res(script);
232
+ },
233
+ onerror: rej,
234
+ onreadystatechange: s => {
235
+ if (script.readyState == "complete") { }
236
+ },
237
+ });
238
+
239
+ head.appendChild(script);
240
+ });
241
+ }
242
+
243
+ function createReporter(callback, childs, weight) {
244
+ const reporter = {
245
+ callback: callback,
246
+ childs: childs ? childs.slice() : undefined,
247
+ value: 0,
248
+ weight: weight || 1,
249
+
250
+ get report() {
251
+ return function (v) {
252
+ if (!this.childs) {
253
+ this.value = v * this.weight;
254
+ } else {
255
+ let summ = 0;
256
+ let v = 0;
257
+
258
+ this.childs.forEach((e) => {
259
+ summ += e.weight || 1;
260
+ v += (e.value || 0);
261
+ });
262
+
263
+ this.value = v / summ;
264
+ }
265
+
266
+ this.callback && this.callback(this.value);
267
+ }.bind(this);
268
+ },
269
+ };
270
+
271
+ if (childs) {
272
+ childs.forEach(e => {
273
+ e.callback = reporter.report;
274
+ });
275
+ }
276
+
277
+ return reporter;
278
+ }
279
+
280
+ function runLoadingProcess(jsFiles, binaryFiles, progressEvent = f => f, _debugScripts) {
281
+ const jsCount = jsFiles.length;
282
+ const binCount = binaryFiles.length;
283
+
284
+ const all = jsFiles.concat(binaryFiles);
285
+
286
+ const reporters = Array.from({ length: jsCount + binCount }, () => createReporter());
287
+ createReporter(progressEvent, reporters);
288
+
289
+ let pendings;
290
+
291
+ if (!_debugScripts) {
292
+ pendings = all.map((e, i) => loadBinary(e, reporters[i].report));
293
+ } else {
294
+ pendings = binaryFiles.map((e, i) => loadBinary(e, reporters[i].report))
295
+ pendings = pendings.concat(jsFiles.map((e, i) => loadScript(e, reporters[i + binCount].report)))
296
+ }
297
+
298
+ return Promise.all(pendings).then(data => {
299
+ return data.filter(e => e && e.type === 'swf');
300
+ });
301
+ }
302
+
303
+ let fillLine = undefined;
304
+ let __config = undefined;
305
+ let __splash = undefined;
306
+ let __pr__root = undefined;
307
+ let handleResize = undefined;
308
+
309
+ window["setStageDimensions"]=function(x, y, w, h){
310
+ __config.x=x;
311
+ __config.y=y;
312
+ __config.w=w;
313
+ __config.h=h;
314
+ if(window["AVMPlayer"]){
315
+ window["AVMPlayer"].setStageDimensions(x, y, w, h);
316
+ }
317
+ if(handleResize){
318
+ handleResize();
319
+ }
320
+ }
321
+
322
+ function runPlayer(progressEvent = f => f, completeEvent = f => f) {
323
+
324
+ if (!__config) {
325
+ init();
326
+ }
327
+
328
+ let jss = Array.isArray(__config.runtime) ? jss : [__config.runtime];
329
+ jss = jss.map(e => ({ path: e.path || e, size: e.size || 0 }));
330
+
331
+ const bins = __config.binary;
332
+
333
+ const loadReporter = createReporter(null, null, 4);
334
+ const avmReporter = createReporter((f) => {
335
+ console.log('AVM Load', f);
336
+ }, null, __config.progressParserWeigth ? __config.progressParserWeigth : 0.001);
337
+
338
+ createReporter(function (fill) {
339
+ fillLine(fill);
340
+ // rereport
341
+ progressEvent(fill);
342
+ }, [loadReporter, avmReporter])
343
+
344
+ const complete = f => {
345
+ // rereport
346
+ completeEvent(f);
347
+
348
+ if (__config.start) {
349
+
350
+ // start image exists.
351
+ // hide progressbar, show startimage and wait for user-input to start the game
352
+
353
+ Object.assign(__pr__root.style, {
354
+ visibility: "hidden",
355
+ opacity: 0,
356
+ });
357
+ Object.assign(__splash.style, {
358
+ backgroundImage: `url(${__config.start})`,
359
+ });
360
+ let onCLick = (e) => {
361
+ window.removeEventListener("click", onCLick);
362
+ Object.assign(__splash.style, {
363
+ visibility: "hidden",
364
+ opacity: 0,
365
+ });
366
+ if (!f)
367
+ throw ("AVMPlayer did not send a callback for starting game");
368
+ f();
369
+ window.setTimeout(()=>{
370
+ window.removeEventListener("resize", handleResize);
371
+ handleResize=null;
372
+ }, 500)
373
+ };
374
+ window.addEventListener("click", onCLick);
375
+ }
376
+ else {
377
+ // no start image.
378
+ // game will be started automatically
379
+ Object.assign(__splash.style, {
380
+ visibility: "hidden",
381
+ opacity: 0,
382
+ });
383
+ // use Timeout, so css transition can complete first
384
+ window.setTimeout(()=>{
385
+ window.removeEventListener("resize", handleResize);
386
+ handleResize=null;
387
+ }, 500)
388
+ }
389
+ };
390
+
391
+ runLoadingProcess(jss, bins, loadReporter.report, __config.debug).then(data => {
392
+ const AVMPlayerClass = window["AVMPlayerClass"];
393
+ if (!AVMPlayerClass) {
394
+ throw "Could not find a 'AVMPlayerClass' definition";
395
+ }
396
+
397
+ __config.files = data;
398
+
399
+ const avmPlayer = new AVMPlayerClass(__config);
400
+
401
+ avmPlayer.addEventListener('loaderComplete', (event) => {
402
+ if (!__config.start) {
403
+ complete();
404
+ avmPlayer.play(__config.skipFramesOfScene);
405
+ return;
406
+ }
407
+ complete(() => avmPlayer.play(__config.skipFramesOfScene));
408
+ });
409
+
410
+ avmPlayer.load();
411
+
412
+
413
+ window["AVMPlayer"] = avmPlayer
414
+ // now awayfl player is available at window["AVMPlayer"]
415
+ // can be used to update the stageDimensions:
416
+ // window["AVMPlayer"].setStageDimensions(x, y, w, h);
417
+ // values can be
418
+ // numbers (absolute pixel values)
419
+ // strings (percentage of window.innerHeight/innerWidth in 0-100)
420
+ });
421
+ }
422
+
423
+ function init(config) {
424
+ if (!config) {
425
+ throw new Error("Config is required");
426
+ }
427
+
428
+ __config = config;
429
+
430
+ const splash = document.querySelector("#splash__image");
431
+ const pr__root = document.querySelector("#progress__root");
432
+ const pr__line = document.querySelector("#progress__line");
433
+
434
+ __splash = splash;
435
+ __pr__root = pr__root;
436
+
437
+ const pr_conf = config.progress;
438
+ pr_conf.rect = pr_conf.rect || [0, 0.9, 1, 0.2];
439
+
440
+ Object.assign(splash.style, {
441
+ backgroundImage: `url(${config.splash})`,
442
+ visibility: "visible",
443
+ });
444
+
445
+ Object.assign(pr__root.style, {
446
+ background: pr_conf.back,
447
+ left: `${100 * pr_conf.rect[0]}%`,
448
+ top: `${100 * pr_conf.rect[1]}%`,
449
+ width: `${100 * pr_conf.rect[2]}%`,
450
+ height: `${100 * pr_conf.rect[3]}%`,
451
+ });
452
+
453
+ Object.assign(pr__line.style, {
454
+ background: pr_conf.line,
455
+ });
456
+
457
+ fillLine = fill => {
458
+ switch (pr_conf.direction) {
459
+ case "tb": {
460
+ Object.assign(pr__line.style, {
461
+ height: `${fill * 100}%`,
462
+ width: "100%",
463
+ });
464
+ break;
465
+ }
466
+ case "lr":
467
+ default: {
468
+ Object.assign(pr__line.style, {
469
+ height: "100%",
470
+ width: `${fill * 100}%`,
471
+ });
472
+ }
473
+ }
474
+ };
475
+
476
+ handleResize = () => {
477
+ let x=(typeof config.x==="string")?parseFloat(config.x.replace("%", ""))/100*window.innerWidth:config.x;
478
+ let y=(typeof config.y==="string")?parseFloat(config.y.replace("%", ""))/100*window.innerHeight:config.y;
479
+ let w=(typeof config.w==="string")?parseFloat(config.w.replace("%", ""))/100*window.innerWidth:config.w;
480
+ let h=(typeof config.h==="string")?parseFloat(config.h.replace("%", ""))/100*window.innerHeight:config.h;
481
+
482
+ if(!x) x=0;
483
+ if(!y) y=0;
484
+ if(!w) w=window.innerWidth;
485
+ if(!h) h=window.innerHeight;
486
+
487
+ if (config.stageScaleMode == "noBorder") {
488
+
489
+ }
490
+ const minMax = (config.stageScaleMode == "noBorder")
491
+ ? Math.max(h / config.height, w / config.width)
492
+ : Math.min(h / config.height, w / config.width);
493
+ const rw = Math.ceil(config.width * minMax);
494
+ const rh = Math.ceil(config.height * minMax);
495
+ const rx = x+(w - rw) / 2;
496
+ const ry = y+(h - rh) / 2;
497
+
498
+ Object.assign(splash.style, {
499
+ width: `${rw}px`,
500
+ height: `${rh}px`,
501
+ left: `${rx}px`,
502
+ top: `${ry}px`,
503
+ });
504
+ };
505
+
506
+ window.addEventListener("resize", handleResize);
507
+ handleResize();
508
+ }
509
+
510
+ return {
511
+ init,
512
+ runPlayer,
513
+ };
514
+ })();