@realsee/dnalogel 0.1.0 → 0.1.4

package/plugins/TreasurePlugin/TreasureObject.js

@@ -9,16 +9,38 @@ exports.TreasureObject = void 0;
 
 var THREE = _interopRequireWildcard(require("three"));
 
+var TWEEN = _interopRequireWildcard(require("@tweenjs/tween.js"));
+
 var _TreasureFaceAnime = require("./TreasureFaceAnime");
 
 var _TreasureOpenAnime = require("./TreasureOpenAnime");
 
 var _BetterTween = require("../../shared-utils/animationFrame/BetterTween");
 
+var _to = _interopRequireDefault(require("../../shared-utils/to"));
+
+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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+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."); }
+
+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); }
+
+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; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+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); } }
+
+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); }); }; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -49,13 +71,6 @@ function copyMaterial(orginMatrial) {
   });
   return material;
 }
-/** 宝箱实例
- * @description
- * 点击宝箱可以打开宝箱
- * @description
- * 在宝箱未打开时，靠近宝箱或点击宝箱，宝箱会转动到朝向用户的方向
- */
-
 
 var TreasureObject = /*#__PURE__*/function (_THREE$Object3D) {
   _inherits(TreasureObject, _THREE$Object3D);
@@ -73,13 +88,18 @@ var TreasureObject = /*#__PURE__*/function (_THREE$Object3D) {
 
     _defineProperty(_assertThisInitialized(_this), "opened", false);
 
+    _defineProperty(_assertThisInitialized(_this), "modelGroupPromise", Promise.resolve({
+      modelGroup: new THREE.Group(),
+      originGroup: new THREE.Group()
+    }));
+
     _defineProperty(_assertThisInitialized(_this), "onFiveWantsTapGesture", function (raycaster) {
-      var _this$clickCallback, _this2;
+      var _this$params$clickCal, _this$params;
 
-      var intersects = raycaster.intersectObject(_this.modelGroup, true);
+      var intersects = raycaster.intersectObject(_assertThisInitialized(_this), true);
       var isClickTreasure = !!intersects && intersects.length > 0;
       if (!isClickTreasure) return;
-      (_this$clickCallback = (_this2 = _this).clickCallback) === null || _this$clickCallback === void 0 ? void 0 : _this$clickCallback.call(_this2, _this.treasureID);
+      (_this$params$clickCal = (_this$params = _this.params).clickCallback) === null || _this$params$clickCal === void 0 ? void 0 : _this$params$clickCal.call(_this$params, _this.treasureID);
 
       _this.rotateToCamera();
 
@@ -92,48 +112,185 @@ var TreasureObject = /*#__PURE__*/function (_THREE$Object3D) {
       if (_this.position.distanceTo(_this.five.camera.position) < 3) _this.rotateToCamera();
     });
 
+    _this.params = params;
     _this.five = params.five;
     _this.treasureID = params.id;
 
     _this.position.copy(params.position);
 
-    _this.texture = params.baseTexture;
-    _this.modelGroup = params.fbxGroup.clone();
-    _this.clickCallback = params.clickCallback;
-    _this.faceAnime = new _TreasureFaceAnime.TreasureFaceAnime({
-      five: params.five,
-      faceTexturesPromise: params.faceTexturesPromise,
-      treasureGroup: _this.modelGroup
-    });
-    _this.openAnime = new _TreasureOpenAnime.TreasurePluginOpenAnime({
-      five: params.five,
-      treasureGroup: _this.modelGroup,
-      animationClip: params.fbxGroup.animations[0]
-    });
-
-    _this.init();
-
-    _this.faceAnime.play();
-
-    _this.five.on('panoArrived', _this.onFivePanoArrived);
+    var scale = 0.008 * params.config.scale;
 
-    _this.five.on('wantsTapGesture', _this.onFiveWantsTapGesture);
+    _this.scale.fromArray([scale, scale, scale]);
 
     return _this;
   }
 
   _createClass(TreasureObject, [{
+    key: "load",
+    value: function () {
+      var _load = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+        var _this2 = this;
+
+        var _yield$this$modelGrou, modelGroup, originGroup;
+
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                this.modelGroupPromise = this.getModelPromise();
+                _context.next = 3;
+                return this.modelGroupPromise;
+
+              case 3:
+                _yield$this$modelGrou = _context.sent;
+                modelGroup = _yield$this$modelGrou.modelGroup;
+                originGroup = _yield$this$modelGrou.originGroup;
+                this.add(modelGroup); // ========== openAnime ==========
+
+                this.openAnime = new _TreasureOpenAnime.TreasurePluginOpenAnime({
+                  five: this.five,
+                  treasureGroup: modelGroup,
+                  onComplete: function onComplete() {
+                    var _this2$params$onOpenA, _this2$params;
+
+                    return (_this2$params$onOpenA = (_this2$params = _this2.params).onOpenAnimationEnded) === null || _this2$params$onOpenA === void 0 ? void 0 : _this2$params$onOpenA.call(_this2$params, _this2.treasureID);
+                  },
+                  animationClip: originGroup.animations[0]
+                }); // ========== faceAnime ==========
+
+                this.faceAnime = new _TreasureFaceAnime.TreasureFaceAnime({
+                  five: this.five,
+                  treasureGroup: modelGroup,
+                  loadTexture: this.params.loadTexture,
+                  textureUrls: this.params.config.faceAnimeTextureUrls
+                });
+                this.faceAnime.play(); // ========== addEventListener ==========
+
+                this.five.on('panoArrived', this.onFivePanoArrived);
+                this.five.on('wantsTapGesture', this.onFiveWantsTapGesture);
+                this.five.needsRender = true;
+                return _context.abrupt("return", this);
+
+              case 14:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      function load() {
+        return _load.apply(this, arguments);
+      }
+
+      return load;
+    }()
+  }, {
+    key: "show",
+    value: function () {
+      var _show = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(params) {
+        var _params$duration,
+            _this3 = this;
+
+        var _yield$this$modelGrou2, modelGroup;
+
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                _context2.next = 2;
+                return this.modelGroupPromise;
+
+              case 2:
+                _yield$this$modelGrou2 = _context2.sent;
+                modelGroup = _yield$this$modelGrou2.modelGroup;
+                (0, _BetterTween.tweenProgress)().duration((_params$duration = params === null || params === void 0 ? void 0 : params.duration) !== null && _params$duration !== void 0 ? _params$duration : 300).easing(TWEEN.Easing.Quadratic.InOut).onUpdate(function (_ref) {
+                  var progress = _ref.progress;
+                  modelGroup.children.forEach(function (child) {
+                    var obj = child;
+                    obj.material && (obj.material.opacity = progress);
+                    _this3.five.needsRender = true;
+                  });
+                }).play();
+                return _context2.abrupt("return", true);
+
+              case 6:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2, this);
+      }));
+
+      function show(_x) {
+        return _show.apply(this, arguments);
+      }
+
+      return show;
+    }()
+  }, {
+    key: "hide",
+    value: function () {
+      var _hide = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(params) {
+        var _params$duration2,
+            _this4 = this;
+
+        var _yield$this$modelGrou3, modelGroup;
+
+        return regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) {
+            switch (_context3.prev = _context3.next) {
+              case 0:
+                _context3.next = 2;
+                return this.modelGroupPromise;
+
+              case 2:
+                _yield$this$modelGrou3 = _context3.sent;
+                modelGroup = _yield$this$modelGrou3.modelGroup;
+                (0, _BetterTween.tweenProgress)().duration((_params$duration2 = params === null || params === void 0 ? void 0 : params.duration) !== null && _params$duration2 !== void 0 ? _params$duration2 : 300).easing(TWEEN.Easing.Quadratic.InOut).onUpdate(function (_ref2) {
+                  var progress = _ref2.progress;
+                  modelGroup.children.forEach(function (child) {
+                    var obj = child;
+                    obj.material && (obj.material.opacity = 1 - progress);
+                    _this4.five.needsRender = true;
+                  });
+                }).play();
+                return _context3.abrupt("return", true);
+
+              case 6:
+              case "end":
+                return _context3.stop();
+            }
+          }
+        }, _callee3, this);
+      }));
+
+      function hide(_x2) {
+        return _hide.apply(this, arguments);
+      }
+
+      return hide;
+    }()
+    /** 销毁当前宝箱实例
+     * @description 注意 dispose 并不会销毁所使用的贴图，因为贴图会有共用关系，需要在最外层销毁
+     */
+
+  }, {
     key: "dispose",
     value: function dispose() {
-      this.faceAnime.dispose();
-      this.openAnime.dispose();
+      var _this$faceAnime, _this$openAnime;
+
+      (_this$faceAnime = this.faceAnime) === null || _this$faceAnime === void 0 ? void 0 : _this$faceAnime.dispose();
+      (_this$openAnime = this.openAnime) === null || _this$openAnime === void 0 ? void 0 : _this$openAnime.dispose();
       this.five.off('panoArrived', this.onFivePanoArrived);
       this.five.off('wantsTapGesture', this.onFiveWantsTapGesture);
     }
+    /** 旋转宝箱朝向用户 */
+
   }, {
     key: "rotateToCamera",
     value: function rotateToCamera() {
-      var _this3 = this;
+      var _this5 = this;
 
       if (this.opened) return; // 宝箱朝向
 
@@ -148,36 +305,95 @@ var TreasureObject = /*#__PURE__*/function (_THREE$Object3D) {
       var speed = 8;
       var duration = Math.ceil(deltaRadY / speed * 1000);
       var rotationStartY = this.rotation.y;
-      (0, _BetterTween.tweenProgress)(duration).onUpdate(function (_ref) {
-        var progress = _ref.progress;
-        _this3.rotation.y = rotationStartY + progress * deltaRadY * rotateDirection;
+      (0, _BetterTween.tweenProgress)(duration).onUpdate(function (_ref3) {
+        var progress = _ref3.progress;
+        _this5.rotation.y = rotationStartY + progress * deltaRadY * rotateDirection;
       }).play();
     }
+    /** 打开宝箱 */
+
   }, {
     key: "open",
     value: function open() {
+      var _this$faceAnime2, _this$faceAnime3, _this$openAnime2;
+
+      if (!this.openAnime) return false;
       if (this.opened) return false;
       this.opened = true;
-      this.faceAnime.pause();
-      this.faceAnime.setToInitialState();
-      this.openAnime.play();
+      (_this$faceAnime2 = this.faceAnime) === null || _this$faceAnime2 === void 0 ? void 0 : _this$faceAnime2.pause();
+      (_this$faceAnime3 = this.faceAnime) === null || _this$faceAnime3 === void 0 ? void 0 : _this$faceAnime3.setToInitialState();
+      (_this$openAnime2 = this.openAnime) === null || _this$openAnime2 === void 0 ? void 0 : _this$openAnime2.play();
       return true;
     }
   }, {
-    key: "init",
-    value: function init() {
-      var group = this.modelGroup;
-      group.traverse(function (obj) {
-        if (!(obj instanceof THREE.Mesh)) return;
-        obj.material = copyMaterial(obj.material);
-        if (obj.material.map) obj.material.map.encoding = THREE.sRGBEncoding;
-        obj.renderOrder = 2;
-      });
-      this.texture.encoding = THREE.sRGBEncoding;
-      group.getObjectByName('box').material.map = this.texture;
-      group.getObjectByName('box2').material.map = this.texture;
-      this.add(group);
-    }
+    key: "getModelPromise",
+    value: function () {
+      var _getModelPromise = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
+        var originGroup, modelGroup, _yield$to, _yield$to2, boxTextureError, boxTexture;
+
+        return regeneratorRuntime.wrap(function _callee4$(_context4) {
+          while (1) {
+            switch (_context4.prev = _context4.next) {
+              case 0:
+                _context4.next = 2;
+                return this.params.loadModelGroup(this.params.config.objectUrl);
+
+              case 2:
+                originGroup = _context4.sent;
+                modelGroup = originGroup.clone();
+                modelGroup.traverse(function (obj) {
+                  if (!(obj instanceof THREE.Mesh)) return;
+                  obj.material = copyMaterial(obj.material);
+                  if (obj.material.map) obj.material.map.encoding = THREE.sRGBEncoding;
+                  obj.renderOrder = 2;
+                });
+
+                if (!this.params.config.boxTextureUrl) {
+                  _context4.next = 17;
+                  break;
+                }
+
+                _context4.next = 8;
+                return (0, _to["default"])(this.params.loadTexture(this.params.config.boxTextureUrl));
+
+              case 8:
+                _yield$to = _context4.sent;
+                _yield$to2 = _slicedToArray(_yield$to, 2);
+                boxTextureError = _yield$to2[0];
+                boxTexture = _yield$to2[1];
+
+                if (!(boxTextureError || !boxTexture)) {
+                  _context4.next = 14;
+                  break;
+                }
+
+                throw new Error('加载盒子贴图失败');
+
+              case 14:
+                boxTexture.encoding = THREE.sRGBEncoding;
+                modelGroup.getObjectByName('box').material.map = boxTexture;
+                modelGroup.getObjectByName('box2').material.map = boxTexture;
+
+              case 17:
+                return _context4.abrupt("return", {
+                  modelGroup: modelGroup,
+                  originGroup: originGroup
+                });
+
+              case 18:
+              case "end":
+                return _context4.stop();
+            }
+          }
+        }, _callee4, this);
+      }));
+
+      function getModelPromise() {
+        return _getModelPromise.apply(this, arguments);
+      }
+
+      return getModelPromise;
+    }()
   }]);
 
   return TreasureObject;

package/plugins/TreasurePlugin/TreasureOpenAnime.d.ts

@@ -1,7 +1,8 @@
 import * as THREE from 'three';
 import { Five } from '@realsee/five';
-export interface TreasureOpenAnimeParam {
+export interface TreasureOpenAnimeParams {
     five: Five;
+    onComplete?: () => unknown;
     treasureGroup: THREE.Group;
     animationClip: THREE.AnimationClip;
 }
@@ -14,9 +15,10 @@ export declare class TreasurePluginOpenAnime {
     private hasPlayed;
     private clock;
     private treasureGroup;
+    private params;
     private animationDispose?;
     private action;
-    constructor(param: TreasureOpenAnimeParam);
+    constructor(params: TreasureOpenAnimeParams);
     dispose(): void;
     play(): boolean;
     private onPlayFinished;

package/plugins/TreasurePlugin/TreasureOpenAnime.js

@@ -30,7 +30,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
  * 因为宝箱没有关闭的场景，对于一个宝箱来讲，打开后，要么销毁，要么保留当时的状态。所以不做关闭方面的兼容处理
  */
 var TreasurePluginOpenAnime = /*#__PURE__*/function () {
-  function TreasurePluginOpenAnime(param) {
+  function TreasurePluginOpenAnime(params) {
     var _this = this;
 
     _classCallCheck(this, TreasurePluginOpenAnime);
@@ -57,13 +57,18 @@ var TreasurePluginOpenAnime = /*#__PURE__*/function () {
           obj.material.opacity = opacity;
         });
         _this.five.needsRender = true;
-      }).play();
+      }).play().onComplete(function () {
+        var _this$params$onComple, _this$params;
+
+        return (_this$params$onComple = (_this$params = _this.params).onComplete) === null || _this$params$onComple === void 0 ? void 0 : _this$params$onComple.call(_this$params);
+      });
     });
 
-    this.five = param.five;
-    this.treasureGroup = param.treasureGroup;
+    this.five = params.five;
+    this.params = params;
+    this.treasureGroup = params.treasureGroup;
     var mixer = new THREE.AnimationMixer(this.treasureGroup);
-    this.action = mixer.clipAction(param.animationClip);
+    this.action = mixer.clipAction(params.animationClip);
     this.action.setLoop(THREE.LoopOnce, 1);
     this.action.clampWhenFinished = true;
   }

package/plugins/TreasurePlugin/constants.d.ts

@@ -1,12 +1,33 @@
-/** CDN 资源 Base URL */
-export declare const TREASURE_BASE_URL = "//vrlab-public.ljcdn.com/release/static/image/release/baoxiang_xiaobei/1/";
-/** FBX 文件地址，注意 FBX 文件中写入了默认贴图地址 */
-export declare const TREASURE_FBX_URL: string;
-/** 宝箱脸部的动画贴图 */
-export declare const TREASURE_FACE_ANIMATION_URLS: string[];
-/** 宝箱类型 */
-export declare enum TreasureType {
-    TreasureType1 = 0,
-    TreasureType2 = 1
+import { TreasureObjectConfig } from './TreasureObject';
+/** 默认的宝箱对象类型：FBX */
+export declare const DEFAULT_TREASURE_OBJECT_TYPE = "FBX";
+/** 默认的宝箱对象地址 */
+export declare const DEFAULT_TREASURE_OBJECT_URL: string;
+/** 默认的宝箱对象 */
+export declare const DEFAULT_TREASURE_OBJECT: {
+    url: string;
+    type: string;
+};
+/** 默认宝箱脸部动画贴图资源 */
+export declare const DEFAULT_TREASURE_FACE_ANIMATION_URLS: string[];
+/** 黄色宝箱盒子贴图地址 */
+export declare const TREASURE_BOX_TEXTURE_YELLOW_URL: string;
+/** 红色宝箱盒子贴图地址 */
+export declare const TREASURE_BOX_TEXTURE_RED_URL: string;
+export declare enum TREASURE_TYPE {
+    YELLOW = 0,
+    RED = 1
 }
-export declare const DEFAULT_TREASURE_TYPE: TreasureType;
+export declare const DEFAULT_TREASURE_CONFIG: TreasureObjectConfig;
+/** 内置宝箱类型于宝箱资源的映射关系 */
+export declare const DEFAULT_TREASURE_CONFIGS: ({
+    type: TREASURE_TYPE;
+    config: TreasureObjectConfig;
+} | {
+    type: TREASURE_TYPE;
+    config: {
+        objectUrl: string;
+        boxTextureUrl: string;
+        faceAnimeTextureUrls: string[];
+    };
+})[];

package/plugins/TreasurePlugin/constants.js

@@ -3,28 +3,63 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TreasureType = exports.TREASURE_FBX_URL = exports.TREASURE_FACE_ANIMATION_URLS = exports.TREASURE_BASE_URL = exports.DEFAULT_TREASURE_TYPE = void 0;
+exports.TREASURE_TYPE = exports.TREASURE_BOX_TEXTURE_YELLOW_URL = exports.TREASURE_BOX_TEXTURE_RED_URL = exports.DEFAULT_TREASURE_OBJECT_URL = exports.DEFAULT_TREASURE_OBJECT_TYPE = exports.DEFAULT_TREASURE_OBJECT = exports.DEFAULT_TREASURE_FACE_ANIMATION_URLS = exports.DEFAULT_TREASURE_CONFIGS = exports.DEFAULT_TREASURE_CONFIG = void 0;
 
 /** CDN 资源 Base URL */
 var TREASURE_BASE_URL = '//vrlab-public.ljcdn.com/release/static/image/release/baoxiang_xiaobei/1/';
-/** FBX 文件地址，注意 FBX 文件中写入了默认贴图地址 */
+/** 默认的宝箱对象类型：FBX */
 
-exports.TREASURE_BASE_URL = TREASURE_BASE_URL;
-var TREASURE_FBX_URL = TREASURE_BASE_URL + 'baoxiang_xiaobei.fbx';
-/** 宝箱脸部的动画贴图 */
+var DEFAULT_TREASURE_OBJECT_TYPE = 'FBX';
+/** 默认的宝箱对象地址 */
 
-exports.TREASURE_FBX_URL = TREASURE_FBX_URL;
-var TREASURE_FACE_ANIMATION_URLS = [TREASURE_BASE_URL + 'faces/1.png', TREASURE_BASE_URL + 'faces/2.png', TREASURE_BASE_URL + 'faces/3.png', TREASURE_BASE_URL + 'faces/4.png', TREASURE_BASE_URL + 'faces/5.png'];
-/** 宝箱类型 */
+exports.DEFAULT_TREASURE_OBJECT_TYPE = DEFAULT_TREASURE_OBJECT_TYPE;
+var DEFAULT_TREASURE_OBJECT_URL = TREASURE_BASE_URL + 'baoxiang_xiaobei.fbx';
+/** 默认的宝箱对象 */
 
-exports.TREASURE_FACE_ANIMATION_URLS = TREASURE_FACE_ANIMATION_URLS;
-var TreasureType;
-exports.TreasureType = TreasureType;
+exports.DEFAULT_TREASURE_OBJECT_URL = DEFAULT_TREASURE_OBJECT_URL;
+var DEFAULT_TREASURE_OBJECT = {
+  url: DEFAULT_TREASURE_OBJECT_URL,
+  type: DEFAULT_TREASURE_OBJECT_TYPE
+};
+/** 默认宝箱脸部动画贴图资源 */
 
-(function (TreasureType) {
-  TreasureType[TreasureType["TreasureType1"] = 0] = "TreasureType1";
-  TreasureType[TreasureType["TreasureType2"] = 1] = "TreasureType2";
-})(TreasureType || (exports.TreasureType = TreasureType = {}));
+exports.DEFAULT_TREASURE_OBJECT = DEFAULT_TREASURE_OBJECT;
+var DEFAULT_TREASURE_FACE_ANIMATION_URLS = [TREASURE_BASE_URL + 'faces/1.png', TREASURE_BASE_URL + 'faces/2.png', TREASURE_BASE_URL + 'faces/3.png', TREASURE_BASE_URL + 'faces/4.png', TREASURE_BASE_URL + 'faces/5.png'];
+/** 黄色宝箱盒子贴图地址 */
 
-var DEFAULT_TREASURE_TYPE = TreasureType.TreasureType1;
-exports.DEFAULT_TREASURE_TYPE = DEFAULT_TREASURE_TYPE;
+exports.DEFAULT_TREASURE_FACE_ANIMATION_URLS = DEFAULT_TREASURE_FACE_ANIMATION_URLS;
+var TREASURE_BOX_TEXTURE_YELLOW_URL = TREASURE_BASE_URL + 'box_Base_Color.png';
+/** 红色宝箱盒子贴图地址 */
+
+exports.TREASURE_BOX_TEXTURE_YELLOW_URL = TREASURE_BOX_TEXTURE_YELLOW_URL;
+var TREASURE_BOX_TEXTURE_RED_URL = TREASURE_BASE_URL + 'box_Base_Color_red.png';
+exports.TREASURE_BOX_TEXTURE_RED_URL = TREASURE_BOX_TEXTURE_RED_URL;
+var TREASURE_TYPE;
+exports.TREASURE_TYPE = TREASURE_TYPE;
+
+(function (TREASURE_TYPE) {
+  TREASURE_TYPE[TREASURE_TYPE["YELLOW"] = 0] = "YELLOW";
+  TREASURE_TYPE[TREASURE_TYPE["RED"] = 1] = "RED";
+})(TREASURE_TYPE || (exports.TREASURE_TYPE = TREASURE_TYPE = {}));
+
+var DEFAULT_TREASURE_CONFIG = {
+  scale: 1,
+  boxTextureUrl: undefined,
+  objectUrl: DEFAULT_TREASURE_OBJECT_URL,
+  faceAnimeTextureUrls: DEFAULT_TREASURE_FACE_ANIMATION_URLS
+};
+/** 内置宝箱类型于宝箱资源的映射关系 */
+
+exports.DEFAULT_TREASURE_CONFIG = DEFAULT_TREASURE_CONFIG;
+var DEFAULT_TREASURE_CONFIGS = [{
+  type: TREASURE_TYPE.YELLOW,
+  config: DEFAULT_TREASURE_CONFIG
+}, {
+  type: TREASURE_TYPE.RED,
+  config: {
+    objectUrl: DEFAULT_TREASURE_OBJECT_URL,
+    boxTextureUrl: TREASURE_BOX_TEXTURE_RED_URL,
+    faceAnimeTextureUrls: DEFAULT_TREASURE_FACE_ANIMATION_URLS
+  }
+}];
+exports.DEFAULT_TREASURE_CONFIGS = DEFAULT_TREASURE_CONFIGS;

package/plugins/TreasurePlugin/index.d.ts

@@ -2,10 +2,10 @@ import { FivePlugin } from '@realsee/five';
 import { TreasurePluginController, TreasurePluginParameterType } from './Controller';
 export declare const TreasurePlugin: FivePlugin<TreasurePluginParameterType, TreasurePluginReturnType>;
 export default TreasurePlugin;
+export { TREASURE_TYPE } from './constants';
 export declare type TreasurePluginReturnType = TreasurePluginController;
-export type { TreasureType } from './constants';
-export type { TreasurePluginItemData, TreasurePluginData } from './Controller';
+export type { TreasurePluginItemData, TreasurePluginData, TreasurePluginItemConfigData } from './Controller';
 export type { TreasurePluginController, TreasurePluginParameterType, TreasurePluginEvents } from './Controller';
-export type { TreasureObject, TreasureObjectParam } from './TreasureObject';
-export type { TreasureFaceAnime, TreasureFaceAnimeParam } from './TreasureFaceAnime';
-export type { TreasurePluginOpenAnime, TreasureOpenAnimeParam } from './TreasureOpenAnime';
+export type { TreasureObject, TreasureObjectConfig, TreasureObjectParams } from './TreasureObject';
+export type { TreasureFaceAnime, TreasureFaceAnimeParams } from './TreasureFaceAnime';
+export type { TreasurePluginOpenAnime, TreasureOpenAnimeParams } from './TreasureOpenAnime';

package/plugins/TreasurePlugin/index.js

@@ -3,10 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "TREASURE_TYPE", {
+  enumerable: true,
+  get: function get() {
+    return _constants.TREASURE_TYPE;
+  }
+});
 exports["default"] = exports.TreasurePlugin = void 0;
 
 var _Controller = require("./Controller");
 
+var _constants = require("./constants");
+
 var TreasurePlugin = function TreasurePlugin(five) {
   return new _Controller.TreasurePluginController(five);
 };

package/plugins/floorplan/ModelFloorplanPlugin/components/Camera.js

@@ -32,9 +32,11 @@ function Camera(props) {
     top: topRatio * 100 + '%'
   };
   var lng = props.lastPanoramaLongitude;
-  var rotate = -(0, _rad2Deg["default"])(lng) + 45;
+  var rotate = -(0, _rad2Deg["default"])(lng) + 45; // TODO: 统一这里的判断条件，目前写了多处
+
   var bodyWidth = document.body.clientWidth;
-  var size = bodyWidth < 500 ? 24 : 37;
+  var bodyHeight = document.body.clientHeight;
+  var size = bodyWidth < 500 || bodyHeight < 500 ? 17 : 37;
   var rotateBaseStyle = {
     position: 'absolute',
     left: "".concat((0, _px2rem["default"])(-15)),

package/plugins/floorplan/ModelFloorplanPlugin/components/Compass.js

@@ -29,8 +29,9 @@ function Compass(props) {
     position: 'absolute',
     left: '50%',
     top: "".concat((0, _px2rem["default"])(-46)),
+    willChange: 'opacity',
     transformOrigin: "center ".concat((0, _px2rem["default"])(184)),
-    transform: "translateX(-50%) rotate(".concat(-rotate + 90, "deg)")
+    transform: "translateX(-50%) translateZ(10px) rotate(".concat(-rotate + 90, "deg)")
   };
   var imageStyle = {
     width: '100%',

package/plugins/floorplan/ModelFloorplanPlugin/components/NowFloor/RoomLabels.js

@@ -61,12 +61,15 @@ function RoomLabel(props) {
     flexFlow: 'column',
     alignItems: 'center',
     fontSize: "".concat((0, _px2rem["default"])(10)),
+    lineHeight: "".concat((0, _px2rem["default"])(15)),
     color: '#fff',
     transform: 'translate(-50%, -50%)',
     whiteSpace: 'nowrap'
-  };
+  }; // TODO: 统一这里的判断条件，目前写了多处
+
   var bodyWidth = document.body.clientWidth;
-  var fontSize = bodyWidth < 500 ? 10 : 14;
+  var bodyHeight = document.body.clientHeight;
+  var fontSize = bodyWidth < 500 || bodyHeight < 500 ? 10 : 14;
   var roomNameStyle = {
     fontSize: "".concat((0, _px2rem["default"])(fontSize))
   };