@gamelearn/arcade-components 1.35.5 → 1.35.7-hotfix
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)
|
package/dist/components/conversational-pro-component/components/ConversationalProComponent.js
CHANGED
|
@@ -59,7 +59,7 @@ var characterMs = 75;
|
|
|
59
59
|
var minMs = 1400;
|
|
60
60
|
|
|
61
61
|
var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
62
|
-
var _background$img, _currentLineData$
|
|
62
|
+
var _background$img, _currentLineData$slot3, _currentMessage$text;
|
|
63
63
|
|
|
64
64
|
var emitEvent = _ref.emitEvent,
|
|
65
65
|
lines = _ref.lines,
|
|
@@ -110,21 +110,13 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
110
110
|
|
|
111
111
|
var backgroundImage = (background === null || background === void 0 ? void 0 : (_background$img = background.img) === null || _background$img === void 0 ? void 0 : _background$img.url) || null;
|
|
112
112
|
var currentLineData = lines[currentLine];
|
|
113
|
+
var voiceOver = currentLineData.voiceOver,
|
|
114
|
+
decision = currentLineData.decision;
|
|
113
115
|
var voiceOverSlots = [];
|
|
114
116
|
var isBranched = !!edges;
|
|
115
117
|
var isVoiceOver = voiceOver || currentLineData.type === 'conversationalNarration';
|
|
116
118
|
var isDecision = decision || currentLineData.type === 'conversationalDecision';
|
|
117
|
-
var voiceOver = currentLineData.voiceOver,
|
|
118
|
-
decision = currentLineData.decision;
|
|
119
119
|
var isFlex = currentLineData.flex;
|
|
120
|
-
var listProps = {
|
|
121
|
-
characters: currentCharacters,
|
|
122
|
-
lodSettings: lodSettings,
|
|
123
|
-
actors: actors,
|
|
124
|
-
currentMessage: currentMessage || {},
|
|
125
|
-
slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
|
|
126
|
-
flex: isFlex
|
|
127
|
-
};
|
|
128
120
|
|
|
129
121
|
var _useState13 = (0, _react.useState)([]),
|
|
130
122
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
@@ -146,15 +138,15 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
146
138
|
var previousLineWasDecision = (0, _react.useCallback)(function () {
|
|
147
139
|
if (isBranched) {
|
|
148
140
|
// if we have edges, we need to check if the previous line was a decision
|
|
149
|
-
var
|
|
150
|
-
return lastLine === null || lastLine === void 0 ? void 0 : lastLine.decision;
|
|
151
|
-
} else {
|
|
152
|
-
// if there is no branching, the previous line is the previous one
|
|
153
|
-
var _lastLine = lines[currentLine - 1] ? lines[currentLine - 1] : {};
|
|
141
|
+
var _lastLine = findLastLineBranched();
|
|
154
142
|
|
|
155
|
-
return
|
|
156
|
-
}
|
|
157
|
-
|
|
143
|
+
return _lastLine === null || _lastLine === void 0 ? void 0 : _lastLine.decision;
|
|
144
|
+
} // if there is no branching, the previous line is the previous one
|
|
145
|
+
|
|
146
|
+
|
|
147
|
+
var lastLine = lines[currentLine - 1] ? lines[currentLine - 1] : {};
|
|
148
|
+
return currentLine > 0 && (lastLine === null || lastLine === void 0 ? void 0 : lastLine.decision);
|
|
149
|
+
}, [isBranched, findLastLineBranched, lines, currentLine]);
|
|
158
150
|
var translate = (0, _react.useCallback)(function (id) {
|
|
159
151
|
return emitEvent({
|
|
160
152
|
type: 'translate',
|
|
@@ -162,11 +154,13 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
162
154
|
});
|
|
163
155
|
}, [emitEvent]);
|
|
164
156
|
var getCurrentMessage = (0, _react.useCallback)(function () {
|
|
157
|
+
var _currentLineData$slot, _currentLineData$slot2;
|
|
158
|
+
|
|
165
159
|
if (isVoiceOver) {
|
|
166
160
|
return currentLineData;
|
|
167
161
|
}
|
|
168
162
|
|
|
169
|
-
var currentMessage = currentLineData.slots.find(function (slot) {
|
|
163
|
+
var currentMessage = currentLineData === null || currentLineData === void 0 ? void 0 : (_currentLineData$slot = currentLineData.slots) === null || _currentLineData$slot === void 0 ? void 0 : _currentLineData$slot.find(function (slot) {
|
|
170
164
|
return slot.uid && slot.talking;
|
|
171
165
|
});
|
|
172
166
|
|
|
@@ -175,20 +169,29 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
175
169
|
} // Old conversational schema
|
|
176
170
|
|
|
177
171
|
|
|
178
|
-
return currentLineData.slots.find(function (slot) {
|
|
172
|
+
return currentLineData === null || currentLineData === void 0 ? void 0 : (_currentLineData$slot2 = currentLineData.slots) === null || _currentLineData$slot2 === void 0 ? void 0 : _currentLineData$slot2.find(function (slot) {
|
|
179
173
|
return slot.uid && slot.text;
|
|
180
174
|
});
|
|
181
175
|
}, [currentLineData, isVoiceOver]);
|
|
182
176
|
var currentMessage = (0, _react.useMemo)(function () {
|
|
183
177
|
return !isDecision ? getCurrentMessage() : {};
|
|
184
|
-
}, [getCurrentMessage, isDecision]);
|
|
178
|
+
}, [getCurrentMessage, isDecision]);
|
|
179
|
+
var listProps = {
|
|
180
|
+
characters: currentCharacters,
|
|
181
|
+
lodSettings: lodSettings,
|
|
182
|
+
actors: actors,
|
|
183
|
+
currentMessage: currentMessage || {},
|
|
184
|
+
slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
|
|
185
|
+
flex: isFlex
|
|
186
|
+
}; // Recupera la antigua linea de la conversacion para conservar los personajes en voice-over
|
|
185
187
|
|
|
186
188
|
var leftWithSlots = lines.slice(0, currentLine + 1).reverse().find(function (line) {
|
|
187
189
|
return line.slots;
|
|
188
190
|
});
|
|
189
|
-
var hasCharacters = !isDecision && ((_currentLineData$
|
|
191
|
+
var hasCharacters = !isDecision && ((_currentLineData$slot3 = currentLineData.slots) === null || _currentLineData$slot3 === void 0 ? void 0 : _currentLineData$slot3.filter(function (slot) {
|
|
190
192
|
return slot.uid;
|
|
191
193
|
}).length);
|
|
194
|
+
var autoPlayTime = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text = currentMessage.text) === null || _currentMessage$text === void 0 ? void 0 : _currentMessage$text.length) || 0);
|
|
192
195
|
var currentSlots = [];
|
|
193
196
|
|
|
194
197
|
if (currentLineData.slots) {
|
|
@@ -306,7 +309,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
306
309
|
} else {
|
|
307
310
|
finishConversation();
|
|
308
311
|
}
|
|
309
|
-
}, [currentLineData.id, edges, finishConversation, lines]);
|
|
312
|
+
}, [currentLineData.id, edges, edgesHistory, finishConversation, lastNodeId, lines]);
|
|
310
313
|
var handleClickNext = (0, _react.useCallback)(function (choice, reset) {
|
|
311
314
|
var isLast = false;
|
|
312
315
|
setTTsStart(false);
|
|
@@ -336,7 +339,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
336
339
|
if (!isLast) {
|
|
337
340
|
setStarted(true);
|
|
338
341
|
}
|
|
339
|
-
}, [currentLine, currentLineData.decision, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length, edgesHistory]);
|
|
342
|
+
}, [currentLine, currentLineData.decision, currentLineData.id, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length, edgesHistory]);
|
|
340
343
|
|
|
341
344
|
var handleClickBack = function handleClickBack() {
|
|
342
345
|
setStarted(false);
|
|
@@ -352,7 +355,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
352
355
|
setStarted(true);
|
|
353
356
|
};
|
|
354
357
|
|
|
355
|
-
var isEndNode = function
|
|
358
|
+
var isEndNode = (0, _react.useCallback)(function () {
|
|
356
359
|
if (isBranched) {
|
|
357
360
|
return currentLineData && currentLineData.type !== 'conversationalDecision' && !edges.find(function (edge) {
|
|
358
361
|
return edge.fromId === currentLineData.id;
|
|
@@ -360,7 +363,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
360
363
|
}
|
|
361
364
|
|
|
362
365
|
return currentLine === lines.length - 1;
|
|
363
|
-
};
|
|
366
|
+
}, [currentLine, currentLineData, edges, isBranched, lines.length]);
|
|
364
367
|
|
|
365
368
|
var manualClickNext = function manualClickNext() {
|
|
366
369
|
playSound('click-ui');
|
|
@@ -410,26 +413,32 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
410
413
|
(0, _react.useEffect)(function () {
|
|
411
414
|
var _currentMessage$emoti2;
|
|
412
415
|
|
|
413
|
-
|
|
416
|
+
var timeout;
|
|
417
|
+
|
|
418
|
+
if (((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed) && !(currentMessage !== null && currentMessage !== void 0 && (_currentMessage$emoti2 = currentMessage.emotion) !== null && _currentMessage$emoti2 !== void 0 && _currentMessage$emoti2.includes('think'))) {
|
|
414
419
|
setTTsStart(true);
|
|
420
|
+
timeout = setTimeout(function () {
|
|
421
|
+
setTTsStart(false);
|
|
422
|
+
}, autoPlayTime < minMs ? minMs : autoPlayTime);
|
|
415
423
|
}
|
|
416
|
-
|
|
424
|
+
|
|
425
|
+
return function () {
|
|
426
|
+
if (timeout) clearTimeout(timeout);
|
|
427
|
+
};
|
|
428
|
+
}, [audioFailed, currentLineData, currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.emotion, autoPlayTime]); // Autoplay logic
|
|
417
429
|
|
|
418
430
|
(0, _react.useEffect)(function () {
|
|
419
431
|
if (autoplayCond && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text = currentMessage.text) === null || _currentMessage$text === void 0 ? void 0 : _currentMessage$text.length) || 0); // if it's not last node
|
|
423
|
-
|
|
432
|
+
// if it's not last node
|
|
424
433
|
if (!isEndNode()) {
|
|
425
|
-
start(handleClickNext,
|
|
434
|
+
start(handleClickNext, autoPlayTime < minMs ? minMs : autoPlayTime);
|
|
426
435
|
}
|
|
427
436
|
}
|
|
428
437
|
|
|
429
438
|
return function () {
|
|
430
439
|
stop();
|
|
431
440
|
};
|
|
432
|
-
}, [currentMessage, start, stop, handleClickNext, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoplayCond, audioFailed, lines]); // Calculate start node
|
|
441
|
+
}, [currentMessage, start, stop, handleClickNext, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoplayCond, audioFailed, lines, isEndNode, autoPlayTime]); // Calculate start node
|
|
433
442
|
|
|
434
443
|
(0, _react.useEffect)(function () {
|
|
435
444
|
if (isBranched && !mounted) {
|
|
@@ -212,23 +212,22 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
212
212
|
var lastEdge = edges.find(function (edge) {
|
|
213
213
|
return edge.fromId === lastNodeId;
|
|
214
214
|
});
|
|
215
|
-
var
|
|
216
|
-
return
|
|
215
|
+
var lastL = lines.find(function (l) {
|
|
216
|
+
return l.id === lastEdge.fromId;
|
|
217
217
|
});
|
|
218
|
-
return
|
|
218
|
+
return lastL;
|
|
219
219
|
}, [edges, lines, lastNodeId]);
|
|
220
220
|
var previousLineWasDecision = (0, _react.useCallback)(function () {
|
|
221
221
|
if (isBranched) {
|
|
222
222
|
// if we have edges, we need to check if the previous line was a decision
|
|
223
|
-
var
|
|
223
|
+
var _lastL = findLastLineBranched();
|
|
224
224
|
|
|
225
|
-
return
|
|
226
|
-
}
|
|
227
|
-
// if there is no branching, the previous line is the previous one
|
|
228
|
-
var _lastLine2 = lines[currentLineData - 1] ? lines[currentLineData - 1] : {};
|
|
225
|
+
return _lastL === null || _lastL === void 0 ? void 0 : _lastL.decision;
|
|
226
|
+
} // if there is no branching, the previous line is the previous one
|
|
229
227
|
|
|
230
|
-
|
|
231
|
-
}
|
|
228
|
+
|
|
229
|
+
var lastL = lines[currentLineData - 1] ? lines[currentLineData - 1] : {};
|
|
230
|
+
return currentLineData > 0 && (lastL === null || lastL === void 0 ? void 0 : lastL.decision);
|
|
232
231
|
}, [currentLineData, isBranched, lines, lastNodeId, edges]);
|
|
233
232
|
var getCurrentVisible = (0, _react.useCallback)(function (uid) {
|
|
234
233
|
if (!uid) return null;
|
|
@@ -304,7 +303,12 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
304
303
|
|
|
305
304
|
var restTalkingAnimation = function restTalkingAnimation() {
|
|
306
305
|
var element = getCurrentVisible(talkingCharacter === null || talkingCharacter === void 0 ? void 0 : talkingCharacter.uid);
|
|
307
|
-
|
|
306
|
+
|
|
307
|
+
if (!element) {
|
|
308
|
+
startTalking(false);
|
|
309
|
+
return;
|
|
310
|
+
}
|
|
311
|
+
|
|
308
312
|
var _element$userData = element.userData,
|
|
309
313
|
mixer = _element$userData.mixer,
|
|
310
314
|
defaultAnim = _element$userData.defaultAnim,
|
|
@@ -575,10 +579,6 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
575
579
|
element.userData.defaultAnim = action.getClip();
|
|
576
580
|
}
|
|
577
581
|
|
|
578
|
-
if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && talkingCharacter.emotion !== 'thinkful') {
|
|
579
|
-
startTalking(true);
|
|
580
|
-
}
|
|
581
|
-
|
|
582
582
|
if (talkingCharacter.uid === element.uid) {
|
|
583
583
|
var showArrowTop = talkingCharacter.text.length > maxCharacterToSwitch;
|
|
584
584
|
moveBubble(element, showArrowTop);
|
|
@@ -661,13 +661,24 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
661
661
|
return function () {
|
|
662
662
|
stopEkho();
|
|
663
663
|
};
|
|
664
|
-
}, [line, stopEkho]);
|
|
664
|
+
}, [line, stopEkho]);
|
|
665
|
+
(0, _react.useEffect)(function () {
|
|
666
|
+
if (((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed) && currentMessage !== null && currentMessage !== void 0 && currentMessage.show && (talkingCharacter === null || talkingCharacter === void 0 ? void 0 : talkingCharacter.emotion) !== 'thinkful') {
|
|
667
|
+
var _currentMessage$text;
|
|
668
|
+
|
|
669
|
+
startTalking(true);
|
|
670
|
+
var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text = currentMessage.text) === null || _currentMessage$text === void 0 ? void 0 : _currentMessage$text.length) || 0);
|
|
671
|
+
setTimeout(function () {
|
|
672
|
+
startTalking(false);
|
|
673
|
+
}, time < minMs ? minMs : time);
|
|
674
|
+
}
|
|
675
|
+
}, [audioFailed, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, talkingCharacter === null || talkingCharacter === void 0 ? void 0 : talkingCharacter.emotion, currentMessage]); // Autoplay logic
|
|
665
676
|
|
|
666
677
|
(0, _react.useEffect)(function () {
|
|
667
678
|
if (autoPlayCond && currentMessage.show && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
|
|
668
|
-
var _currentMessage$
|
|
679
|
+
var _currentMessage$text2;
|
|
669
680
|
|
|
670
|
-
var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$
|
|
681
|
+
var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text2 = currentMessage.text) === null || _currentMessage$text2 === void 0 ? void 0 : _currentMessage$text2.length) || 0); // if it's not last node
|
|
671
682
|
|
|
672
683
|
if (!isEndNode()) {
|
|
673
684
|
start(nextLine, time < minMs ? minMs : time);
|
package/package.json
CHANGED
|
@@ -1,114 +1,114 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@gamelearn/arcade-components",
|
|
3
|
-
"author": "Gamelearn",
|
|
4
|
-
"license": "unlicense",
|
|
5
|
-
"version": "1.35.
|
|
6
|
-
"main": "dist/index.js",
|
|
7
|
-
"files": [
|
|
8
|
-
"dist",
|
|
9
|
-
"README.md"
|
|
10
|
-
],
|
|
11
|
-
"repository": {
|
|
12
|
-
"type": "git",
|
|
13
|
-
"url": "https://github.com/gamelearn/arcade-components"
|
|
14
|
-
},
|
|
15
|
-
"dependencies": {
|
|
16
|
-
"@babel/runtime": "^7.18.6",
|
|
17
|
-
"@gamelearn/arcade-styles": "0.15.8",
|
|
18
|
-
"@gamelearn/arcade-three-core": "1.17.1",
|
|
19
|
-
"@react-three/drei": "9.4.3",
|
|
20
|
-
"@react-three/fiber": "8.0.17",
|
|
21
|
-
"@testing-library/jest-dom": "^5.16.4",
|
|
22
|
-
"@testing-library/react": "^13.1.1",
|
|
23
|
-
"@testing-library/user-event": "13.5.0",
|
|
24
|
-
"global": "^4.4.0",
|
|
25
|
-
"gsap": "^3.10.1",
|
|
26
|
-
"hls.js": "0.12.4",
|
|
27
|
-
"html-react-parser": "^1.4.0",
|
|
28
|
-
"interactjs": "^1.10.11",
|
|
29
|
-
"konva": "^7.2.5",
|
|
30
|
-
"prop-types": "15.7.2",
|
|
31
|
-
"react-konva": "^18.1.0",
|
|
32
|
-
"react-konva-utils": "^0.3.0",
|
|
33
|
-
"react-pdf": "5.2.0",
|
|
34
|
-
"react-promise-suspense": "0.3.3",
|
|
35
|
-
"react-typist": "^2.0.5",
|
|
36
|
-
"three": "0.139.2",
|
|
37
|
-
"web-vitals": "0.2.4"
|
|
38
|
-
},
|
|
39
|
-
"scripts": {
|
|
40
|
-
"start": "npm run storybook",
|
|
41
|
-
"clean": "rimraf dist",
|
|
42
|
-
"watch": "npx nodemon -e js --ignore dist --exec \"yarn compile && yalc push --changed\"",
|
|
43
|
-
"compile": "npm run clean && cross-env NODE_ENV=production babel src -d dist --ignore src/**/*.stories.js,src/**/*.test.js,src/setupTests.js",
|
|
44
|
-
"test": "react-scripts test --watchAll=false",
|
|
45
|
-
"test:watch": "react-scripts test",
|
|
46
|
-
"eject": "react-scripts eject",
|
|
47
|
-
"storybook": "start-storybook -p 6006 -s public",
|
|
48
|
-
"build-storybook": "build-storybook -o build",
|
|
49
|
-
"generate": "plop",
|
|
50
|
-
"lint": "npx eslint src --ext js,json",
|
|
51
|
-
"lint:fix": "npx eslint src --ext js,json --fix",
|
|
52
|
-
"lint:quiet": "npx eslint src --ext js,json --quiet",
|
|
53
|
-
"publish-hotfix": "yarn compile && npm publish && npm run version-tag",
|
|
54
|
-
"version-tag": "P_VER=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$P_VER && git push origin v$P_VER"
|
|
55
|
-
},
|
|
56
|
-
"browserslist": {
|
|
57
|
-
"production": [
|
|
58
|
-
">0.2%",
|
|
59
|
-
"not dead",
|
|
60
|
-
"not op_mini all"
|
|
61
|
-
],
|
|
62
|
-
"development": [
|
|
63
|
-
"last 1 chrome version",
|
|
64
|
-
"last 1 firefox version",
|
|
65
|
-
"last 1 safari version"
|
|
66
|
-
]
|
|
67
|
-
},
|
|
68
|
-
"devDependencies": {
|
|
69
|
-
"@babel/cli": "7.12.10",
|
|
70
|
-
"@babel/eslint-parser": "^7.15.8",
|
|
71
|
-
"@babel/preset-env": "7.12.11",
|
|
72
|
-
"@babel/preset-react": "7.12.10",
|
|
73
|
-
"@gamelearn/version": "^1.3.1",
|
|
74
|
-
"@react-three/test-renderer": "6.0.6",
|
|
75
|
-
"@storybook/addon-actions": "6.1.11",
|
|
76
|
-
"@storybook/addon-essentials": "6.1.11",
|
|
77
|
-
"@storybook/addon-links": "6.1.11",
|
|
78
|
-
"@storybook/addons": "^6.3.8",
|
|
79
|
-
"@storybook/node-logger": "6.1.11",
|
|
80
|
-
"@storybook/preset-create-react-app": "3.1.5",
|
|
81
|
-
"@storybook/react": "6.1.11",
|
|
82
|
-
"@storybook/theming": "^6.3.8",
|
|
83
|
-
"babel-loader": "8.1.0",
|
|
84
|
-
"cross-env": "7.0.3",
|
|
85
|
-
"eslint-config-airbnb": "^18.2.1",
|
|
86
|
-
"eslint-config-prettier": "^8.3.0",
|
|
87
|
-
"eslint-plugin-json-format": "^2.0.1",
|
|
88
|
-
"eslint-plugin-prettier": "^4.0.0",
|
|
89
|
-
"husky": "4.3.0",
|
|
90
|
-
"nodemon": "^2.0.13",
|
|
91
|
-
"plop": "^2.7.4",
|
|
92
|
-
"prettier": "^2.5.0",
|
|
93
|
-
"react": "18.0.0",
|
|
94
|
-
"react-dom": "18.0.0",
|
|
95
|
-
"react-scripts": "4.0.1",
|
|
96
|
-
"rimraf": "3.0.2"
|
|
97
|
-
},
|
|
98
|
-
"jest": {
|
|
99
|
-
"transformIgnorePatterns": [
|
|
100
|
-
"node_modules/(?!(three)/)"
|
|
101
|
-
],
|
|
102
|
-
"moduleNameMapper": {
|
|
103
|
-
"^react-pdf$": "react-pdf/dist/umd/entry.jest",
|
|
104
|
-
"^react-konva-utils$": "react-pdf/dist/umd/entry.jest"
|
|
105
|
-
}
|
|
106
|
-
},
|
|
107
|
-
"husky": {
|
|
108
|
-
"hooks": {
|
|
109
|
-
"prepare-commit-msg": "bash node_modules/@gamelearn/version/scripts/update_version.sh -p hooks.config ${HUSKY_GIT_PARAMS}",
|
|
110
|
-
"post-commit": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config",
|
|
111
|
-
"post-merge": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config"
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@gamelearn/arcade-components",
|
|
3
|
+
"author": "Gamelearn",
|
|
4
|
+
"license": "unlicense",
|
|
5
|
+
"version": "1.35.7-hotfix",
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"files": [
|
|
8
|
+
"dist",
|
|
9
|
+
"README.md"
|
|
10
|
+
],
|
|
11
|
+
"repository": {
|
|
12
|
+
"type": "git",
|
|
13
|
+
"url": "https://github.com/gamelearn/arcade-components"
|
|
14
|
+
},
|
|
15
|
+
"dependencies": {
|
|
16
|
+
"@babel/runtime": "^7.18.6",
|
|
17
|
+
"@gamelearn/arcade-styles": "0.15.8",
|
|
18
|
+
"@gamelearn/arcade-three-core": "1.17.1",
|
|
19
|
+
"@react-three/drei": "9.4.3",
|
|
20
|
+
"@react-three/fiber": "8.0.17",
|
|
21
|
+
"@testing-library/jest-dom": "^5.16.4",
|
|
22
|
+
"@testing-library/react": "^13.1.1",
|
|
23
|
+
"@testing-library/user-event": "13.5.0",
|
|
24
|
+
"global": "^4.4.0",
|
|
25
|
+
"gsap": "^3.10.1",
|
|
26
|
+
"hls.js": "0.12.4",
|
|
27
|
+
"html-react-parser": "^1.4.0",
|
|
28
|
+
"interactjs": "^1.10.11",
|
|
29
|
+
"konva": "^7.2.5",
|
|
30
|
+
"prop-types": "15.7.2",
|
|
31
|
+
"react-konva": "^18.1.0",
|
|
32
|
+
"react-konva-utils": "^0.3.0",
|
|
33
|
+
"react-pdf": "5.2.0",
|
|
34
|
+
"react-promise-suspense": "0.3.3",
|
|
35
|
+
"react-typist": "^2.0.5",
|
|
36
|
+
"three": "0.139.2",
|
|
37
|
+
"web-vitals": "0.2.4"
|
|
38
|
+
},
|
|
39
|
+
"scripts": {
|
|
40
|
+
"start": "npm run storybook",
|
|
41
|
+
"clean": "rimraf dist",
|
|
42
|
+
"watch": "npx nodemon -e js --ignore dist --exec \"yarn compile && yalc push --changed\"",
|
|
43
|
+
"compile": "npm run clean && cross-env NODE_ENV=production babel src -d dist --ignore src/**/*.stories.js,src/**/*.test.js,src/setupTests.js",
|
|
44
|
+
"test": "react-scripts test --watchAll=false",
|
|
45
|
+
"test:watch": "react-scripts test",
|
|
46
|
+
"eject": "react-scripts eject",
|
|
47
|
+
"storybook": "start-storybook -p 6006 -s public",
|
|
48
|
+
"build-storybook": "build-storybook -o build",
|
|
49
|
+
"generate": "plop",
|
|
50
|
+
"lint": "npx eslint src --ext js,json",
|
|
51
|
+
"lint:fix": "npx eslint src --ext js,json --fix",
|
|
52
|
+
"lint:quiet": "npx eslint src --ext js,json --quiet",
|
|
53
|
+
"publish-hotfix": "yarn compile && npm publish && npm run version-tag",
|
|
54
|
+
"version-tag": "P_VER=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$P_VER && git push origin v$P_VER"
|
|
55
|
+
},
|
|
56
|
+
"browserslist": {
|
|
57
|
+
"production": [
|
|
58
|
+
">0.2%",
|
|
59
|
+
"not dead",
|
|
60
|
+
"not op_mini all"
|
|
61
|
+
],
|
|
62
|
+
"development": [
|
|
63
|
+
"last 1 chrome version",
|
|
64
|
+
"last 1 firefox version",
|
|
65
|
+
"last 1 safari version"
|
|
66
|
+
]
|
|
67
|
+
},
|
|
68
|
+
"devDependencies": {
|
|
69
|
+
"@babel/cli": "7.12.10",
|
|
70
|
+
"@babel/eslint-parser": "^7.15.8",
|
|
71
|
+
"@babel/preset-env": "7.12.11",
|
|
72
|
+
"@babel/preset-react": "7.12.10",
|
|
73
|
+
"@gamelearn/version": "^1.3.1",
|
|
74
|
+
"@react-three/test-renderer": "6.0.6",
|
|
75
|
+
"@storybook/addon-actions": "6.1.11",
|
|
76
|
+
"@storybook/addon-essentials": "6.1.11",
|
|
77
|
+
"@storybook/addon-links": "6.1.11",
|
|
78
|
+
"@storybook/addons": "^6.3.8",
|
|
79
|
+
"@storybook/node-logger": "6.1.11",
|
|
80
|
+
"@storybook/preset-create-react-app": "3.1.5",
|
|
81
|
+
"@storybook/react": "6.1.11",
|
|
82
|
+
"@storybook/theming": "^6.3.8",
|
|
83
|
+
"babel-loader": "8.1.0",
|
|
84
|
+
"cross-env": "7.0.3",
|
|
85
|
+
"eslint-config-airbnb": "^18.2.1",
|
|
86
|
+
"eslint-config-prettier": "^8.3.0",
|
|
87
|
+
"eslint-plugin-json-format": "^2.0.1",
|
|
88
|
+
"eslint-plugin-prettier": "^4.0.0",
|
|
89
|
+
"husky": "4.3.0",
|
|
90
|
+
"nodemon": "^2.0.13",
|
|
91
|
+
"plop": "^2.7.4",
|
|
92
|
+
"prettier": "^2.5.0",
|
|
93
|
+
"react": "18.0.0",
|
|
94
|
+
"react-dom": "18.0.0",
|
|
95
|
+
"react-scripts": "4.0.1",
|
|
96
|
+
"rimraf": "3.0.2"
|
|
97
|
+
},
|
|
98
|
+
"jest": {
|
|
99
|
+
"transformIgnorePatterns": [
|
|
100
|
+
"node_modules/(?!(three)/)"
|
|
101
|
+
],
|
|
102
|
+
"moduleNameMapper": {
|
|
103
|
+
"^react-pdf$": "react-pdf/dist/umd/entry.jest",
|
|
104
|
+
"^react-konva-utils$": "react-pdf/dist/umd/entry.jest"
|
|
105
|
+
}
|
|
106
|
+
},
|
|
107
|
+
"husky": {
|
|
108
|
+
"hooks": {
|
|
109
|
+
"prepare-commit-msg": "bash node_modules/@gamelearn/version/scripts/update_version.sh -p hooks.config ${HUSKY_GIT_PARAMS}",
|
|
110
|
+
"post-commit": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config",
|
|
111
|
+
"post-merge": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config"
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
}
|