@galacean/effects-threejs 1.6.0-beta.0 → 1.6.0-beta.1

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v1.6.0-beta.0
+ * Version: v1.6.0-beta.1
  */
 
 'use strict';
@@ -13542,6 +13542,14 @@ var InteractVFXItem = /** @class */ (function (_super) {
     function InteractVFXItem(props, composition) {
         var _a;
         var _this = _super.call(this, props, composition) || this;
+        /**
+         * 拖拽的惯性衰减系数，范围[0, 1], 越大惯性越强
+         */
+        _this.downgrade = 0.95;
+        /**
+         * 拖拽的距离映射系数，越大越容易拖动
+         */
+        _this.dragRatio = [1, 1];
         _this.engine = (_a = _this.composition) === null || _a === void 0 ? void 0 : _a.getEngine();
         return _this;
     }
@@ -13552,8 +13560,23 @@ var InteractVFXItem = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(InteractVFXItem.prototype, "enable", {
+        get: function () {
+            return this.enabled;
+        },
+        set: function (enable) {
+            this.enabled = enable;
+            if (!enable) {
+                // 立刻停止惯性滑动
+                this.bouncingArg = null;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
     InteractVFXItem.prototype.onConstructed = function (options) {
         this.ui = options.content;
+        this.enabled = true;
     };
     InteractVFXItem.prototype.onLifetimeBegin = function (composition) {
         var _a, _b, _c;
@@ -13572,9 +13595,8 @@ var InteractVFXItem = /** @class */ (function (_super) {
         if (!this.dragEvent || !this.bouncingArg) {
             return;
         }
-        var downgrade = 0.95;
-        this.bouncingArg.vx *= downgrade;
-        this.bouncingArg.vy *= downgrade;
+        this.bouncingArg.vx *= this.downgrade;
+        this.bouncingArg.vy *= this.downgrade;
         this.bouncingArg.dy += this.bouncingArg.vy;
         this.bouncingArg.dx += this.bouncingArg.vx;
         if (shouldIgnoreBouncing(this.bouncingArg)) {
@@ -13610,7 +13632,7 @@ var InteractVFXItem = /** @class */ (function (_super) {
         };
     };
     InteractVFXItem.prototype.getHitTestParams = function () {
-        if (!this.clickable) {
+        if (!this.clickable || !this.canInteract()) {
             return;
         }
         var behavior = this.ui.options.behavior;
@@ -13646,13 +13668,13 @@ var InteractVFXItem = /** @class */ (function (_super) {
         var dragEvent;
         var handlerMap = {
             touchstart: function (event) {
-                var _a, _b;
-                if (!((_a = _this.composition) === null || _a === void 0 ? void 0 : _a.interactive)) {
+                var _a;
+                if (!_this.canInteract()) {
                     return;
                 }
                 _this.dragEvent = null;
                 _this.bouncingArg = null;
-                var camera = (_b = _this.composition) === null || _b === void 0 ? void 0 : _b.camera;
+                var camera = (_a = _this.composition) === null || _a === void 0 ? void 0 : _a.camera;
                 dragEvent = {
                     x: event.x,
                     y: event.y,
@@ -13667,8 +13689,7 @@ var InteractVFXItem = /** @class */ (function (_super) {
                 _this.bouncingArg = event;
             },
             touchend: function (event) {
-                var _a;
-                if (!((_a = _this.composition) === null || _a === void 0 ? void 0 : _a.interactive)) {
+                if (!_this.canInteract()) {
                     return;
                 }
                 var bouncingArg = _this.bouncingArg;
@@ -13695,36 +13716,40 @@ var InteractVFXItem = /** @class */ (function (_super) {
         // OVERRIDE
     };
     InteractVFXItem.prototype.handleDragMove = function (evt, event) {
-        var _a, _b, _c;
-        if (!(evt && evt.cameraParam) || !((_a = this.composition) === null || _a === void 0 ? void 0 : _a.interactive)) {
+        var _a, _b;
+        if (!(evt === null || evt === void 0 ? void 0 : evt.cameraParam) || !this.canInteract() || !this.composition) {
             return;
         }
         var options = this.ui.options;
-        var _d = evt.cameraParam, position = _d.position, fov = _d.fov;
+        var _c = evt.cameraParam, position = _c.position, fov = _c.fov;
         var dy = event.dy;
         var dx = event.dx * event.width / event.height;
         var depth = position[2];
         var sp = Math.tan(fov * Math.PI / 180 / 2) * Math.abs(depth);
         var height = dy * sp;
         var width = dx * sp;
-        var nx = position[0] - width;
-        var ny = position[1] - height;
+        var nx = position[0] - this.dragRatio[0] * width;
+        var ny = position[1] - this.dragRatio[1] * height;
         if (options.dxRange) {
-            var _e = __read$3(options.dxRange, 2), min = _e[0], max = _e[1];
+            var _d = __read$3(options.dxRange, 2), min = _d[0], max = _d[1];
             nx = clamp$1(nx, min, max);
             if (nx !== min && nx !== max && min !== max) {
-                (_b = event.origin) === null || _b === void 0 ? void 0 : _b.preventDefault();
+                (_a = event.origin) === null || _a === void 0 ? void 0 : _a.preventDefault();
             }
         }
         if (options.dyRange) {
-            var _f = __read$3(options.dyRange, 2), min = _f[0], max = _f[1];
+            var _e = __read$3(options.dyRange, 2), min = _e[0], max = _e[1];
             ny = clamp$1(ny, min, max);
             if (ny !== min && ny !== max && min !== max) {
-                (_c = event.origin) === null || _c === void 0 ? void 0 : _c.preventDefault();
+                (_b = event.origin) === null || _b === void 0 ? void 0 : _b.preventDefault();
             }
         }
         this.composition.camera.position = new Vector3(nx, ny, depth);
     };
+    InteractVFXItem.prototype.canInteract = function () {
+        var _a;
+        return Boolean((_a = this.composition) === null || _a === void 0 ? void 0 : _a.interactive) && this.enabled;
+    };
     return InteractVFXItem;
 }(VFXItem));
 function shouldIgnoreBouncing(arg, mul) {
@@ -24030,27 +24055,28 @@ var AssetManager = /** @class */ (function () {
     AssetManager.prototype.loadScene = function (url, renderer, options) {
         var _a, _b, _c;
         return __awaiter(this, void 0, void 0, function () {
-            var rawJSON, assetUrl, startTime, timeInfos, gpuInstance, asyncShaderCompile, compressedTexture, loadTimer, cancelLoading, waitPromise, hookTimeInfo, loadResourcePromise;
+            var rawJSON, assetUrl, startTime, timeInfoMessages, gpuInstance, asyncShaderCompile, compressedTexture, timeInfos, loadTimer, cancelLoading, waitPromise, hookTimeInfo, loadResourcePromise;
             var _this = this;
             return __generator(this, function (_d) {
                 assetUrl = isString(url) ? url : this.id;
                 startTime = performance.now();
-                timeInfos = [];
+                timeInfoMessages = [];
                 gpuInstance = renderer === null || renderer === void 0 ? void 0 : renderer.engine.gpuCapability;
                 asyncShaderCompile = (_b = (_a = gpuInstance === null || gpuInstance === void 0 ? void 0 : gpuInstance.detail) === null || _a === void 0 ? void 0 : _a.asyncShaderCompile) !== null && _b !== void 0 ? _b : false;
                 compressedTexture = (_c = gpuInstance === null || gpuInstance === void 0 ? void 0 : gpuInstance.detail.compressedTexture) !== null && _c !== void 0 ? _c : 0;
+                timeInfos = {};
                 cancelLoading = false;
                 waitPromise = new Promise(function (resolve, reject) {
                     loadTimer = window.setTimeout(function () {
                         cancelLoading = true;
                         _this.removeTimer(loadTimer);
                         var totalTime = performance.now() - startTime;
-                        reject("Load time out: totalTime: ".concat(totalTime.toFixed(4), "ms ").concat(timeInfos.join(' '), ", url: ").concat(assetUrl));
+                        reject("Load time out: totalTime: ".concat(totalTime.toFixed(4), "ms ").concat(timeInfoMessages.join(' '), ", url: ").concat(assetUrl));
                     }, _this.timeout * 1000);
                     _this.timers.push(loadTimer);
                 });
                 hookTimeInfo = function (label, func) { return __awaiter(_this, void 0, void 0, function () {
-                    var st, result, e_1;
+                    var st, result, time, e_1;
                     return __generator(this, function (_a) {
                         switch (_a.label) {
                             case 0:
@@ -24062,7 +24088,9 @@ var AssetManager = /** @class */ (function () {
                                 return [4 /*yield*/, func()];
                             case 2:
                                 result = _a.sent();
-                                timeInfos.push("[".concat(label, ": ").concat((performance.now() - st).toFixed(2), "]"));
+                                time = performance.now() - st;
+                                timeInfoMessages.push("[".concat(label, ": ").concat(time.toFixed(2), "]"));
+                                timeInfos[label] = time;
                                 return [2 /*return*/, result];
                             case 3:
                                 e_1 = _a.sent();
@@ -24121,7 +24149,7 @@ var AssetManager = /** @class */ (function () {
                                 return [4 /*yield*/, Promise.all([
                                         hookTimeInfo('processBins', function () { return _this.processBins(bins_1); }),
                                         hookTimeInfo('processImages', function () { return _this.processImages(images_2, usedImages_1, compressedTexture); }),
-                                        hookTimeInfo("".concat(asyncShaderCompile ? 'async' : 'sync', " compile"), function () { return _this.precompile(compositions_1, pluginSystem_1, renderer, options); }),
+                                        hookTimeInfo("".concat(asyncShaderCompile ? 'async' : 'sync', "Compile"), function () { return _this.precompile(compositions_1, pluginSystem_1, renderer, options); }),
                                     ])];
                             case 8:
                                 _d = __read$3.apply(void 0, [_e.sent(), 2]), loadedBins_1 = _d[0], loadedImages_1 = _d[1];
@@ -24133,6 +24161,7 @@ var AssetManager = /** @class */ (function () {
                                 loadedTextures = _e.sent();
                                 jsonScene_1.compositions = this.updateSceneData(jsonScene_1.compositions);
                                 scene = {
+                                    timeInfos: timeInfos,
                                     url: url,
                                     renderLevel: this.options.renderLevel,
                                     storage: {},
@@ -24151,11 +24180,13 @@ var AssetManager = /** @class */ (function () {
                                 _e.label = 12;
                             case 12:
                                 totalTime = performance.now() - startTime;
-                                logger.info("Load asset: totalTime: ".concat(totalTime.toFixed(4), "ms ").concat(timeInfos.join(' '), ", url: ").concat(assetUrl));
+                                logger.info("Load asset: totalTime: ".concat(totalTime.toFixed(4), "ms ").concat(timeInfoMessages.join(' '), ", url: ").concat(assetUrl));
                                 window.clearTimeout(loadTimer);
                                 this.removeTimer(loadTimer);
                                 scene.totalTime = totalTime;
                                 scene.startTime = startTime;
+                                // 各部分分段时长
+                                scene.timeInfos = timeInfos;
                                 return [2 /*return*/, scene];
                         }
                     });
@@ -25003,7 +25034,7 @@ var Composition = /** @class */ (function () {
      * @param props - composition 的创建参数
      */
     function Composition(props, scene) {
-        var _a;
+        var _a, _b;
         /**
          * 动画播放速度
          */
@@ -25032,7 +25063,7 @@ var Composition = /** @class */ (function () {
         this.paused = false;
         this.lastVideoUpdateTime = 0;
         this.postLoaders = [];
-        var _b = props.reusable, reusable = _b === void 0 ? false : _b, _c = props.speed, speed = _c === void 0 ? 1 : _c, _d = props.baseRenderOrder, baseRenderOrder = _d === void 0 ? 0 : _d, renderer = props.renderer, onPlayerPause = props.onPlayerPause, onMessageItem = props.onMessageItem, onEnd = props.onEnd, event = props.event, width = props.width, height = props.height;
+        var _c = props.reusable, reusable = _c === void 0 ? false : _c, _d = props.speed, speed = _d === void 0 ? 1 : _d, _e = props.baseRenderOrder, baseRenderOrder = _e === void 0 ? 0 : _e, renderer = props.renderer, onPlayerPause = props.onPlayerPause, onMessageItem = props.onMessageItem, onEnd = props.onEnd, event = props.event, width = props.width, height = props.height;
         this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         scene.jsonScene.imgUsage = undefined;
         if (reusable) {
@@ -25040,7 +25071,7 @@ var Composition = /** @class */ (function () {
             scene.textures = undefined;
             scene.consumed = true;
         }
-        var _e = this.compositionSourceManager, sourceContent = _e.sourceContent, pluginSystem = _e.pluginSystem, imgUsage = _e.imgUsage, totalTime = _e.totalTime, renderLevel = _e.renderLevel, refCompositionProps = _e.refCompositionProps;
+        var _f = this.compositionSourceManager, sourceContent = _f.sourceContent, pluginSystem = _f.pluginSystem, imgUsage = _f.imgUsage, totalTime = _f.totalTime, renderLevel = _f.renderLevel, refCompositionProps = _f.refCompositionProps;
         assertExist(sourceContent);
         this.refCompositionProps = refCompositionProps;
         var vfxItem = new CompVFXItem(sourceContent, this);
@@ -25057,7 +25088,7 @@ var Composition = /** @class */ (function () {
         this.renderer = renderer;
         this.texInfo = imageUsage !== null && imageUsage !== void 0 ? imageUsage : {};
         this.event = event;
-        this.statistic = { loadTime: totalTime !== null && totalTime !== void 0 ? totalTime : 0, loadStart: (_a = scene.startTime) !== null && _a !== void 0 ? _a : 0, firstFrameTime: 0 };
+        this.statistic = { loadTime: totalTime !== null && totalTime !== void 0 ? totalTime : 0, loadStart: (_a = scene.startTime) !== null && _a !== void 0 ? _a : 0, firstFrameTime: 0, precompileTime: (_b = scene.timeInfos['asyncCompile']) !== null && _b !== void 0 ? _b : scene.timeInfos['syncCompile'] };
         this.reusable = reusable;
         this.speed = speed;
         this.renderLevel = renderLevel;
@@ -27447,7 +27478,7 @@ Geometry.create = function (engine, options) {
 Mesh.create = function (engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "1.6.0-beta.0";
+var version = "1.6.0-beta.1";
 logger.info('THREEJS plugin version: ' + version);
 
 exports.AbstractPlugin = AbstractPlugin;