@gamelearn/arcade-components 2.8.6-hotfix-zoom → 2.9.0

package/dist/components/conversational-pro-component/components/ConversationalProComponent.js

@@ -186,7 +186,8 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
     currentMessage: currentMessage || {},
     slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
     flex: isFlex,
-    pause: pause
+    pause: pause,
+    emitEvent: emitEvent
   }; // Last line with slots
 
   var leftWithSlots = lines.slice(0, currentLine + 1).reverse().find(function (line) {

package/dist/components/conversational-pro-component/components/Slot.js

@@ -16,19 +16,63 @@ var Slot = function Slot(_ref) {
 
   var character = _ref.character,
       active = _ref.active,
-      slot = _ref.slot;
+      slot = _ref.slot,
+      lowQuality = _ref.lowQuality;
   var isImage = character.type === 'image';
+  var isCharacter = character.type === 'character';
+  var isObject = character.type === 'object';
   var imgUrl = character === null || character === void 0 ? void 0 : (_character$resource = character.resource) === null || _character$resource === void 0 ? void 0 : _character$resource.url;
-  var style = isImage ? {
-    backgroundImage: "url(".concat(imgUrl, ")"),
+
+  var backgroundImage = function backgroundImage() {
+    if (isImage) {
+      return "url(".concat(imgUrl, ")");
+    }
+
+    if (isCharacter && lowQuality) {
+      return "url(".concat(imgUrl.replace('character.glb', 'face.png'), ")");
+    }
+
+    if (isObject && lowQuality) {
+      return "url(".concat(imgUrl.replace('object.glb', 'thumbnail.png'), ")");
+    }
+
+    return '';
+  };
+
+  var backgroundSize = function backgroundSize() {
+    if (isImage) {
+      return 'contain';
+    }
+
+    if (isCharacter || isObject) {
+      return 'auto 95%';
+    }
+
+    return '';
+  };
+
+  var backgroundPosition = function backgroundPosition() {
+    if (isImage) {
+      return 'center';
+    }
+
+    if (isCharacter || isObject) {
+      return 'center bottom';
+    }
+
+    return '';
+  };
+
+  var thumbnailsImage = isImage || lowQuality ? {
+    backgroundImage: backgroundImage(),
     backgroundRepeat: 'no-repeat',
-    backgroundPosition: 'center',
-    backgroundSize: 'contain'
+    backgroundPosition: backgroundPosition(),
+    backgroundSize: backgroundSize()
   } : {};
   return /*#__PURE__*/_react.default.createElement("div", {
     key: character.name,
     className: "conversation--character__item ".concat(active ? 'active' : '', " ").concat(slot),
-    style: style
+    style: thumbnailsImage
   }, active && character.name ? /*#__PURE__*/_react.default.createElement("span", {
     className: "conversation--character__name"
   }, character.name) : null);

package/dist/components/conversational-pro-component/components/SlotList.js

@@ -1,11 +1,13 @@
 "use strict";
 
+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); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _Slot = _interopRequireDefault(require("./Slot"));
 
@@ -13,6 +15,10 @@ var _scene = _interopRequireDefault(require("./scene"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 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; }
@@ -30,7 +36,8 @@ var SlotList = function SlotList(_ref) {
       flex = _ref.flex,
       slots = _ref.slots,
       children = _ref.children,
-      pause = _ref.pause;
+      pause = _ref.pause,
+      emitEvent = _ref.emitEvent;
 
   var characterProps = function characterProps(_ref2) {
     var character = _ref2.character,
@@ -44,6 +51,12 @@ var SlotList = function SlotList(_ref) {
     };
   };
 
+  var currentLOD = (0, _react.useMemo)(function () {
+    return emitEvent({
+      type: 'currentLod'
+    });
+  }, [emitEvent]);
+  var lowQuality = currentLOD === 'divideby64';
   var gameChars = slots.reduce(function (acc, current) {
     var actor = actors === null || actors === void 0 ? void 0 : actors.find(function (a) {
       return a.uid === current.uid;
@@ -100,7 +113,9 @@ var SlotList = function SlotList(_ref) {
         }
 
         return /*#__PURE__*/_react.default.createElement(_Slot.default, _extends({
-          key: "".concat(character.uid + index)
+          emitEvent: emitEvent,
+          key: "".concat(character.uid + index),
+          lowQuality: lowQuality
         }, characterProps({
           character: character,
           active: currentMessage.position === character.position,
@@ -155,7 +170,9 @@ var SlotList = function SlotList(_ref) {
     currentMessage: currentMessage,
     lodSettings: lodSettings,
     ttsStarted: ttsStarted,
-    pause: pause
+    pause: pause,
+    emitEvent: emitEvent,
+    lowQuality: lowQuality
   }), children || /*#__PURE__*/_react.default.createElement(Slots, null));
 };
 

package/dist/components/conversational-pro-component/components/scene/Panel.js

@@ -49,7 +49,8 @@ function Panel(_ref) {
 
   var character = _ref.character,
       ttsStarted = _ref.ttsStarted,
-      active = _ref.active;
+      active = _ref.active,
+      emitEvent = _ref.emitEvent;
   var cameraRef = (0, _react.useRef)(null);
   var sceneRef = (0, _react.useRef)(null);
   var isCharacter = character.type === 'character';
@@ -59,6 +60,11 @@ function Panel(_ref) {
       talking = _useState2[0],
       setTalking = _useState2[1];
 
+  var currentLOD = (0, _react.useMemo)(function () {
+    return emitEvent({
+      type: 'currentLod'
+    });
+  }, [emitEvent]);
   var model = (0, _react.useRef)();
   var defaultClip = (0, _react.useRef)();
   var emotion = (0, _react.useMemo)(function () {
@@ -166,7 +172,8 @@ function Panel(_ref) {
   return character.type === 'image' ? null : /*#__PURE__*/_react.default.createElement("scene", {
     ref: sceneRef
   }, (_character$resource7 = character.resource) !== null && _character$resource7 !== void 0 && _character$resource7.url ? /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.LodWrapper, {
-    progressive: true
+    progressive: true,
+    lod: currentLOD
   }, /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.TriggerWrapper, {
     name: "char_".concat(character.uid),
     url: character.resource.url,

package/dist/components/conversational-pro-component/components/scene/Panels.js

@@ -23,7 +23,8 @@ var Panels = function Panels(_ref) {
       ttsStarted = _ref.ttsStarted,
       activeIndex = _ref.activeIndex,
       flex = _ref.flex,
-      lodSettings = _ref.lodSettings;
+      lodSettings = _ref.lodSettings,
+      emitEvent = _ref.emitEvent;
   return slots.map(function (slot, slotPosition) {
     var currentCharacter = null;
     var characterPos = characters.findIndex(function (c) {
@@ -39,7 +40,8 @@ var Panels = function Panels(_ref) {
         character: currentCharacter,
         active: activeIndex === currentPosition,
         lodSettings: lodSettings,
-        ttsStarted: ttsStarted
+        ttsStarted: ttsStarted,
+        emitEvent: emitEvent
       });
     }
 

package/dist/components/conversational-pro-component/components/scene/index.js

@@ -39,7 +39,8 @@ var PanelsWrapper = function PanelsWrapper(_ref) {
       ttsStarted = _ref.ttsStarted,
       slotRefs = _ref.slotRefs,
       flex = _ref.flex,
-      currentMessage = _ref.currentMessage;
+      currentMessage = _ref.currentMessage,
+      emitEvent = _ref.emitEvent;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -62,12 +63,13 @@ var PanelsWrapper = function PanelsWrapper(_ref) {
     slots: slots,
     slotRefs: slotRefs,
     flex: flex,
-    activeIndex: currentMessage.position
+    activeIndex: currentMessage.position,
+    emitEvent: emitEvent
   }) : null;
 };
 
 var Scene = function Scene(props) {
-  return /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.Renderer, {
+  return !props.lowQuality ? /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.Renderer, {
     fullscreen: false,
     className: "conversation--canvas",
     style: {
@@ -87,7 +89,7 @@ var Scene = function Scene(props) {
     }
   }), /*#__PURE__*/_react.default.createElement(_react.Suspense, {
     fallback: null
-  }, /*#__PURE__*/_react.default.createElement(PanelsWrapper, props)));
+  }, /*#__PURE__*/_react.default.createElement(PanelsWrapper, props))) : null;
 };
 
 var _default = Scene;

package/dist/components/decision-component/components/DecisionComponent.js

@@ -88,7 +88,8 @@ var DecisionComponent = function DecisionComponent(_ref) {
     currentMessage: {
       position: null,
       emotion: ''
-    }
+    },
+    emitEvent: emitEvent
   });
 
   if (inheritProps) {

package/dist/components/dialog-component/components/DialogComponent.js

@@ -592,7 +592,6 @@ var DialogComponent = function DialogComponent(_ref) {
                   avatar: getAvatarURL(talkingCharacter),
                   show: true
                 });
-                setAnimationRunning(false);
               }, zoomInActor ? 1200 : 0);
             }
           });

package/package.json

@@ -2,7 +2,7 @@
   "name": "@gamelearn/arcade-components",
   "author": "Gamelearn",
   "license": "unlicense",
-  "version": "2.8.6-hotfix-zoom",
+  "version": "2.9.0",
   "main": "dist/index.js",
   "files": [
     "dist",