@gamelearn/arcade-components 2.17.6 → 2.17.8

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

@@ -43,7 +43,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var isMobile = (0, _deviceDetection.DeviceDetection)();
 var defaultCamPos = [0, 14.63, 16];
-var boneWhiteList = ['l_eye_jnt', 'l_eye', 'eye_l'];
+var boneWhiteList = ['l_eye_jnt', 'l_eye', 'eye_l', 'head_m'];
 
 function Panel(_ref) {
   var _character$resource4, _character$resource6, _character$resource6$, _character$resource6$2, _character$resource7;
@@ -55,6 +55,7 @@ function Panel(_ref) {
   var cameraRef = (0, _react.useRef)(null);
   var sceneRef = (0, _react.useRef)(null);
   var isCharacter = character.type === 'character';
+  var ref = (0, _react.useRef)();
 
   var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -131,19 +132,25 @@ function Panel(_ref) {
         var _character$emotion;
 
         model.current = object;
+        var head;
         var isSeated = (_character$emotion = character.emotion) === null || _character$emotion === void 0 ? void 0 : _character$emotion.includes('seated');
         cameraRef.current.position.setY(size.y - 1.5 * 1.3); // Retro compatible with resources without eye bone
 
-        object.traverse(function (obj) {
-          var boneName = obj.name.toLowerCase();
+        object.traverse(function (node) {
+          var boneName = node.name.toLowerCase();
 
-          if (obj.isBone && boneWhiteList.includes(boneName)) {
-            var distance = isSeated ? 5 : 0.5;
-            var leftEyeVector = new _three.Vector3().setFromMatrixPosition(obj.matrixWorld);
-            cameraRef.current.position.setX(leftEyeVector.x - 0.5);
-            cameraRef.current.position.setY(leftEyeVector.y - distance);
+          if (node.isBone && boneWhiteList.includes(boneName)) {
+            var distance = isSeated ? 1 : 0;
+            var leftEyeVector = new _three.Vector3().setFromMatrixPosition(node.matrixWorld);
+
+            if (boneName === 'head_m') {
+              head = leftEyeVector;
+            } else {
+              cameraRef.current.position.setY(leftEyeVector.y - distance);
+            }
           }
         });
+        if (head && !isSeated) cameraRef.current.lookAt(head);
         cameraRef.current.zoom = 1.85;
       } else if (character.type === 'object' || !defaultAnim) {
         (0, _helpers.cameraFitAnyObject)(object, cameraRef.current);
@@ -172,6 +179,11 @@ function Panel(_ref) {
           left: child.left - parent.left,
           bottom: child.bottom - parent.bottom
         };
+
+        if (ref.current) {
+          onLoadElement(ref.current);
+        }
+
         var paddingBottom = isMobile ? 24 : 40;
         relativePos.bottom += active ? -paddingBottom : paddingBottom;
         gl.setViewport(relativePos.left, relativePos.bottom, width, height);
@@ -185,6 +197,7 @@ function Panel(_ref) {
   }, (_character$resource7 = character.resource) !== null && _character$resource7 !== void 0 && _character$resource7.url ? /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.LodWrapper, {
     lod: currentLOD
   }, /*#__PURE__*/_react.default.createElement(_arcadeThreeCore.TriggerWrapper, {
+    ref: ref,
     name: "char_".concat(character.uid),
     url: character.resource.url,
     animationUrl: emotion.url,

package/package.json

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