@realsee/dnalogel 0.1.7-alpha.6 → 0.1.7-alpha.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@realsee/dnalogel",
-  "version": "0.1.7-alpha.6",
+  "version": "0.1.7-alpha.7",
   "description": "如视前端 Components、Plugins 兼部分 SDKs \"Dnalogel\" 库。",
   "author": "BEIKE REALSEE TECHNOLOGY (HK) LIMITED",
   "peerDependencies": {

package/plugins/CSS3DRenderPlugin/index.js

@@ -47,6 +47,8 @@ var _centerPoint = _interopRequireDefault(require("../../shared-utils/three/cent
 
 var _transformPositionToVector = _interopRequireDefault(require("../../shared-utils/three/transformPositionToVector3"));
 
+var _createResizeObserver = _interopRequireDefault(require("./utils/createResizeObserver"));
+
 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; }
@@ -125,13 +127,19 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
     var render = function () {
       if (!inited) {
         var css3DRendererSetSize = function css3DRendererSetSize() {
-          var rendererWidth = (0, _evenNumber["default"])(fiveElement.clientWidth);
-          var rendererHeight = (0, _evenNumber["default"])(fiveElement.clientHeight);
+          // 这里evenNumber策略是遇到奇数会加1，不知道为啥会触发滚动条显示，导致fiveElement变小，fiveElement变小又触发了这里的resize，宽高变小，滚动条消失，然后又触发resize。。。无限循环
+          // 为了规避上面这种情况，evenNumber设置了一个参数，遇到奇数可选择减一
+          var rendererWidth = (0, _evenNumber["default"])(fiveElement.clientWidth, {
+            smaller: true
+          });
+          var rendererHeight = (0, _evenNumber["default"])(fiveElement.clientHeight, {
+            smaller: true
+          });
           css3DRenderer.setSize(rendererWidth, rendererHeight);
         };
 
         css3DRendererSetSize();
-        resizeObserver = new ResizeObserver(css3DRendererSetSize);
+        resizeObserver = (0, _createResizeObserver["default"])(css3DRendererSetSize, fiveElement);
         css3DRenderer.domElement.style.position = 'absolute';
         css3DRenderer.domElement.style.top = '0';
         css3DRenderer.domElement.style.userSelect = 'none';
@@ -144,10 +152,10 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
         };
 
         return function () {
-          var _resizeObserver;
+          var _resizeObserver, _resizeObserver$obser;
 
           scene.add(css3DObject);
-          (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.observe(fiveElement);
+          (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : (_resizeObserver$obser = _resizeObserver.observe) === null || _resizeObserver$obser === void 0 ? void 0 : _resizeObserver$obser.call(_resizeObserver);
           renderEveryFrame();
 
           if (mode === 'behind' && mesh) {
@@ -190,9 +198,9 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
         if (mode === 'behind') state.behindMode = undefined;
 
         if (!state.behindMode && !state.frontMode) {
-          var _resizeObserver2;
+          var _resizeObserver2, _resizeObserver2$unob;
 
-          (_resizeObserver2 = resizeObserver) === null || _resizeObserver2 === void 0 ? void 0 : _resizeObserver2.unobserve(fiveElement);
+          (_resizeObserver2 = resizeObserver) === null || _resizeObserver2 === void 0 ? void 0 : (_resizeObserver2$unob = _resizeObserver2.unobserve) === null || _resizeObserver2$unob === void 0 ? void 0 : _resizeObserver2$unob.call(_resizeObserver2);
         }
       }
 
@@ -209,9 +217,6 @@ var CSS3DRenderPlugin = function CSS3DRenderPlugin(five) {
       state.disposeCallbacks.push(dispose);
     }
 
-    console.log({
-      autoRender: autoRender
-    });
     if (autoRender) render();
     return {
       container: container,

package/plugins/CSS3DRenderPlugin/utils/createResizeObserver.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @description: 究极简陋的 ResizeObserver polyfill
+ */
+export default function createResizeObserver(func: () => any, element?: HTMLElement): {
+    observe: () => void;
+    unobserve: () => void;
+};

package/plugins/CSS3DRenderPlugin/utils/createResizeObserver.js

@@ -0,0 +1,34 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = createResizeObserver;
+
+/**
+ * @description: 究极简陋的 ResizeObserver polyfill
+ */
+function createResizeObserver(func, element) {
+  if (!element || typeof ResizeObserver === 'undefined') {
+    return {
+      observe: function observe() {
+        return window.addEventListener('resize', func);
+      },
+      unobserve: function unobserve() {
+        return window.removeEventListener('resize', func);
+      }
+    };
+  } else {
+    var observer = new ResizeObserver(func);
+    return {
+      observe: function observe() {
+        return observer.observe(element);
+      },
+      unobserve: function unobserve() {
+        return observer.unobserve(element);
+      }
+    };
+  }
+}

package/shared-utils/math/evenNumber.d.ts

@@ -1 +1,3 @@
-export default function evenNumber(num: number): number;
+export default function evenNumber(num: number, config?: {
+    smaller?: boolean;
+}): number;

package/shared-utils/math/evenNumber.js

@@ -7,7 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = evenNumber;
 
-function evenNumber(num) {
+require("core-js/modules/es.number.constructor.js");
+
+function evenNumber(num, config) {
   var roundNum = Math.round(num);
-  return roundNum % 2 === 0 ? roundNum : roundNum + 1;
+  return roundNum % 2 === 0 ? roundNum : roundNum + Number(config !== null && config !== void 0 && config.smaller ? -1 : 1);
 }