@eva/plugin-a11y 2.0.0-beta.1 → 2.0.0-beta.3

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.
@@ -20,31 +20,6 @@ MERCHANTABLITY OR NON-INFRINGEMENT.
20
20
  See the Apache Version 2.0 License for specific language governing permissions
21
21
  and limitations under the License.
22
22
  ***************************************************************************** */
23
- /* global Reflect, Promise */
24
-
25
- var extendStatics = function(d, b) {
26
- extendStatics = Object.setPrototypeOf ||
27
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
28
- function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
29
- return extendStatics(d, b);
30
- };
31
-
32
- function __extends(d, b) {
33
- extendStatics(d, b);
34
- function __() { this.constructor = d; }
35
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
36
- }
37
-
38
- var __assign = function() {
39
- __assign = Object.assign || function __assign(t) {
40
- for (var s, i = 1, n = arguments.length; i < n; i++) {
41
- s = arguments[i];
42
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
43
- }
44
- return t;
45
- };
46
- return __assign.apply(this, arguments);
47
- };
48
23
 
49
24
  function __decorate(decorators, target, key, desc) {
50
25
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -60,117 +35,74 @@ function __awaiter(thisArg, _arguments, P, generator) {
60
35
  function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
61
36
  step((generator = generator.apply(thisArg, _arguments || [])).next());
62
37
  });
63
- }
64
-
65
- function __generator(thisArg, body) {
66
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
67
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
68
- function verb(n) { return function (v) { return step([n, v]); }; }
69
- function step(op) {
70
- if (f) throw new TypeError("Generator is already executing.");
71
- while (_) try {
72
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
73
- if (y = 0, t) op = [op[0] & 2, t.value];
74
- switch (op[0]) {
75
- case 0: case 1: t = op; break;
76
- case 4: _.label++; return { value: op[1], done: false };
77
- case 5: _.label++; y = op[1]; op = [0]; continue;
78
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
79
- default:
80
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
81
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
82
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
83
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
84
- if (t[2]) _.ops.pop();
85
- _.trys.pop(); continue;
86
- }
87
- op = body.call(thisArg, _);
88
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
89
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
90
- }
91
- }
92
-
93
- function __values(o) {
94
- var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
95
- if (m) return m.call(o);
96
- return {
97
- next: function () {
98
- if (o && i >= o.length) o = void 0;
99
- return { value: o && o[i++], done: !o };
100
- }
101
- };
102
38
  }
103
39
 
104
40
  function uuid(len) {
105
- var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
106
- var uuid = [];
107
- var radix = chars.length;
108
- for (var i = 0; i < len; i++)
41
+ let chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
42
+ let uuid = [];
43
+ let radix = chars.length;
44
+ for (let i = 0; i < len; i++)
109
45
  uuid[i] = chars[0 | (Math.random() * radix)];
110
46
  return uuid.join('');
111
47
  }
112
- var setStyle = function (element, style) {
113
- var width = style.width, height = style.height, position = style.position, _a = style.left, left = _a === void 0 ? 0 : _a, _b = style.top, top = _b === void 0 ? 0 : _b, zIndex = style.zIndex, pointerEvents = style.pointerEvents, background = style.background;
114
- element.style.width = width + "px";
115
- element.style.height = height + "px";
48
+ const setStyle = (element, style) => {
49
+ const { width, height, position, left = 0, top = 0, zIndex, pointerEvents, background } = style;
50
+ element.style.width = `${width}px`;
51
+ element.style.height = `${height}px`;
116
52
  element.style.position = position;
117
- element.style.left = "" + left;
118
- element.style.top = "" + top;
119
- element.style.zIndex = "" + zIndex;
53
+ element.style.left = `${left}`;
54
+ element.style.top = `${top}`;
55
+ element.style.zIndex = `${zIndex}`;
120
56
  element.style.pointerEvents = pointerEvents;
121
57
  element.style.background = background;
122
58
  element.style.border = 'none';
123
59
  element.style.overflow = 'hidden';
124
60
  };
125
- var setTransform = function (element, transform, ratioX, ratioY) {
126
- var worldTransform = transform.worldTransform;
127
- var a = worldTransform.a, b = worldTransform.b, c = worldTransform.c, d = worldTransform.d, tx = worldTransform.tx, ty = worldTransform.ty;
128
- var matrix = "matrix(" + a + ", " + b + ", " + c + ", " + d + ", " + tx * ratioX + ", " + ty * ratioY + ")";
129
- element.style.transform = "" + matrix;
130
- element.style.webkitTransform = "" + matrix;
61
+ const setTransform = (element, transform, ratioX, ratioY) => {
62
+ const { worldTransform } = transform;
63
+ const { a, b, c, d, tx, ty } = worldTransform;
64
+ const matrix = `matrix(${a}, ${b}, ${c}, ${d}, ${tx * ratioX}, ${ty * ratioY})`;
65
+ element.style.transform = `${matrix}`;
66
+ element.style.webkitTransform = `${matrix}`;
131
67
  element.style.transformOrigin = 'left top';
132
68
  element.style.webkitTransformOrigin = 'left top';
133
69
  };
134
70
 
135
- var A11y = (function (_super) {
136
- __extends(A11y, _super);
137
- function A11y(param) {
138
- var _this = _super.call(this) || this;
139
- Object.assign(_this, param);
140
- var _a = param.hint, hint = _a === void 0 ? '' : _a, event = param.event, _b = param.delay, delay = _b === void 0 ? 0 : _b, _c = param.attr, attr = _c === void 0 ? {} : _c, _d = param.role, role = _d === void 0 ? '' : _d, _e = param.props, props = _e === void 0 ? {} : _e, _f = param.state, state = _f === void 0 ? {} : _f;
141
- _this.hint = hint;
142
- _this.event = event;
143
- _this.delay = delay;
144
- _this.attr = attr;
145
- _this.role = role;
146
- _this.props = props;
147
- _this.state = state;
148
- _this.a11yId = "_" + uuid(6);
149
- return _this;
71
+ class A11y extends eva_js.Component {
72
+ constructor(param) {
73
+ super();
74
+ Object.assign(this, param);
75
+ const { hint = '', event, delay = 0, attr = {}, role = '', props = {}, state = {} } = param;
76
+ this.hint = hint;
77
+ this.event = event;
78
+ this.delay = delay;
79
+ this.attr = attr;
80
+ this.role = role;
81
+ this.props = props;
82
+ this.state = state;
83
+ this.a11yId = `_${uuid(6)}`;
150
84
  }
151
- A11y.componentName = 'A11y';
152
- __decorate([
153
- inspectorDecorator.type('boolean')
154
- ], A11y.prototype, "interactive", void 0);
155
- __decorate([
156
- inspectorDecorator.type('string')
157
- ], A11y.prototype, "hint", void 0);
158
- __decorate([
159
- inspectorDecorator.type('number'),
160
- inspectorDecorator.step(1)
161
- ], A11y.prototype, "delay", void 0);
162
- __decorate([
163
- inspectorDecorator.type('string')
164
- ], A11y.prototype, "role", void 0);
165
- __decorate([
166
- inspectorDecorator.type('string')
167
- ], A11y.prototype, "a11yId", void 0);
168
- return A11y;
169
- }(eva_js.Component));
170
- var A11y$1 = A11y;
85
+ }
86
+ A11y.componentName = 'A11y';
87
+ __decorate([
88
+ inspectorDecorator.type('boolean')
89
+ ], A11y.prototype, "interactive", void 0);
90
+ __decorate([
91
+ inspectorDecorator.type('string')
92
+ ], A11y.prototype, "hint", void 0);
93
+ __decorate([
94
+ inspectorDecorator.type('number'),
95
+ inspectorDecorator.step(1)
96
+ ], A11y.prototype, "delay", void 0);
97
+ __decorate([
98
+ inspectorDecorator.type('string')
99
+ ], A11y.prototype, "role", void 0);
100
+ __decorate([
101
+ inspectorDecorator.type('string')
102
+ ], A11y.prototype, "a11yId", void 0);
171
103
 
172
- var POSITION = 'absolute';
173
- var ZINDEX = 3;
104
+ const POSITION = 'absolute';
105
+ const ZINDEX = 3;
174
106
  exports.A11yActivate = void 0;
175
107
  (function (A11yActivate) {
176
108
  A11yActivate[A11yActivate["ENABLE"] = 0] = "ENABLE";
@@ -193,119 +125,90 @@ var ElementType;
193
125
  ElementType["DIV"] = "div";
194
126
  })(ElementType || (ElementType = {}));
195
127
 
196
- var notAttr = ['hint', 'event', 'delay', 'attr', 'role', 'props', 'state', 'a11yId', 'name'];
197
- var getEventFunc = function (event, gameObject, e) {
198
- var _this = this;
199
- ['touchstart', 'touchend', 'tap'].forEach(function (name) {
128
+ const notAttr = ['hint', 'event', 'delay', 'attr', 'role', 'props', 'state', 'a11yId', 'name'];
129
+ const getEventFunc = function (event, gameObject, e) {
130
+ ['touchstart', 'touchend', 'tap'].forEach(name => {
200
131
  event.emit(name, {
201
- stopPropagation: function () { return e.stopPropagation(); },
132
+ stopPropagation: () => e.stopPropagation(),
202
133
  data: {
203
- position: _this.eventPosition,
134
+ position: this.eventPosition,
204
135
  },
205
- gameObject: gameObject,
136
+ gameObject,
206
137
  });
207
138
  });
208
139
  };
209
- var A11ySystem = (function (_super) {
210
- __extends(A11ySystem, _super);
211
- function A11ySystem(opt) {
212
- var _this = _super.call(this, opt) || this;
213
- _this.cache = new Map();
214
- _this.eventCache = new Map();
215
- _this.zIndex = ZINDEX;
216
- return _this;
140
+ let A11ySystem = class A11ySystem extends eva_js.System {
141
+ constructor(opt) {
142
+ super(opt);
143
+ this.cache = new Map();
144
+ this.eventCache = new Map();
145
+ this.zIndex = ZINDEX;
217
146
  }
218
- Object.defineProperty(A11ySystem.prototype, "ratioX", {
219
- get: function () {
220
- if (this._ratioX) {
147
+ get ratioX() {
148
+ if (this._ratioX) {
149
+ return this._ratioX;
150
+ }
151
+ else {
152
+ const success = this.setRatio();
153
+ if (success) {
221
154
  return this._ratioX;
222
155
  }
223
156
  else {
224
- var success = this.setRatio();
225
- if (success) {
226
- return this._ratioX;
227
- }
228
- else {
229
- return 0;
230
- }
157
+ return 0;
231
158
  }
232
- },
233
- enumerable: false,
234
- configurable: true
235
- });
236
- Object.defineProperty(A11ySystem.prototype, "ratioY", {
237
- get: function () {
238
- if (this._ratioY) {
159
+ }
160
+ }
161
+ get ratioY() {
162
+ if (this._ratioY) {
163
+ return this._ratioY;
164
+ }
165
+ else {
166
+ const success = this.setRatio();
167
+ if (success) {
239
168
  return this._ratioY;
240
169
  }
241
170
  else {
242
- var success = this.setRatio();
243
- if (success) {
244
- return this._ratioY;
245
- }
246
- else {
247
- return 0;
248
- }
171
+ return 0;
249
172
  }
250
- },
251
- enumerable: false,
252
- configurable: true
253
- });
254
- A11ySystem.prototype.init = function (opt) {
255
- if (opt === void 0) { opt = {}; }
256
- return __awaiter(this, void 0, void 0, function () {
257
- var _a, activate, _b, delay, _c, checkA11yOpen, zIndex, _d, _e, div;
258
- return __generator(this, function (_f) {
259
- switch (_f.label) {
260
- case 0:
261
- _a = opt.activate, activate = _a === void 0 ? exports.A11yActivate.CHECK : _a, _b = opt.delay, delay = _b === void 0 ? 100 : _b, _c = opt.checkA11yOpen, checkA11yOpen = _c === void 0 ? function () { return Promise.resolve(false); } : _c, zIndex = opt.zIndex;
262
- this.delay = delay;
263
- this.zIndex = zIndex || this.zIndex;
264
- _d = activate;
265
- switch (_d) {
266
- case exports.A11yActivate.CHECK: return [3, 1];
267
- case exports.A11yActivate.DISABLE: return [3, 5];
268
- case exports.A11yActivate.ENABLE: return [3, 6];
269
- }
270
- return [3, 7];
271
- case 1:
272
- _f.trys.push([1, 3, , 4]);
273
- _e = this;
274
- return [4, checkA11yOpen()];
275
- case 2:
276
- _e.activate = _f.sent();
277
- return [3, 4];
278
- case 3:
279
- _f.sent();
280
- this.activate = false;
281
- return [3, 4];
282
- case 4: return [3, 7];
283
- case 5:
173
+ }
174
+ }
175
+ init(opt = {}) {
176
+ return __awaiter(this, void 0, void 0, function* () {
177
+ const { activate = exports.A11yActivate.CHECK, delay = 100, checkA11yOpen = () => Promise.resolve(false), zIndex } = opt;
178
+ this.delay = delay;
179
+ this.zIndex = zIndex || this.zIndex;
180
+ switch (activate) {
181
+ case exports.A11yActivate.CHECK:
182
+ try {
183
+ this.activate = yield checkA11yOpen();
184
+ }
185
+ catch (error) {
284
186
  this.activate = false;
285
- return [3, 7];
286
- case 6:
287
- this.activate = true;
288
- return [3, 7];
289
- case 7:
290
- this.debug = opt.debug || false;
291
- if (this.debug) {
292
- this.activate = true;
293
- }
294
- if (!this.activate)
295
- return [2];
296
- div = document.createElement('div');
297
- this.div = div;
298
- if (this.game.canvas.parentNode) {
299
- this.game.canvas.parentNode.insertBefore(this.div, this.game.canvas);
300
- }
301
- return [2];
302
- }
303
- });
187
+ }
188
+ break;
189
+ case exports.A11yActivate.DISABLE:
190
+ this.activate = false;
191
+ break;
192
+ case exports.A11yActivate.ENABLE:
193
+ this.activate = true;
194
+ break;
195
+ }
196
+ this.debug = opt.debug || false;
197
+ if (this.debug) {
198
+ this.activate = true;
199
+ }
200
+ if (!this.activate)
201
+ return;
202
+ const div = document.createElement('div');
203
+ this.div = div;
204
+ if (this.game.canvas.parentNode) {
205
+ this.game.canvas.parentNode.insertBefore(this.div, this.game.canvas);
206
+ }
304
207
  });
305
- };
306
- A11ySystem.prototype.setRatio = function () {
307
- var _a = this.getCanvasBoundingClientRect(), width = _a.width, height = _a.height;
308
- var _b = this.getRenderRect(), renderWidth = _b.renderWidth, renderHeight = _b.renderHeight;
208
+ }
209
+ setRatio() {
210
+ const { width, height } = this.getCanvasBoundingClientRect();
211
+ const { renderWidth, renderHeight } = this.getRenderRect();
309
212
  this._ratioX = width / renderWidth;
310
213
  this._ratioY = height / renderHeight;
311
214
  if (width || height) {
@@ -315,226 +218,178 @@ var A11ySystem = (function (_super) {
315
218
  else {
316
219
  return false;
317
220
  }
318
- };
319
- A11ySystem.prototype.getRenderRect = function () {
320
- var _a = this.game.getSystem(pluginRenderer.RendererSystem).params, params = _a === void 0 ? { width: 300, height: 300 } : _a;
321
- var renderHeight = params.height, renderWidth = params.width;
322
- return { renderWidth: renderWidth, renderHeight: renderHeight };
323
- };
324
- A11ySystem.prototype.getCanvasBoundingClientRect = function () {
325
- var _a = this.game.canvas.getBoundingClientRect(), width = _a.width, height = _a.height, left = _a.left, top = _a.top;
326
- return { width: width, height: height, left: left, top: top };
327
- };
328
- A11ySystem.prototype.initDiv = function () {
329
- var _this = this;
330
- var pageXOffset = window.pageXOffset, pageYOffset = window.pageYOffset;
331
- var _a = this.getCanvasBoundingClientRect(), width = _a.width, height = _a.height, left = _a.left, top = _a.top;
332
- var style = {
333
- width: width,
334
- height: height,
335
- left: left + pageXOffset + "px",
336
- top: top + pageYOffset + "px",
221
+ }
222
+ getRenderRect() {
223
+ const { params = { width: 300, height: 300 } } = this.game.getSystem(pluginRenderer.RendererSystem);
224
+ const { height: renderHeight, width: renderWidth } = params;
225
+ return { renderWidth, renderHeight };
226
+ }
227
+ getCanvasBoundingClientRect() {
228
+ const { width, height, left, top } = this.game.canvas.getBoundingClientRect();
229
+ return { width, height, left, top };
230
+ }
231
+ initDiv() {
232
+ const { pageXOffset, pageYOffset } = window;
233
+ const { width, height, left, top } = this.getCanvasBoundingClientRect();
234
+ const style = {
235
+ width,
236
+ height,
237
+ left: `${left + pageXOffset}px`,
238
+ top: `${top + pageYOffset}px`,
337
239
  position: POSITION,
338
240
  zIndex: this.zIndex,
339
241
  pointerEvents: PointerEvents.NONE,
340
242
  background: MaskBackground.NONE,
341
243
  };
342
244
  setStyle(this.div, style);
343
- this.div.addEventListener('click', function (e) {
344
- var currentTarget = e.currentTarget;
345
- var _a = currentTarget.getBoundingClientRect(), left = _a.left, top = _a.top;
346
- var x = (e.pageX - left) / _this.ratioX;
347
- var y = (e.pageY - top) / _this.ratioY;
348
- _this.eventPosition = { x: x, y: y };
245
+ this.div.addEventListener('click', e => {
246
+ const currentTarget = e.currentTarget;
247
+ const { left, top } = currentTarget.getBoundingClientRect();
248
+ const x = (e.pageX - left) / this.ratioX;
249
+ const y = (e.pageY - top) / this.ratioY;
250
+ this.eventPosition = { x, y };
349
251
  }, true);
350
- };
351
- A11ySystem.prototype.update = function () {
352
- return __awaiter(this, void 0, void 0, function () {
353
- var changes, changes_1, changes_1_1, changed;
354
- var e_1, _a;
355
- return __generator(this, function (_b) {
356
- changes = this.componentObserver.clear();
357
- if (!this.activate) {
358
- return [2];
359
- }
360
- try {
361
- for (changes_1 = __values(changes), changes_1_1 = changes_1.next(); !changes_1_1.done; changes_1_1 = changes_1.next()) {
362
- changed = changes_1_1.value;
363
- switch (changed.type) {
364
- case eva_js.OBSERVER_TYPE.ADD:
365
- changed.componentName === 'Event' && this.addEvent(changed.gameObject);
366
- changed.componentName === 'A11y' && this.add(changed);
367
- break;
368
- case eva_js.OBSERVER_TYPE.CHANGE:
369
- changed.componentName === 'Transform' && this.transformChange(changed);
370
- changed.componentName === 'A11y' && this.change(changed);
371
- break;
372
- case eva_js.OBSERVER_TYPE.REMOVE:
373
- changed.componentName === 'Event' && this.removeEvent(changed);
374
- changed.componentName === 'A11y' && this.remove(changed);
375
- }
376
- }
377
- }
378
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
379
- finally {
380
- try {
381
- if (changes_1_1 && !changes_1_1.done && (_a = changes_1.return)) _a.call(changes_1);
382
- }
383
- finally { if (e_1) throw e_1.error; }
252
+ }
253
+ update() {
254
+ return __awaiter(this, void 0, void 0, function* () {
255
+ const changes = this.componentObserver.clear();
256
+ if (!this.activate) {
257
+ return;
258
+ }
259
+ for (const changed of changes) {
260
+ switch (changed.type) {
261
+ case eva_js.OBSERVER_TYPE.ADD:
262
+ changed.componentName === 'Event' && this.addEvent(changed.gameObject);
263
+ changed.componentName === 'A11y' && this.add(changed);
264
+ break;
265
+ case eva_js.OBSERVER_TYPE.CHANGE:
266
+ changed.componentName === 'Transform' && this.transformChange(changed);
267
+ changed.componentName === 'A11y' && this.change(changed);
268
+ break;
269
+ case eva_js.OBSERVER_TYPE.REMOVE:
270
+ changed.componentName === 'Event' && this.removeEvent(changed);
271
+ changed.componentName === 'A11y' && this.remove(changed);
384
272
  }
385
- return [2];
386
- });
273
+ }
387
274
  });
388
- };
389
- A11ySystem.prototype.change = function (changed) {
390
- var component = changed.component;
275
+ }
276
+ change(changed) {
277
+ const component = changed.component;
391
278
  if (changed.prop.prop[0] === 'hint') {
392
- var dom = this.cache.get(component.a11yId);
279
+ const dom = this.cache.get(component.a11yId);
393
280
  dom === null || dom === void 0 ? void 0 : dom.setAttribute('aria-label', component.hint);
394
281
  dom && this.setPosition(dom, changed.gameObject.transform);
395
282
  }
396
- };
397
- A11ySystem.prototype.remove = function (changed) {
398
- var component = changed.component;
283
+ }
284
+ remove(changed) {
285
+ const component = changed.component;
399
286
  if (!component)
400
287
  return;
401
- var a11yId = component.a11yId;
402
- var element = this.div.querySelector("#" + a11yId);
288
+ const { a11yId } = component;
289
+ const element = this.div.querySelector(`#${a11yId}`);
403
290
  element && this.div.removeChild(element);
404
291
  this.cache.delete(a11yId);
405
- };
406
- A11ySystem.prototype.add = function (changed) {
407
- var _this = this;
292
+ }
293
+ add(changed) {
408
294
  if (!this.activate)
409
295
  return;
410
- var component = changed.component;
411
- var gameObject = changed.gameObject;
412
- var delay = component.delay, id = component.a11yId;
413
- var event = component.event;
296
+ const component = changed.component;
297
+ const { gameObject } = changed;
298
+ const { delay, a11yId: id } = component;
299
+ let { event } = component;
414
300
  if (!gameObject)
415
301
  return;
416
- var transform = gameObject.transform;
302
+ const { transform } = gameObject;
417
303
  if (!transform)
418
304
  return;
419
- var element = document.createElement('div');
305
+ const element = document.createElement('div');
420
306
  this.cache.set(id, element);
421
307
  if (!event) {
422
308
  event = gameObject.getComponent('Event');
423
309
  }
424
- setTimeout(function () {
425
- _this.setPosition(element, transform);
426
- _this.setA11yAttr(element, component);
310
+ setTimeout(() => {
311
+ this.setPosition(element, transform);
312
+ this.setA11yAttr(element, component);
427
313
  if (event) {
428
- _this.addEvent(gameObject);
314
+ this.addEvent(gameObject);
429
315
  }
430
316
  if (gameObject.scene) {
431
- _this.div.appendChild(element);
317
+ this.div.appendChild(element);
432
318
  }
433
319
  }, delay || this.delay);
434
- };
435
- A11ySystem.prototype.transformChange = function (changed) {
436
- var component = changed.component;
437
- var gameObject = changed.gameObject;
438
- var a11yComponent = gameObject.getComponent(A11y$1);
320
+ }
321
+ transformChange(changed) {
322
+ const component = changed.component;
323
+ const { gameObject } = changed;
324
+ const a11yComponent = gameObject.getComponent(A11y);
439
325
  if (!a11yComponent)
440
326
  return;
441
- var a11yId = a11yComponent.a11yId;
327
+ const { a11yId } = a11yComponent;
442
328
  if (!component.inScene) {
443
- var dom = this.div.querySelector("#" + a11yId);
329
+ const dom = this.div.querySelector(`#${a11yId}`);
444
330
  dom && this.div.removeChild(dom);
445
331
  }
446
332
  else {
447
333
  if (this.cache.has(a11yId)) {
448
- var addDom = this.cache.get(a11yId);
334
+ const addDom = this.cache.get(a11yId);
449
335
  addDom && this.div.appendChild(addDom);
450
336
  }
451
337
  }
452
- };
453
- A11ySystem.prototype.setEvent = function (element, event, gameObject, id) {
338
+ }
339
+ setEvent(element, event, gameObject, id) {
454
340
  if (!event) {
455
341
  return;
456
342
  }
457
- var func = getEventFunc.bind(this, event, gameObject);
343
+ const func = getEventFunc.bind(this, event, gameObject);
458
344
  this.eventCache.set(id, func);
459
345
  element.addEventListener('click', func);
460
- };
461
- A11ySystem.prototype.addEvent = function (gameObject) {
462
- var a11y = gameObject.getComponent(A11y$1);
346
+ }
347
+ addEvent(gameObject) {
348
+ const a11y = gameObject.getComponent(A11y);
463
349
  if (!a11y)
464
350
  return;
465
- var event = gameObject.getComponent('Event');
351
+ const event = gameObject.getComponent('Event');
466
352
  if (!event)
467
353
  return;
468
- var element = this.cache.get(a11y.a11yId);
354
+ const element = this.cache.get(a11y.a11yId);
469
355
  element && this.setEvent(element, event, gameObject, a11y.a11yId);
470
- };
471
- A11ySystem.prototype.removeEvent = function (changed) {
472
- var gameObject = changed.gameObject;
473
- var a11y = gameObject.getComponent(A11y$1);
356
+ }
357
+ removeEvent(changed) {
358
+ const { gameObject } = changed;
359
+ const a11y = gameObject.getComponent(A11y);
474
360
  if (!a11y)
475
361
  return;
476
- var event = changed.component;
362
+ const event = changed.component;
477
363
  if (!event)
478
364
  return;
479
- var a11yId = a11y.a11yId;
480
- var func = this.eventCache.get(a11yId);
481
- var element = this.cache.get(a11yId);
365
+ const { a11yId } = a11y;
366
+ const func = this.eventCache.get(a11yId);
367
+ const element = this.cache.get(a11yId);
482
368
  element && element.removeEventListener('click', func);
483
- };
484
- A11ySystem.prototype.setA11yAttr = function (element, component) {
485
- var e_2, _a, e_3, _b, e_4, _c;
486
- var hint = component.hint, _d = component.props, props = _d === void 0 ? {} : _d, _e = component.state, state = _e === void 0 ? {} : _e, role = component.role, id = component.a11yId;
487
- var realRole = role || 'text';
369
+ }
370
+ setA11yAttr(element, component) {
371
+ const { hint, props = {}, state = {}, role, a11yId: id } = component;
372
+ const realRole = role || 'text';
488
373
  element.setAttribute('role', realRole);
489
374
  element.setAttribute('aria-label', hint);
490
375
  element.id = id;
491
- var ariaProps = Object.keys(props);
492
- try {
493
- for (var ariaProps_1 = __values(ariaProps), ariaProps_1_1 = ariaProps_1.next(); !ariaProps_1_1.done; ariaProps_1_1 = ariaProps_1.next()) {
494
- var key = ariaProps_1_1.value;
495
- element.setAttribute(key, props[key]);
496
- }
376
+ const ariaProps = Object.keys(props);
377
+ for (const key of ariaProps) {
378
+ element.setAttribute(key, props[key]);
497
379
  }
498
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
499
- finally {
500
- try {
501
- if (ariaProps_1_1 && !ariaProps_1_1.done && (_a = ariaProps_1.return)) _a.call(ariaProps_1);
502
- }
503
- finally { if (e_2) throw e_2.error; }
504
- }
505
- var ariaState = Object.keys(state);
506
- try {
507
- for (var ariaState_1 = __values(ariaState), ariaState_1_1 = ariaState_1.next(); !ariaState_1_1.done; ariaState_1_1 = ariaState_1.next()) {
508
- var key = ariaState_1_1.value;
509
- element.setAttribute(key, state[key]);
510
- }
380
+ const ariaState = Object.keys(state);
381
+ for (const key of ariaState) {
382
+ element.setAttribute(key, state[key]);
511
383
  }
512
- catch (e_3_1) { e_3 = { error: e_3_1 }; }
513
- finally {
514
- try {
515
- if (ariaState_1_1 && !ariaState_1_1.done && (_b = ariaState_1.return)) _b.call(ariaState_1);
384
+ for (const key of Object.keys(component)) {
385
+ if (typeof component[key] === 'string' && notAttr.indexOf(key) === -1 && key.indexOf('_') !== 1) {
386
+ element.setAttribute(key, component[key]);
516
387
  }
517
- finally { if (e_3) throw e_3.error; }
518
388
  }
519
- try {
520
- for (var _f = __values(Object.keys(component)), _g = _f.next(); !_g.done; _g = _f.next()) {
521
- var key = _g.value;
522
- if (typeof component[key] === 'string' && notAttr.indexOf(key) === -1 && key.indexOf('_') !== 1) {
523
- element.setAttribute(key, component[key]);
524
- }
525
- }
526
- }
527
- catch (e_4_1) { e_4 = { error: e_4_1 }; }
528
- finally {
529
- try {
530
- if (_g && !_g.done && (_c = _f.return)) _c.call(_f);
531
- }
532
- finally { if (e_4) throw e_4.error; }
533
- }
534
- };
535
- A11ySystem.prototype.setPosition = function (element, transform) {
536
- var _a = transform.size, width = _a.width, height = _a.height;
537
- var style = {
389
+ }
390
+ setPosition(element, transform) {
391
+ const { width, height } = transform.size;
392
+ const style = {
538
393
  width: width === 0 ? 1 : width * this.ratioX,
539
394
  height: height === 0 ? 1 : height * this.ratioY,
540
395
  position: POSITION,
@@ -542,27 +397,26 @@ var A11ySystem = (function (_super) {
542
397
  pointerEvents: PointerEvents.AUTO,
543
398
  background: this.debug ? MaskBackground.DEBUG : MaskBackground.NONE,
544
399
  };
545
- var transformProps = __assign({}, transform);
400
+ const transformProps = Object.assign({}, transform);
546
401
  setStyle(element, style);
547
402
  setTransform(element, transformProps, this.ratioX, this.ratioY);
548
- };
549
- A11ySystem.prototype.onDestroy = function () {
403
+ }
404
+ onDestroy() {
550
405
  this.div.parentElement.removeChild(this.div);
551
406
  this.cache = null;
552
407
  this.eventCache = null;
553
408
  this.div = null;
554
- };
555
- A11ySystem.systemName = 'A11ySystem';
556
- A11ySystem = __decorate([
557
- eva_js.decorators.componentObserver({
558
- A11y: ['hint'],
559
- Transform: ['inScene'],
560
- Event: [],
561
- })
562
- ], A11ySystem);
563
- return A11ySystem;
564
- }(eva_js.System));
409
+ }
410
+ };
411
+ A11ySystem.systemName = 'A11ySystem';
412
+ A11ySystem = __decorate([
413
+ eva_js.decorators.componentObserver({
414
+ A11y: ['hint'],
415
+ Transform: ['inScene'],
416
+ Event: [],
417
+ })
418
+ ], A11ySystem);
565
419
  var A11ySystem$1 = A11ySystem;
566
420
 
567
- exports.A11y = A11y$1;
421
+ exports.A11y = A11y;
568
422
  exports.A11ySystem = A11ySystem$1;