@gamelearn/arcade-components 2.29.4-hotfix-animationsv2 → 2.29.4
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/README.md
CHANGED
|
@@ -1,107 +1,107 @@
|
|
|
1
|
-
# Arcade Components
|
|
2
|
-
> librería de componentes para Arcade (aka engine 2.0)
|
|
3
|
-
|
|
4
|
-
[](https://www.npmjs.com/package/arcade-components) [](https://standardjs.com)
|
|
5
|
-
|
|
6
|
-
## Install
|
|
7
|
-
|
|
8
|
-
```bash
|
|
9
|
-
yarn add @gamelearn/arcade-components
|
|
10
|
-
```
|
|
11
|
-
|
|
12
|
-
## Usage
|
|
13
|
-
##
|
|
14
|
-
|
|
15
|
-
```jsx
|
|
16
|
-
import React, { Component } from 'react';
|
|
17
|
-
|
|
18
|
-
import { Button } from 'arcade-components';
|
|
19
|
-
|
|
20
|
-
export default class App extends Component {
|
|
21
|
-
render() {
|
|
22
|
-
return (
|
|
23
|
-
<div>
|
|
24
|
-
<Button>Enjoy</Button>
|
|
25
|
-
</div>
|
|
26
|
-
);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
```
|
|
31
|
-
|
|
32
|
-
## Generar version hotfix para arcade/master-stg
|
|
33
|
-
|
|
34
|
-
Para generar una version hotfix nos vamos al commit que desplego la version que utiliza actualmente arcade/master-stg y creamos una rama sobre ella.
|
|
35
|
-
|
|
36
|
-
Generamos los cambios o hacemos cherrypick de ellos si ya estan creados y una vez terminemos con los cambios tendremos que cambiar la version del package.json a una tal que asi :
|
|
37
|
-
|
|
38
|
-
`"version": "1.3.5-fix-1",`
|
|
39
|
-
|
|
40
|
-
Habiendo cambiado ya la version para publicarla ejecutamos:
|
|
41
|
-
* `npm run publish-hotfix`
|
|
42
|
-
|
|
43
|
-
Una vez publicada en npm ir a la versión master de arcade y sustituir la versión de arcade-components.
|
|
44
|
-
|
|
45
|
-
## Available Scripts
|
|
46
|
-
|
|
47
|
-
Para ver Storybook en local
|
|
48
|
-
|
|
49
|
-
### `yarn start`
|
|
50
|
-
|
|
51
|
-
Para compilar la librería a dist
|
|
52
|
-
|
|
53
|
-
### `yarn compile`
|
|
54
|
-
|
|
55
|
-
Para dejar a babel observando cambios y ejecuntando auto-compilación puedes pasarle --watch
|
|
56
|
-
|
|
57
|
-
`yarn compile --watch`
|
|
58
|
-
|
|
59
|
-
### `yarn generate <componentName>`
|
|
60
|
-
|
|
61
|
-
Para añadir un componente nuevo se recomienda usar el generador automático que hara el scaffolding básico de dicho componente, coge el nombre como primer parámetro y si lo llamas sin parámetro te lo preguntará por el prompt.
|
|
62
|
-
|
|
63
|
-
`yarn generate`
|
|
64
|
-
|
|
65
|
-
## How to link arcade-components in other repos (WIP)
|
|
66
|
-
|
|
67
|
-
Para trabajar con arcade-components en local si necesidad de subir a git ni a npm no podemos trabajar con `yarn link` ya que da un error con los hooks de react.
|
|
68
|
-
|
|
69
|
-
Cómo solución alternativa podemos instalar `yalc` que permite publicar el paquete en local e importarlo desde `arcade`.
|
|
70
|
-
|
|
71
|
-
```bash
|
|
72
|
-
yarn global add yalc
|
|
73
|
-
```
|
|
74
|
-
Si teneis problemas instalándolo en global :
|
|
75
|
-
yarn global add yalc --prefix /usr/local
|
|
76
|
-
|
|
77
|
-
Para generar el paquete en el store local:
|
|
78
|
-
|
|
79
|
-
```bash
|
|
80
|
-
yarn
|
|
81
|
-
yarn compile
|
|
82
|
-
yalc publish o yarn yalc publish
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
Si queremos escuchar los cambios y que se vayan publicando en el store de yalc se puede hacer directamente con:
|
|
86
|
-
|
|
87
|
-
```bash
|
|
88
|
-
yarn watch
|
|
89
|
-
```
|
|
90
|
-
|
|
91
|
-
Después, en el repositorio de `arcade` tendremos que linkar el paquete generado de la siguiente forma:
|
|
92
|
-
|
|
93
|
-
```bash
|
|
94
|
-
yalc link @gamelearn/arcade-components
|
|
95
|
-
```
|
|
96
|
-
|
|
97
|
-
Y voilá, ya podremos trabajar con arcade y arcade-components en local sin publicar nada.
|
|
98
|
-
|
|
99
|
-
Una vez terminemos de trabajar con el paquete linkado en `arcade`, no nos olvidemos de borrar el link:
|
|
100
|
-
|
|
101
|
-
```bash
|
|
102
|
-
yalc remove --all
|
|
103
|
-
```
|
|
104
|
-
|
|
105
|
-
## License
|
|
106
|
-
|
|
107
|
-
UNLICENSED © [gamelearn](https://github.com/gamelearn)
|
|
1
|
+
# Arcade Components
|
|
2
|
+
> librería de componentes para Arcade (aka engine 2.0)
|
|
3
|
+
|
|
4
|
+
[](https://www.npmjs.com/package/arcade-components) [](https://standardjs.com)
|
|
5
|
+
|
|
6
|
+
## Install
|
|
7
|
+
|
|
8
|
+
```bash
|
|
9
|
+
yarn add @gamelearn/arcade-components
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
## Usage
|
|
13
|
+
##
|
|
14
|
+
|
|
15
|
+
```jsx
|
|
16
|
+
import React, { Component } from 'react';
|
|
17
|
+
|
|
18
|
+
import { Button } from 'arcade-components';
|
|
19
|
+
|
|
20
|
+
export default class App extends Component {
|
|
21
|
+
render() {
|
|
22
|
+
return (
|
|
23
|
+
<div>
|
|
24
|
+
<Button>Enjoy</Button>
|
|
25
|
+
</div>
|
|
26
|
+
);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
## Generar version hotfix para arcade/master-stg
|
|
33
|
+
|
|
34
|
+
Para generar una version hotfix nos vamos al commit que desplego la version que utiliza actualmente arcade/master-stg y creamos una rama sobre ella.
|
|
35
|
+
|
|
36
|
+
Generamos los cambios o hacemos cherrypick de ellos si ya estan creados y una vez terminemos con los cambios tendremos que cambiar la version del package.json a una tal que asi :
|
|
37
|
+
|
|
38
|
+
`"version": "1.3.5-fix-1",`
|
|
39
|
+
|
|
40
|
+
Habiendo cambiado ya la version para publicarla ejecutamos:
|
|
41
|
+
* `npm run publish-hotfix`
|
|
42
|
+
|
|
43
|
+
Una vez publicada en npm ir a la versión master de arcade y sustituir la versión de arcade-components.
|
|
44
|
+
|
|
45
|
+
## Available Scripts
|
|
46
|
+
|
|
47
|
+
Para ver Storybook en local
|
|
48
|
+
|
|
49
|
+
### `yarn start`
|
|
50
|
+
|
|
51
|
+
Para compilar la librería a dist
|
|
52
|
+
|
|
53
|
+
### `yarn compile`
|
|
54
|
+
|
|
55
|
+
Para dejar a babel observando cambios y ejecuntando auto-compilación puedes pasarle --watch
|
|
56
|
+
|
|
57
|
+
`yarn compile --watch`
|
|
58
|
+
|
|
59
|
+
### `yarn generate <componentName>`
|
|
60
|
+
|
|
61
|
+
Para añadir un componente nuevo se recomienda usar el generador automático que hara el scaffolding básico de dicho componente, coge el nombre como primer parámetro y si lo llamas sin parámetro te lo preguntará por el prompt.
|
|
62
|
+
|
|
63
|
+
`yarn generate`
|
|
64
|
+
|
|
65
|
+
## How to link arcade-components in other repos (WIP)
|
|
66
|
+
|
|
67
|
+
Para trabajar con arcade-components en local si necesidad de subir a git ni a npm no podemos trabajar con `yarn link` ya que da un error con los hooks de react.
|
|
68
|
+
|
|
69
|
+
Cómo solución alternativa podemos instalar `yalc` que permite publicar el paquete en local e importarlo desde `arcade`.
|
|
70
|
+
|
|
71
|
+
```bash
|
|
72
|
+
yarn global add yalc
|
|
73
|
+
```
|
|
74
|
+
Si teneis problemas instalándolo en global :
|
|
75
|
+
yarn global add yalc --prefix /usr/local
|
|
76
|
+
|
|
77
|
+
Para generar el paquete en el store local:
|
|
78
|
+
|
|
79
|
+
```bash
|
|
80
|
+
yarn
|
|
81
|
+
yarn compile
|
|
82
|
+
yalc publish o yarn yalc publish
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
Si queremos escuchar los cambios y que se vayan publicando en el store de yalc se puede hacer directamente con:
|
|
86
|
+
|
|
87
|
+
```bash
|
|
88
|
+
yarn watch
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
Después, en el repositorio de `arcade` tendremos que linkar el paquete generado de la siguiente forma:
|
|
92
|
+
|
|
93
|
+
```bash
|
|
94
|
+
yalc link @gamelearn/arcade-components
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
Y voilá, ya podremos trabajar con arcade y arcade-components en local sin publicar nada.
|
|
98
|
+
|
|
99
|
+
Una vez terminemos de trabajar con el paquete linkado en `arcade`, no nos olvidemos de borrar el link:
|
|
100
|
+
|
|
101
|
+
```bash
|
|
102
|
+
yalc remove --all
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
## License
|
|
106
|
+
|
|
107
|
+
UNLICENSED © [gamelearn](https://github.com/gamelearn)
|
|
@@ -195,7 +195,7 @@ var AutoEvaluation = function AutoEvaluation(_ref) {
|
|
|
195
195
|
setPhase('end');
|
|
196
196
|
play('click-ui');
|
|
197
197
|
},
|
|
198
|
-
className: "gat--btn gat--btn__primary auto-evaluation__button not-transition
|
|
198
|
+
className: "gat--btn gat--btn__primary auto-evaluation__button not-transition "
|
|
199
199
|
}, /*#__PURE__*/_react.default.createElement("span", null, translate('auto-evaluation.end'))) : /*#__PURE__*/_react.default.createElement("button", {
|
|
200
200
|
type: "button",
|
|
201
201
|
onClick: function onClick() {
|
|
@@ -273,25 +273,13 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
273
273
|
}, [zoomInActor]);
|
|
274
274
|
var startTalking = function startTalking() {
|
|
275
275
|
if (!(talkingCharacter !== null && talkingCharacter !== void 0 && talkingCharacter.emotion) || lastSet.current) return;
|
|
276
|
-
var emotion = talkingCharacter.emotion
|
|
277
|
-
|
|
278
|
-
var sceneElement = getCurrentVisible(uid);
|
|
279
|
-
if (sceneElement) {
|
|
280
|
-
var isSeated = sceneElement.isSeated;
|
|
281
|
-
var includesSeated = emotion.includes('seated');
|
|
282
|
-
startAnimation(uid, isSeated && !includesSeated ? "".concat(emotion, "-seated_talking") : "".concat(emotion, "_talking"));
|
|
283
|
-
}
|
|
276
|
+
var emotion = talkingCharacter.emotion;
|
|
277
|
+
startAnimation(talkingCharacter.uid, "".concat(emotion, "_talking"));
|
|
284
278
|
};
|
|
285
279
|
var resetTalkingAnimation = function resetTalkingAnimation() {
|
|
286
280
|
if (!(talkingCharacter !== null && talkingCharacter !== void 0 && talkingCharacter.uid) || lastSet.current) return;
|
|
287
|
-
var emotion = talkingCharacter.emotion
|
|
288
|
-
|
|
289
|
-
var sceneElement = getCurrentVisible(uid);
|
|
290
|
-
if (sceneElement) {
|
|
291
|
-
var isSeated = sceneElement.isSeated;
|
|
292
|
-
var includesSeated = emotion.includes('seated');
|
|
293
|
-
startAnimation(uid, isSeated && !includesSeated ? "".concat(emotion, "-seated") : emotion);
|
|
294
|
-
}
|
|
281
|
+
var emotion = talkingCharacter.emotion;
|
|
282
|
+
startAnimation(talkingCharacter.uid, emotion);
|
|
295
283
|
};
|
|
296
284
|
var finishConversation = (0, _react.useCallback)(function () {
|
|
297
285
|
lastSet.current = true;
|
|
@@ -381,7 +369,6 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
381
369
|
var backLine = (0, _react.useCallback)(function () {
|
|
382
370
|
lastTalking.current = _objectSpread({}, talkingCharacter);
|
|
383
371
|
setAudioFailed(false);
|
|
384
|
-
resetTalkingAnimation();
|
|
385
372
|
if (isBranched) {
|
|
386
373
|
handleBranchDirection(false);
|
|
387
374
|
} else if (!previousLineWasDecision()) {
|
|
@@ -402,7 +389,6 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
402
389
|
lastTalking.current = _objectSpread({}, talkingCharacter);
|
|
403
390
|
setEdgesHistory([].concat(_toConsumableArray(edgesHistory), [currentLineData.id]));
|
|
404
391
|
setAudioFailed(false);
|
|
405
|
-
resetTalkingAnimation();
|
|
406
392
|
if (isBranched) {
|
|
407
393
|
if (choice) {
|
|
408
394
|
handleDecisionBranch(choice, reset);
|
|
@@ -527,12 +513,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
527
513
|
|
|
528
514
|
// Check not talking elements emotion
|
|
529
515
|
slottedCharacters.forEach(function (c) {
|
|
530
|
-
|
|
531
|
-
if (sceneElement) {
|
|
532
|
-
var isSeated = sceneElement.isSeated;
|
|
533
|
-
var includesSeated = c.emotion.includes('seated');
|
|
534
|
-
startAnimation(c.uid, isSeated && !includesSeated ? "".concat(c.emotion, "-seated") : c.emotion);
|
|
535
|
-
}
|
|
516
|
+
startAnimation(c.uid, c.emotion);
|
|
536
517
|
});
|
|
537
518
|
var element = getCurrentVisible(talkingCharacter.uid);
|
|
538
519
|
var object = actors.find(function (a) {
|
|
@@ -541,15 +522,8 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
541
522
|
if (element && !lastSet.current) {
|
|
542
523
|
setTimeout(function () {
|
|
543
524
|
if (talkingCharacter.uid === element.uid) {
|
|
544
|
-
var _userData$active, _userData$active2;
|
|
545
525
|
moveBubble(element);
|
|
546
|
-
|
|
547
|
-
userData = element.userData;
|
|
548
|
-
var emotion = talkingCharacter.emotion;
|
|
549
|
-
var includesSeated = emotion.includes('seated');
|
|
550
|
-
if (!((_userData$active = userData.active) !== null && _userData$active !== void 0 && _userData$active.includes('talking')) && !((_userData$active2 = userData.active) !== null && _userData$active2 !== void 0 && _userData$active2.includes(emotion))) {
|
|
551
|
-
startAnimation(talkingCharacter.uid, isSeated && !includesSeated ? "".concat(emotion, "-seated") : emotion);
|
|
552
|
-
}
|
|
526
|
+
startAnimation(talkingCharacter.uid, talkingCharacter.emotion);
|
|
553
527
|
var setMessage = function setMessage() {
|
|
554
528
|
var _talkingCharacter$cha;
|
|
555
529
|
setCurrentMessage({
|
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.default = void 0;
|
|
8
7
|
var _react = require("react");
|
|
9
8
|
var _GLTFLoader = require("three/examples/jsm/loaders/GLTFLoader");
|
|
9
|
+
var _zustand = _interopRequireDefault(require("zustand"));
|
|
10
10
|
var _fiber = require("@react-three/fiber");
|
|
11
11
|
var _ = require(".");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
12
14
|
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) keys.push(key); return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
13
15
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
14
16
|
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
@@ -16,20 +18,35 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableTo
|
|
|
16
18
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
17
19
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
18
20
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
19
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
21
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
22
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
23
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
24
21
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
25
22
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
26
23
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
27
24
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
28
25
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
29
26
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
30
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
27
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
28
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
29
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
30
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
31
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
32
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /* eslint-disable no-restricted-syntax */
|
|
31
33
|
var loader = new _GLTFLoader.GLTFLoader();
|
|
34
|
+
var useAnimationFactory = (0, _zustand.default)(function (set) {
|
|
35
|
+
return {
|
|
36
|
+
active: {},
|
|
37
|
+
setActive: function setActive(uid, active) {
|
|
38
|
+
return set(function (s) {
|
|
39
|
+
return {
|
|
40
|
+
active: _objectSpread(_objectSpread({}, s.active), {}, _defineProperty({}, uid, active))
|
|
41
|
+
};
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
});
|
|
32
46
|
function useStateMachine(lines) {
|
|
47
|
+
var _useAnimationFactory = useAnimationFactory(),
|
|
48
|
+
active = _useAnimationFactory.active,
|
|
49
|
+
setActive = _useAnimationFactory.setActive;
|
|
33
50
|
var scene = (0, _fiber.useThree)(function (s) {
|
|
34
51
|
return s.scene;
|
|
35
52
|
});
|
|
@@ -53,20 +70,17 @@ function useStateMachine(lines) {
|
|
|
53
70
|
_step2;
|
|
54
71
|
try {
|
|
55
72
|
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
|
|
56
|
-
var _slot$
|
|
73
|
+
var _slot$character3;
|
|
57
74
|
var slot = _step2.value;
|
|
58
75
|
if (!slot.uid) continue;
|
|
59
|
-
var animations = (_slot$character = slot.character) === null || _slot$character === void 0 ? void 0 : _slot$character.resource.animations;
|
|
60
76
|
if (!urls[slot.uid]) {
|
|
61
|
-
|
|
77
|
+
var _slot$character;
|
|
78
|
+
urls[slot.uid] = _defineProperty({}, slot.emotion, (_slot$character = slot.character) === null || _slot$character === void 0 ? void 0 : _slot$character.resource.animations[slot.emotion].url);
|
|
62
79
|
} else {
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
if (!slot.emotion.includes('seated')) {
|
|
66
|
-
var _animations;
|
|
67
|
-
urls[slot.uid] = _objectSpread(_objectSpread({}, urls[slot.uid]), {}, _defineProperty({}, "".concat(slot.emotion, "-seated"), ((_animations = animations["".concat(slot.emotion, "-seated")]) === null || _animations === void 0 ? void 0 : _animations.url) || animations['idle-seated'].url));
|
|
80
|
+
var _slot$character2;
|
|
81
|
+
urls[slot.uid] = _objectSpread(_objectSpread({}, urls[slot.uid]), {}, _defineProperty({}, slot.emotion, (_slot$character2 = slot.character) === null || _slot$character2 === void 0 ? void 0 : _slot$character2.resource.animations[slot.emotion].url));
|
|
68
82
|
}
|
|
69
|
-
urls[slot.uid].talking = animations.talking.url;
|
|
83
|
+
urls[slot.uid].talking = (_slot$character3 = slot.character) === null || _slot$character3 === void 0 ? void 0 : _slot$character3.resource.animations.talking.url;
|
|
70
84
|
}
|
|
71
85
|
} catch (err) {
|
|
72
86
|
_iterator2.e(err);
|
|
@@ -81,37 +95,8 @@ function useStateMachine(lines) {
|
|
|
81
95
|
}
|
|
82
96
|
return urls;
|
|
83
97
|
}, [lines]);
|
|
84
|
-
var uids = (0, _react.useMemo)(function () {
|
|
85
|
-
var set = new Set();
|
|
86
|
-
var _iterator3 = _createForOfIteratorHelper(lines),
|
|
87
|
-
_step3;
|
|
88
|
-
try {
|
|
89
|
-
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
|
|
90
|
-
var line = _step3.value;
|
|
91
|
-
if (!line.slots) continue;
|
|
92
|
-
var _iterator4 = _createForOfIteratorHelper(line.slots),
|
|
93
|
-
_step4;
|
|
94
|
-
try {
|
|
95
|
-
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
|
|
96
|
-
var slot = _step4.value;
|
|
97
|
-
if (!slot.uid) continue;
|
|
98
|
-
set.add(slot.uid);
|
|
99
|
-
}
|
|
100
|
-
} catch (err) {
|
|
101
|
-
_iterator4.e(err);
|
|
102
|
-
} finally {
|
|
103
|
-
_iterator4.f();
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
} catch (err) {
|
|
107
|
-
_iterator3.e(err);
|
|
108
|
-
} finally {
|
|
109
|
-
_iterator3.f();
|
|
110
|
-
}
|
|
111
|
-
return Array.from(set);
|
|
112
|
-
}, [lines]);
|
|
113
98
|
var resetActives = function resetActives() {
|
|
114
|
-
|
|
99
|
+
Object.keys(active).forEach(function (uid) {
|
|
115
100
|
startAnimation(uid, 'idle');
|
|
116
101
|
});
|
|
117
102
|
};
|
|
@@ -137,20 +122,16 @@ function useStateMachine(lines) {
|
|
|
137
122
|
} else {
|
|
138
123
|
var _root$userData = root.userData,
|
|
139
124
|
mixer = _root$userData.mixer,
|
|
140
|
-
actionList = _root$userData.actionList
|
|
141
|
-
|
|
142
|
-
if (emotion ===
|
|
143
|
-
|
|
144
|
-
}
|
|
145
|
-
var startAction = actionList[active];
|
|
125
|
+
actionList = _root$userData.actionList;
|
|
126
|
+
var currentActive = active[uid];
|
|
127
|
+
if (emotion === currentActive) return;
|
|
128
|
+
var startAction = actionList[currentActive];
|
|
146
129
|
var endAction = actionList[emotion];
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
root.userData.active = emotion;
|
|
151
|
-
}
|
|
130
|
+
setActive(uid, emotion);
|
|
131
|
+
(0, _.resetActions)(mixer, startAction);
|
|
132
|
+
(0, _.executeCrossFade)(startAction, endAction);
|
|
152
133
|
}
|
|
153
|
-
}, [scene, loaded]);
|
|
134
|
+
}, [scene, loaded, active, setActive]);
|
|
154
135
|
var processAnimations = (0, _react.useCallback)( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
|
155
136
|
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
156
137
|
while (1) switch (_context4.prev = _context4.next) {
|
|
@@ -176,7 +157,7 @@ function useStateMachine(lines) {
|
|
|
176
157
|
if (!actionList.idle) {
|
|
177
158
|
defaultAction = mixer.existingAction(defaultAnim, root);
|
|
178
159
|
actionList.idle = defaultAction;
|
|
179
|
-
|
|
160
|
+
setActive(uid, 'idle');
|
|
180
161
|
}
|
|
181
162
|
loadEmotion = /*#__PURE__*/function () {
|
|
182
163
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(emotion) {
|
|
@@ -199,7 +180,6 @@ function useStateMachine(lines) {
|
|
|
199
180
|
if (emotion !== 'talking' && actionList.talking) {
|
|
200
181
|
clone = clip.clone();
|
|
201
182
|
clone.name = "".concat(emotion, "_talking");
|
|
202
|
-
actionList.talking.reset();
|
|
203
183
|
talkingClip = actionList.talking.getClip();
|
|
204
184
|
_action = (0, _.mixWithTalkingClip)(root, talkingClip, clone);
|
|
205
185
|
(0, _.activateAction)(_action, 0);
|
|
@@ -261,7 +241,7 @@ function useStateMachine(lines) {
|
|
|
261
241
|
return _context4.stop();
|
|
262
242
|
}
|
|
263
243
|
}, _callee4);
|
|
264
|
-
})), [data, scene]);
|
|
244
|
+
})), [data, scene, setActive]);
|
|
265
245
|
|
|
266
246
|
// Load emotions
|
|
267
247
|
(0, _react.useEffect)(function () {
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@gamelearn/arcade-components",
|
|
3
3
|
"author": "Gamelearn",
|
|
4
4
|
"license": "unlicense",
|
|
5
|
-
"version": "2.29.4
|
|
5
|
+
"version": "2.29.4",
|
|
6
6
|
"main": "dist/index.js",
|
|
7
7
|
"files": [
|
|
8
8
|
"dist",
|
|
@@ -35,7 +35,8 @@
|
|
|
35
35
|
"react-promise-suspense": "0.3.3",
|
|
36
36
|
"react-typist": "^2.0.5",
|
|
37
37
|
"three": "0.139.2",
|
|
38
|
-
"web-vitals": "0.2.4"
|
|
38
|
+
"web-vitals": "0.2.4",
|
|
39
|
+
"zustand": "4.3.8"
|
|
39
40
|
},
|
|
40
41
|
"scripts": {
|
|
41
42
|
"start": "npm run storybook",
|