@gamelearn/arcade-components 1.35.3 → 1.35.5
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/dist/components/conversational-pro-component/components/ConversationalProComponent.js
CHANGED
|
@@ -35,6 +35,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
35
35
|
|
|
36
36
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
37
37
|
|
|
38
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
39
|
+
|
|
40
|
+
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."); }
|
|
41
|
+
|
|
42
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
43
|
+
|
|
44
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
45
|
+
|
|
38
46
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
39
47
|
|
|
40
48
|
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."); }
|
|
@@ -103,18 +111,50 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
103
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;
|
|
104
112
|
var currentLineData = lines[currentLine];
|
|
105
113
|
var voiceOverSlots = [];
|
|
114
|
+
var isBranched = !!edges;
|
|
115
|
+
var isVoiceOver = voiceOver || currentLineData.type === 'conversationalNarration';
|
|
116
|
+
var isDecision = decision || currentLineData.type === 'conversationalDecision';
|
|
106
117
|
var voiceOver = currentLineData.voiceOver,
|
|
107
118
|
decision = currentLineData.decision;
|
|
108
|
-
var
|
|
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
|
+
};
|
|
109
128
|
|
|
110
|
-
var _useState13 = (0, _react.useState)(
|
|
129
|
+
var _useState13 = (0, _react.useState)([]),
|
|
111
130
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
112
|
-
|
|
113
|
-
|
|
131
|
+
edgesHistory = _useState14[0],
|
|
132
|
+
setEdgesHistory = _useState14[1];
|
|
133
|
+
|
|
134
|
+
var lastNodeId = (0, _react.useMemo)(function () {
|
|
135
|
+
return edgesHistory[edgesHistory.length - 1];
|
|
136
|
+
}, [edgesHistory]);
|
|
137
|
+
var findLastLineBranched = (0, _react.useCallback)(function () {
|
|
138
|
+
var lastEdge = edges.find(function (edge) {
|
|
139
|
+
return edge.fromId === lastNodeId;
|
|
140
|
+
});
|
|
141
|
+
var lastLine = lines.find(function (line) {
|
|
142
|
+
return line.id === lastEdge.fromId;
|
|
143
|
+
});
|
|
144
|
+
return lastLine;
|
|
145
|
+
}, [edges, lines, lastNodeId]);
|
|
146
|
+
var previousLineWasDecision = (0, _react.useCallback)(function () {
|
|
147
|
+
if (isBranched) {
|
|
148
|
+
// if we have edges, we need to check if the previous line was a decision
|
|
149
|
+
var lastLine = findLastLineBranched();
|
|
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] : {};
|
|
114
154
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
155
|
+
return currentLine > 0 && (_lastLine === null || _lastLine === void 0 ? void 0 : _lastLine.decision);
|
|
156
|
+
}
|
|
157
|
+
}, [currentLine, isBranched, lines, lastNodeId, edges]);
|
|
118
158
|
var translate = (0, _react.useCallback)(function (id) {
|
|
119
159
|
return emitEvent({
|
|
120
160
|
type: 'translate',
|
|
@@ -146,7 +186,6 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
146
186
|
var leftWithSlots = lines.slice(0, currentLine + 1).reverse().find(function (line) {
|
|
147
187
|
return line.slots;
|
|
148
188
|
});
|
|
149
|
-
var lastLine = lines[currentLine - 1] ? lines[currentLine - 1] : {};
|
|
150
189
|
var hasCharacters = !isDecision && ((_currentLineData$slot = currentLineData.slots) === null || _currentLineData$slot === void 0 ? void 0 : _currentLineData$slot.filter(function (slot) {
|
|
151
190
|
return slot.uid;
|
|
152
191
|
}).length);
|
|
@@ -209,14 +248,6 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
209
248
|
}
|
|
210
249
|
}
|
|
211
250
|
|
|
212
|
-
var listProps = {
|
|
213
|
-
characters: currentCharacters,
|
|
214
|
-
lodSettings: lodSettings,
|
|
215
|
-
actors: actors,
|
|
216
|
-
currentMessage: currentMessage || {},
|
|
217
|
-
slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
|
|
218
|
-
flex: isFlex
|
|
219
|
-
};
|
|
220
251
|
var finishConversation = (0, _react.useCallback)(function () {
|
|
221
252
|
emitEvent({
|
|
222
253
|
type: 'success'
|
|
@@ -250,12 +281,20 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
250
281
|
var handleBranchDirection = (0, _react.useCallback)(function () {
|
|
251
282
|
var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
|
|
252
283
|
var keys = forward ? ['fromId', 'toId'] : ['toId', 'fromId'];
|
|
253
|
-
var
|
|
284
|
+
var foundEdges = edges.filter(function (edge) {
|
|
254
285
|
return edge[keys[0]] === currentLineData.id;
|
|
255
286
|
});
|
|
287
|
+
var foundEdge = foundEdges.length === 1 ? foundEdges[0] : foundEdges.find(function (edge) {
|
|
288
|
+
return edge[keys[1]] === lastNodeId;
|
|
289
|
+
});
|
|
256
290
|
|
|
257
291
|
if (!(foundEdge !== null && foundEdge !== void 0 && foundEdge[keys[0]])) {
|
|
258
292
|
return;
|
|
293
|
+
} // if going backwards, we need to remove the last node from the history
|
|
294
|
+
|
|
295
|
+
|
|
296
|
+
if (!forward) {
|
|
297
|
+
setEdgesHistory(edgesHistory.slice(0, -1));
|
|
259
298
|
}
|
|
260
299
|
|
|
261
300
|
var destination = lines.findIndex(function (line) {
|
|
@@ -271,7 +310,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
271
310
|
var handleClickNext = (0, _react.useCallback)(function (choice, reset) {
|
|
272
311
|
var isLast = false;
|
|
273
312
|
setTTsStart(false);
|
|
274
|
-
|
|
313
|
+
setEdgesHistory([].concat(_toConsumableArray(edgesHistory), [currentLineData.id]));
|
|
275
314
|
setStarted(false);
|
|
276
315
|
setAudioFailed(false);
|
|
277
316
|
|
|
@@ -297,7 +336,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
297
336
|
if (!isLast) {
|
|
298
337
|
setStarted(true);
|
|
299
338
|
}
|
|
300
|
-
}, [currentLine, currentLineData.decision, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length]);
|
|
339
|
+
}, [currentLine, currentLineData.decision, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length, edgesHistory]);
|
|
301
340
|
|
|
302
341
|
var handleClickBack = function handleClickBack() {
|
|
303
342
|
setStarted(false);
|
|
@@ -341,7 +380,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
341
380
|
};
|
|
342
381
|
|
|
343
382
|
var autoplayCond = automatic && !isDecision;
|
|
344
|
-
var disableBackButton = currentLine === 0 || previousLineWasDecision
|
|
383
|
+
var disableBackButton = currentLine === 0 || previousLineWasDecision();
|
|
345
384
|
(0, _useEkho.default)({
|
|
346
385
|
audioType: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType,
|
|
347
386
|
volume: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioVolume,
|
|
@@ -352,7 +391,9 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
352
391
|
soundActions: soundActions,
|
|
353
392
|
emitEvent: emitEvent,
|
|
354
393
|
onStart: function onStart() {
|
|
355
|
-
|
|
394
|
+
var _currentMessage$emoti;
|
|
395
|
+
|
|
396
|
+
if (currentMessage !== null && currentMessage !== void 0 && (_currentMessage$emoti = currentMessage.emotion) !== null && _currentMessage$emoti !== void 0 && _currentMessage$emoti.includes('think')) return;
|
|
356
397
|
setTTsStart(true);
|
|
357
398
|
},
|
|
358
399
|
onError: function onError() {
|
|
@@ -367,19 +408,22 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
|
|
|
367
408
|
}
|
|
368
409
|
});
|
|
369
410
|
(0, _react.useEffect)(function () {
|
|
370
|
-
var _currentMessage$
|
|
411
|
+
var _currentMessage$emoti2;
|
|
371
412
|
|
|
372
|
-
if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && !((_currentMessage$
|
|
413
|
+
if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && !(currentMessage !== null && currentMessage !== void 0 && (_currentMessage$emoti2 = currentMessage.emotion) !== null && _currentMessage$emoti2 !== void 0 && _currentMessage$emoti2.includes('think'))) {
|
|
373
414
|
setTTsStart(true);
|
|
374
415
|
}
|
|
375
|
-
}, [currentLineData, currentMessage.emotion]); // Autoplay logic
|
|
416
|
+
}, [currentLineData, currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.emotion]); // Autoplay logic
|
|
376
417
|
|
|
377
418
|
(0, _react.useEffect)(function () {
|
|
378
419
|
if (autoplayCond && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
|
|
379
420
|
var _currentMessage$text;
|
|
380
421
|
|
|
381
|
-
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);
|
|
382
|
-
|
|
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
|
+
|
|
424
|
+
if (!isEndNode()) {
|
|
425
|
+
start(handleClickNext, time < minMs ? minMs : time);
|
|
426
|
+
}
|
|
383
427
|
}
|
|
384
428
|
|
|
385
429
|
return function () {
|
|
@@ -152,7 +152,9 @@ function Panel(_ref) {
|
|
|
152
152
|
fov: 35,
|
|
153
153
|
focus: 10,
|
|
154
154
|
ref: cameraRef,
|
|
155
|
-
position: defaultCamPos
|
|
155
|
+
position: defaultCamPos,
|
|
156
|
+
makeDefault: true,
|
|
157
|
+
defaultCamera: true
|
|
156
158
|
}), /*#__PURE__*/_react.default.createElement(_LightSet.default, null));
|
|
157
159
|
}
|
|
158
160
|
|
|
@@ -79,7 +79,7 @@ var maxCharacterToSwitch = 70;
|
|
|
79
79
|
raycast.firstHitOnly = true;
|
|
80
80
|
|
|
81
81
|
var DialogComponent = function DialogComponent(_ref) {
|
|
82
|
-
var
|
|
82
|
+
var _currentLineData$slot;
|
|
83
83
|
|
|
84
84
|
var emitEvent = _ref.emitEvent,
|
|
85
85
|
lines = _ref.lines,
|
|
@@ -146,23 +146,23 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
146
146
|
setAnimationRunning = _useState12[1];
|
|
147
147
|
|
|
148
148
|
var animationTarget = (0, _react.useRef)(new _three.Object3D());
|
|
149
|
-
var
|
|
149
|
+
var currentLineData = lines[line];
|
|
150
150
|
var lastLine = lines[line - 1];
|
|
151
151
|
var lastSet = (0, _react.useRef)(false);
|
|
152
152
|
var isBranched = !!edges;
|
|
153
153
|
|
|
154
|
-
var _ref2 =
|
|
154
|
+
var _ref2 = currentLineData || {},
|
|
155
155
|
voiceOver = _ref2.voiceOver,
|
|
156
156
|
decision = _ref2.decision;
|
|
157
157
|
|
|
158
|
-
var talkingCharacter =
|
|
158
|
+
var talkingCharacter = currentLineData === null || currentLineData === void 0 ? void 0 : (_currentLineData$slot = currentLineData.slots) === null || _currentLineData$slot === void 0 ? void 0 : _currentLineData$slot.find(function (slot) {
|
|
159
159
|
return slot.talking;
|
|
160
160
|
});
|
|
161
|
-
var autoPlayCond = automatic && !(
|
|
162
|
-
var audio = Object.keys((
|
|
163
|
-
var voice = Object.keys((
|
|
164
|
-
var isVoiceOver = voiceOver || (
|
|
165
|
-
var isDecision = decision || (
|
|
161
|
+
var autoPlayCond = automatic && !(currentLineData !== null && currentLineData !== void 0 && currentLineData.decision);
|
|
162
|
+
var audio = Object.keys((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audio) || {}).length;
|
|
163
|
+
var voice = Object.keys((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.voice) || {}).length;
|
|
164
|
+
var isVoiceOver = voiceOver || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.type) === 'conversationalNarration';
|
|
165
|
+
var isDecision = decision || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.type) === 'conversationalDecision';
|
|
166
166
|
|
|
167
167
|
var _useState13 = (0, _react.useState)({
|
|
168
168
|
text: '',
|
|
@@ -200,11 +200,36 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
200
200
|
});
|
|
201
201
|
}, [emitEvent]);
|
|
202
202
|
|
|
203
|
-
var _useState15 = (0, _react.useState)(
|
|
203
|
+
var _useState15 = (0, _react.useState)([]),
|
|
204
204
|
_useState16 = _slicedToArray(_useState15, 2),
|
|
205
|
-
|
|
206
|
-
|
|
205
|
+
edgesHistory = _useState16[0],
|
|
206
|
+
setEdgesHistory = _useState16[1];
|
|
207
|
+
|
|
208
|
+
var lastNodeId = (0, _react.useMemo)(function () {
|
|
209
|
+
return edgesHistory[edgesHistory.length - 1];
|
|
210
|
+
}, [edgesHistory]);
|
|
211
|
+
var findLastLineBranched = (0, _react.useCallback)(function () {
|
|
212
|
+
var lastEdge = edges.find(function (edge) {
|
|
213
|
+
return edge.fromId === lastNodeId;
|
|
214
|
+
});
|
|
215
|
+
var lastLine = lines.find(function (line) {
|
|
216
|
+
return line.id === lastEdge.fromId;
|
|
217
|
+
});
|
|
218
|
+
return lastLine;
|
|
219
|
+
}, [edges, lines, lastNodeId]);
|
|
220
|
+
var previousLineWasDecision = (0, _react.useCallback)(function () {
|
|
221
|
+
if (isBranched) {
|
|
222
|
+
// if we have edges, we need to check if the previous line was a decision
|
|
223
|
+
var _lastLine = findLastLineBranched();
|
|
207
224
|
|
|
225
|
+
return _lastLine === null || _lastLine === void 0 ? void 0 : _lastLine.decision;
|
|
226
|
+
} else {
|
|
227
|
+
// if there is no branching, the previous line is the previous one
|
|
228
|
+
var _lastLine2 = lines[currentLineData - 1] ? lines[currentLineData - 1] : {};
|
|
229
|
+
|
|
230
|
+
return currentLineData > 0 && (_lastLine2 === null || _lastLine2 === void 0 ? void 0 : _lastLine2.decision);
|
|
231
|
+
}
|
|
232
|
+
}, [currentLineData, isBranched, lines, lastNodeId, edges]);
|
|
208
233
|
var getCurrentVisible = (0, _react.useCallback)(function (uid) {
|
|
209
234
|
if (!uid) return null;
|
|
210
235
|
var object;
|
|
@@ -255,7 +280,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
255
280
|
}, [loader]); // Force default animation without transition
|
|
256
281
|
|
|
257
282
|
var executeDefaultAnimation = function executeDefaultAnimation(element) {
|
|
258
|
-
if (element.uid === talkingCharacter.uid) return;
|
|
283
|
+
if (!talkingCharacter || element.uid === talkingCharacter.uid) return;
|
|
259
284
|
|
|
260
285
|
if (element.userData.mixer && element.userData.defaultAnim) {
|
|
261
286
|
var mixer = element.userData.mixer;
|
|
@@ -324,12 +349,20 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
324
349
|
var handleBranchDirection = (0, _react.useCallback)(function () {
|
|
325
350
|
var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
|
|
326
351
|
var keys = forward ? ['fromId', 'toId'] : ['toId', 'fromId'];
|
|
327
|
-
var
|
|
328
|
-
return edge[keys[0]] ===
|
|
352
|
+
var foundEdges = edges.filter(function (edge) {
|
|
353
|
+
return edge[keys[0]] === currentLineData.id;
|
|
354
|
+
});
|
|
355
|
+
var foundEdge = foundEdges.length === 1 ? foundEdges[0] : foundEdges.find(function (edge) {
|
|
356
|
+
return edge[keys[1]] === lastNodeId;
|
|
329
357
|
});
|
|
330
358
|
|
|
331
359
|
if (!(foundEdge !== null && foundEdge !== void 0 && foundEdge[keys[0]])) {
|
|
332
360
|
return;
|
|
361
|
+
} // if going backwards remove last edge from history
|
|
362
|
+
|
|
363
|
+
|
|
364
|
+
if (!forward) {
|
|
365
|
+
setEdgesHistory(edgesHistory.slice(0, edgesHistory.length - 1));
|
|
333
366
|
}
|
|
334
367
|
|
|
335
368
|
var destination = lines.findIndex(function (l) {
|
|
@@ -344,11 +377,11 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
344
377
|
} else {
|
|
345
378
|
finishConversation();
|
|
346
379
|
}
|
|
347
|
-
}, [
|
|
380
|
+
}, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id, edges, finishConversation, lines]);
|
|
348
381
|
var handleDecisionBranch = (0, _react.useCallback)(function (choice, reset) {
|
|
349
382
|
var currentId = [3, 2, 1][choice.id];
|
|
350
383
|
var optionsEdges = edges.filter(function (edge) {
|
|
351
|
-
return edge.fromId === (
|
|
384
|
+
return edge.fromId === (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id);
|
|
352
385
|
});
|
|
353
386
|
var currentEdge = optionsEdges.find(function (edge) {
|
|
354
387
|
return parseInt(edge.fromPointIndex) === currentId;
|
|
@@ -369,14 +402,14 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
369
402
|
} else {
|
|
370
403
|
finishConversation();
|
|
371
404
|
}
|
|
372
|
-
}, [
|
|
405
|
+
}, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id, edges, finishConversation, lines]);
|
|
373
406
|
var backLine = (0, _react.useCallback)(function () {
|
|
374
407
|
restTalkingAnimation();
|
|
375
408
|
setAudioFailed(false);
|
|
376
409
|
|
|
377
410
|
if (isBranched) {
|
|
378
411
|
handleBranchDirection(false);
|
|
379
|
-
} else if (
|
|
412
|
+
} else if (previousLineWasDecision()) {
|
|
380
413
|
setCurrentMessage({
|
|
381
414
|
show: false
|
|
382
415
|
});
|
|
@@ -385,7 +418,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
385
418
|
}, [handleBranchDirection, isBranched, lastLine, line]);
|
|
386
419
|
var nextLine = (0, _react.useCallback)(function (choice, reset) {
|
|
387
420
|
restTalkingAnimation();
|
|
388
|
-
|
|
421
|
+
setEdgesHistory([].concat(_toConsumableArray(edgesHistory), [currentLineData.id]));
|
|
389
422
|
setAudioFailed(false);
|
|
390
423
|
|
|
391
424
|
if (isBranched) {
|
|
@@ -399,10 +432,10 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
399
432
|
show: false
|
|
400
433
|
});
|
|
401
434
|
changeLine(line + 1);
|
|
402
|
-
} else if (
|
|
435
|
+
} else if (currentLineData.decision) {
|
|
403
436
|
finishConversation();
|
|
404
437
|
}
|
|
405
|
-
}, [
|
|
438
|
+
}, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.decision, isBranched, line, lines.length, handleDecisionBranch, handleBranchDirection, finishConversation]);
|
|
406
439
|
|
|
407
440
|
var manualBackLine = function manualBackLine() {
|
|
408
441
|
setAutomatic(false);
|
|
@@ -411,8 +444,8 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
411
444
|
|
|
412
445
|
var isEndNode = function isEndNode() {
|
|
413
446
|
if (isBranched) {
|
|
414
|
-
return
|
|
415
|
-
return edge.fromId ===
|
|
447
|
+
return currentLineData && currentLineData.type !== 'conversationalDecision' && !edges.find(function (edge) {
|
|
448
|
+
return edge.fromId === currentLineData.id;
|
|
416
449
|
});
|
|
417
450
|
}
|
|
418
451
|
|
|
@@ -421,6 +454,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
421
454
|
|
|
422
455
|
var manualNextLine = function manualNextLine() {
|
|
423
456
|
if (isEndNode()) {
|
|
457
|
+
startTalking(false);
|
|
424
458
|
finishConversation();
|
|
425
459
|
} else {
|
|
426
460
|
setAutomatic(false);
|
|
@@ -486,8 +520,8 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
486
520
|
} else if (isVoiceOver) {
|
|
487
521
|
resetCameraView();
|
|
488
522
|
setCurrentMessage({
|
|
489
|
-
text:
|
|
490
|
-
name: (
|
|
523
|
+
text: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.text,
|
|
524
|
+
name: (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.alias) || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.name) || "[ ".concat(translate('storylines.misc.voiceOver'), " ]"),
|
|
491
525
|
left: false,
|
|
492
526
|
inScene: false,
|
|
493
527
|
voiceOver: true,
|
|
@@ -497,7 +531,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
497
531
|
show: true
|
|
498
532
|
});
|
|
499
533
|
} else if (!lastSet.current) {
|
|
500
|
-
var slottedCharacters =
|
|
534
|
+
var slottedCharacters = currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.slots.filter(function (slot) {
|
|
501
535
|
return slot.uid && !slot.talking;
|
|
502
536
|
});
|
|
503
537
|
var currentParticipants = [].concat(_toConsumableArray(slottedCharacters.map(function (slot) {
|
|
@@ -541,7 +575,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
541
575
|
element.userData.defaultAnim = action.getClip();
|
|
542
576
|
}
|
|
543
577
|
|
|
544
|
-
if ((
|
|
578
|
+
if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && talkingCharacter.emotion !== 'thinkful') {
|
|
545
579
|
startTalking(true);
|
|
546
580
|
}
|
|
547
581
|
|
|
@@ -594,19 +628,21 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
594
628
|
});
|
|
595
629
|
}
|
|
596
630
|
}
|
|
597
|
-
}, [actors, camera,
|
|
631
|
+
}, [actors, camera, currentLineData, zoomInActor, getCurrentVisible, translate, getAvatarURL, loadEmotion, resetCameraView, isDecision, isVoiceOver, charactersInvolved]); // Sound logic
|
|
598
632
|
|
|
599
633
|
var stopEkho = (0, _useEkho.default)({
|
|
600
|
-
audioType:
|
|
601
|
-
volume:
|
|
602
|
-
voice:
|
|
634
|
+
audioType: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType,
|
|
635
|
+
volume: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioVolume,
|
|
636
|
+
voice: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.voice,
|
|
603
637
|
started: currentMessage.show,
|
|
604
638
|
text: currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.text,
|
|
605
|
-
audio:
|
|
639
|
+
audio: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audio,
|
|
606
640
|
soundActions: soundActions,
|
|
607
641
|
emitEvent: emitEvent,
|
|
608
642
|
onStart: function onStart() {
|
|
609
|
-
|
|
643
|
+
var _talkingCharacter$emo;
|
|
644
|
+
|
|
645
|
+
if (talkingCharacter !== null && talkingCharacter !== void 0 && (_talkingCharacter$emo = talkingCharacter.emotion) !== null && _talkingCharacter$emo !== void 0 && _talkingCharacter$emo.includes('think')) return;
|
|
610
646
|
startTalking(true);
|
|
611
647
|
},
|
|
612
648
|
onError: function onError() {
|
|
@@ -628,23 +664,26 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
628
664
|
}, [line, stopEkho]); // Autoplay logic
|
|
629
665
|
|
|
630
666
|
(0, _react.useEffect)(function () {
|
|
631
|
-
if (autoPlayCond && currentMessage.show && ((
|
|
667
|
+
if (autoPlayCond && currentMessage.show && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
|
|
632
668
|
var _currentMessage$text;
|
|
633
669
|
|
|
634
|
-
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);
|
|
635
|
-
|
|
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); // if it's not last node
|
|
671
|
+
|
|
672
|
+
if (!isEndNode()) {
|
|
673
|
+
start(nextLine, time < minMs ? minMs : time);
|
|
674
|
+
}
|
|
636
675
|
}
|
|
637
676
|
|
|
638
677
|
return function () {
|
|
639
678
|
stop();
|
|
640
679
|
};
|
|
641
|
-
}, [currentMessage, nextLine, start, stop,
|
|
680
|
+
}, [currentMessage, nextLine, start, stop, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoPlayCond, audio, voice, audioFailed]); // Positioning Bubble Message logic
|
|
642
681
|
|
|
643
682
|
var checkBubbleBounds = (0, _react.useCallback)(function (group, bubble) {
|
|
644
683
|
groupRef.current = group === null || group === void 0 ? void 0 : group.current;
|
|
645
684
|
bubbleRef.current = bubble === null || bubble === void 0 ? void 0 : bubble.current;
|
|
646
685
|
|
|
647
|
-
if (
|
|
686
|
+
if (currentLineData !== null && currentLineData !== void 0 && currentLineData.slots && currentMessage.show && bubble !== null && bubble !== void 0 && bubble.current) {
|
|
648
687
|
var bubbleRect = bubble.current.getBoundingClientRect();
|
|
649
688
|
var x = bubbleRect.x + bubbleRect.width;
|
|
650
689
|
var y = bubbleRect.y - bubbleRect.height;
|
|
@@ -684,7 +723,7 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
684
723
|
bubble.current.parentNode.style.transform = '';
|
|
685
724
|
}
|
|
686
725
|
}
|
|
687
|
-
}, [camera.quaternion,
|
|
726
|
+
}, [camera.quaternion, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.slots, currentMessage.inScene, getAvatarURL]);
|
|
688
727
|
(0, _react.useEffect)(function () {
|
|
689
728
|
if (animationRunning) {
|
|
690
729
|
var cam = camera;
|
|
@@ -755,10 +794,10 @@ var DialogComponent = function DialogComponent(_ref) {
|
|
|
755
794
|
height: '100vh',
|
|
756
795
|
position: 'static'
|
|
757
796
|
};
|
|
758
|
-
var disableBackButton = line === 0 || previousLineWasDecision
|
|
797
|
+
var disableBackButton = line === 0 || previousLineWasDecision();
|
|
759
798
|
|
|
760
799
|
if (isDecision) {
|
|
761
|
-
var decisionPayload = _objectSpread(_objectSpread({},
|
|
800
|
+
var decisionPayload = _objectSpread(_objectSpread({}, currentLineData.payload), {}, {
|
|
762
801
|
inheritProps: {
|
|
763
802
|
slots: [],
|
|
764
803
|
disableBackground: true
|