targetj 1.1.3 → 1.1.4

package/build/App.js

@@ -28,6 +28,7 @@ import { TModelUtil } from "./TModelUtil.js";
 import "./ParticleTModel.js";
 var tApp;
 var queuedAppCalls = [];
+var appStarting = false;
 var AppFn = function AppFn() {
   var my = {};
   my.throttle = 0;
@@ -250,12 +251,10 @@ var App = function App(firstChild) {
   }
   var tmodel = firstChild instanceof TModel ? firstChild : TargetExecutor.createTModel("App", firstChild);
   if (!((_tApp2 = tApp) !== null && _tApp2 !== void 0 && _tApp2.tRoot)) {
-    if (document.readyState === "loading") {
-      queuedAppCalls.push(tmodel);
-      return tmodel;
+    queuedAppCalls.push(tmodel);
+    if (document.readyState !== "loading") {
+      ensureRunning();
     }
-    ensureRunning();
-    tApp.tRoot.addChild(tmodel);
     return tmodel;
   }
   tApp.tRoot.addChild(tmodel);
@@ -400,13 +399,39 @@ var getDomTModelById = function getDomTModelById(id) {
 if (typeof window !== "undefined") {
   window.t = window.t || getTModelById;
 }
-var runApp = function runApp() {
-  if (tApp) {
-    return;
-  }
-  tApp = AppFn();
-  tApp.init().start();
-};
+var runApp = /*#__PURE__*/function () {
+  var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
+    return _regeneratorRuntime().wrap(function _callee5$(_context5) {
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          if (!(tApp || appStarting)) {
+            _context5.next = 2;
+            break;
+          }
+          return _context5.abrupt("return");
+        case 2:
+          appStarting = true;
+          _context5.prev = 3;
+          _context5.next = 6;
+          return TUtil.initWebGpu();
+        case 6:
+          tApp = AppFn();
+          _context5.next = 9;
+          return tApp.init().start();
+        case 9:
+          _context5.prev = 9;
+          appStarting = false;
+          return _context5.finish(9);
+        case 12:
+        case "end":
+          return _context5.stop();
+      }
+    }, _callee5, null, [[3,, 9, 12]]);
+  }));
+  return function runApp() {
+    return _ref8.apply(this, arguments);
+  };
+}();
 if (typeof document !== "undefined") {
   if (document.readyState === "loading") {
     document.addEventListener("DOMContentLoaded", runApp);

package/build/ParticleExplode.js

@@ -39,7 +39,8 @@ var ParticleExplode = /*#__PURE__*/function () {
         return !(typeof color === 'string' && color.trim() !== '');
       };
       var target = (_tmodel$targets$key = tmodel.targets[key]) !== null && _tmodel$targets$key !== void 0 ? _tmodel$targets$key : {};
-      var renderer = (_target$renderer = target.renderer) !== null && _target$renderer !== void 0 ? _target$renderer : "gpu";
+      var requestedRenderer = (_target$renderer = target.renderer) !== null && _target$renderer !== void 0 ? _target$renderer : "gpu";
+      var renderer = requestedRenderer === "gpu" && !TUtil.webGpuAvailable ? "dom" : requestedRenderer;
       if (renderer !== "gpu" && renderer !== "dom") {
         throw new Error("Unsupported explodeChildren renderer: ".concat(renderer));
       }
@@ -80,7 +81,12 @@ var ParticleExplode = /*#__PURE__*/function () {
         fragments: []
       };
       var planned = [];
-      var maxFragments = 20000;
+      var maxFragments = renderer === "gpu" ? 20000 : 300;
+      var autoDomGrid = renderer === "dom" && requestedRenderer === "gpu" && requestedCount === undefined;
+      var domColumns = autoDomGrid ? Math.max(1, Math.min(maxFragments, Math.floor(Math.sqrt(maxFragments * uiWidth / uiHeight)))) : 0;
+      var domRows = autoDomGrid ? Math.max(1, Math.floor(maxFragments / domColumns)) : 0;
+      var domWidth = autoDomGrid ? Math.ceil(uiWidth / domColumns) : 0;
+      var domHeight = autoDomGrid ? Math.ceil(uiHeight / domRows) : 0;
       var epsilon = 1e-7;
       var nextX = 0;
       var rowY = 0;
@@ -88,16 +94,13 @@ var ParticleExplode = /*#__PURE__*/function () {
       while (requestedCount === undefined ? rowY < uiHeight - epsilon : planned.length < requestedCount) {
         var _raw$width, _raw$height, _raw$isInFlow;
         var index = planned.length;
-        if (index >= maxFragments) {
-          throw new RangeError("explodeChildren exceeded ".concat(maxFragments, " fragments. Specify instances or larger dimensions."));
-        }
         var raw = valueFactory ? valueFactory.call(tmodel, index) : sharedDefinition !== null && sharedDefinition !== void 0 ? sharedDefinition : {};
         if (!raw || _typeof(raw) !== "object" || Array.isArray(raw)) {
           throw new TypeError("explodeChildren.value(".concat(index, ") must return a child definition object."));
         }
         var childDefinition = TUtil.cloneTargetDefinition(_objectSpread(_objectSpread({}, raw), {}, {
-          width: (_raw$width = raw.width) !== null && _raw$width !== void 0 ? _raw$width : 20,
-          height: (_raw$height = raw.height) !== null && _raw$height !== void 0 ? _raw$height : 20,
+          width: autoDomGrid ? domWidth : (_raw$width = raw.width) !== null && _raw$width !== void 0 ? _raw$width : 20,
+          height: autoDomGrid ? domHeight : (_raw$height = raw.height) !== null && _raw$height !== void 0 ? _raw$height : 20,
           isInFlow: (_raw$isInFlow = raw.isInFlow) !== null && _raw$isInFlow !== void 0 ? _raw$isInFlow : false
         }));
         var requestedWidth = resolveDimension("width", childDefinition.width, index);

package/build/ParticleRenderer.js

@@ -64,30 +64,29 @@ var ParticleRenderer = /*#__PURE__*/function () {
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              if (!this.device) {
-                _context.next = 3;
+              if (!(this.device && this.context && this.pipeline && this.bindGroup)) {
+                _context.next = 2;
                 break;
               }
-              this.mountCanvasLayer();
-              return _context.abrupt("return", true);
-            case 3:
+              return _context.abrupt("return", this.mountCanvasLayer());
+            case 2:
               if (this.tmodel.hasDom()) {
-                _context.next = 5;
+                _context.next = 4;
                 break;
               }
               return _context.abrupt("return", false);
-            case 5:
+            case 4:
               if (!this.initializationPromise) {
                 this.initializationPromise = this.initialize().catch(function (error) {
                   _this.initializationPromise = undefined;
                   throw error;
                 });
               }
-              _context.next = 8;
+              _context.next = 7;
               return this.initializationPromise;
+            case 7:
+              return _context.abrupt("return", !!(this.device && this.context && this.pipeline && this.bindGroup));
             case 8:
-              return _context.abrupt("return", !!this.device);
-            case 9:
             case "end":
               return _context.stop();
           }
@@ -106,40 +105,34 @@ var ParticleRenderer = /*#__PURE__*/function () {
         return _regeneratorRuntime().wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              if (navigator.gpu) {
+              if (TUtil.webGpuAvailable) {
                 _context2.next = 2;
                 break;
               }
-              throw new Error("WebGPU is not supported by this browser.");
+              throw new Error("WebGPU is not available.");
             case 2:
-              if (globalThis.GPUBufferUsage) {
-                _context2.next = 4;
-                break;
-              }
-              throw new Error("GPUBufferUsage is not available in this WebGPU environment.");
-            case 4:
               this.createCanvas();
-              _context2.next = 7;
+              _context2.next = 5;
               return navigator.gpu.requestAdapter();
-            case 7:
+            case 5:
               adapter = _context2.sent;
               if (adapter) {
-                _context2.next = 10;
+                _context2.next = 8;
                 break;
               }
               throw new Error("Unable to obtain a WebGPU adapter.");
-            case 10:
-              _context2.next = 12;
+            case 8:
+              _context2.next = 10;
               return adapter.requestDevice();
-            case 12:
+            case 10:
               this.device = _context2.sent;
               this.context = this.canvas.getContext("webgpu");
               if (this.context) {
-                _context2.next = 16;
+                _context2.next = 14;
                 break;
               }
               throw new Error("Unable to obtain a WebGPU canvas context.");
-            case 16:
+            case 14:
               this.format = navigator.gpu.getPreferredCanvasFormat();
               this.resizeCanvas();
               this.context.configure({
@@ -151,7 +144,7 @@ var ParticleRenderer = /*#__PURE__*/function () {
               this.createUniformBuffer();
               this.createExplodeResources();
               this.createPipeline();
-            case 22:
+            case 20:
             case "end":
               return _context2.stop();
           }

package/build/ParticleTModel.js

@@ -210,7 +210,7 @@ var ParticleTModel = /*#__PURE__*/function (_TModel) {
     key: "syncParticleRendererNow",
     value: function () {
       var _syncParticleRendererNow = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-        var key, targetName, transition, applied;
+        var ready, key, targetName, transition, applied;
         return _regeneratorRuntime().wrap(function _callee3$(_context3) {
           while (1) switch (_context3.prev = _context3.next) {
             case 0:
@@ -221,42 +221,52 @@ var ParticleTModel = /*#__PURE__*/function (_TModel) {
               return _context3.abrupt("return", false);
             case 2:
               if (!this.childHandles.length) {
-                _context3.next = 7;
+                _context3.next = 8;
                 break;
               }
               _context3.next = 5;
               return this.particleRenderer.setParticles(this.childHandles);
             case 5:
-              _context3.next = 9;
+              _context3.t0 = _context3.sent;
+              _context3.next = 11;
               break;
-            case 7:
-              _context3.next = 9;
+            case 8:
+              _context3.next = 10;
               return this.particleRenderer.init();
-            case 9:
+            case 10:
+              _context3.t0 = _context3.sent;
+            case 11:
+              ready = _context3.t0;
+              if (ready) {
+                _context3.next = 14;
+                break;
+              }
+              return _context3.abrupt("return", false);
+            case 14:
               key = this.activeChildTransitionKey;
               if (key) {
-                _context3.next = 12;
+                _context3.next = 17;
                 break;
               }
               return _context3.abrupt("return", true);
-            case 12:
+            case 17:
               targetName = TargetUtil.getTargetName(key);
               transition = this.childTransitions[targetName];
               if (transition) {
-                _context3.next = 16;
+                _context3.next = 21;
                 break;
               }
               return _context3.abrupt("return", true);
-            case 16:
-              _context3.next = 18;
+            case 21:
+              _context3.next = 23;
               return this.particleRenderer.setTargetParticles(transition.values, transition.steps, transition.generation);
-            case 18:
+            case 23:
               applied = _context3.sent;
               if (applied && this.childTransitions[targetName] === transition) {
                 this.handleSpecialTargetStep(key);
               }
-              return _context3.abrupt("return", true);
-            case 21:
+              return _context3.abrupt("return", applied);
+            case 26:
             case "end":
               return _context3.stop();
           }
@@ -307,6 +317,9 @@ var ParticleTModel = /*#__PURE__*/function (_TModel) {
   }, {
     key: "getChildrenRenderer",
     value: function getChildrenRenderer() {
+      if (!TUtil.webGpuAvailable) {
+        return "dom";
+      }
       var target = this.targets[TargetUtil.currentTargetName];
       return (target === null || target === void 0 ? void 0 : target.renderer) || "auto";
     }
@@ -1579,7 +1592,7 @@ var ParticleTModel = /*#__PURE__*/function (_TModel) {
   }]);
 }(TModel);
 function isParticleTModel(targets) {
-  if (!targets) {
+  if (!targets || !TUtil.webGpuAvailable) {
     return false;
   }
   for (var _i14 = 0, _Object$entries7 = Object.entries(targets); _i14 < _Object$entries7.length; _i14++) {

package/build/ScheduleUtil.js

@@ -17,6 +17,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { TUtil } from "./TUtil.js";
 import { getRunScheduler, getAnimationManager } from "./App.js";
+import { TargetUtil } from "./TargetUtil.js";
 
 /**
  * 
@@ -172,6 +173,166 @@ var ScheduleUtil = /*#__PURE__*/function () {
       }
       return false;
     }
+  }, {
+    key: "advanceTargetByElapsed",
+    value: function advanceTargetByElapsed(tmodel, key) {
+      var _targetValue$valueLis2;
+      var targetValue = tmodel.targetValues[key];
+      if (!targetValue) {
+        return {
+          step: 0,
+          cycle: 0,
+          valuePointer: 1,
+          done: false
+        };
+      }
+      if (!TUtil.isDefined(targetValue.catchupAt)) {
+        var _targetValue$valueLis;
+        var step = tmodel.getTargetStep(key);
+        var valuePointer = (_targetValue$valueLis = targetValue.valueList) !== null && _targetValue$valueLis !== void 0 && _targetValue$valueLis.length ? tmodel.getValueListPointer(key) : 0;
+        return {
+          step: step,
+          cycle: tmodel.getTargetCycle(key),
+          valuePointer: valuePointer,
+          done: !TargetUtil.isTargetUpdating(tmodel, key)
+        };
+      }
+      var now = TUtil.now();
+      var elapsedMs = now - targetValue.catchupAt;
+      var progress = (_targetValue$valueLis2 = targetValue.valueList) !== null && _targetValue$valueLis2 !== void 0 && _targetValue$valueLis2.length ? ScheduleUtil.advanceValueListTargetByElapsed(tmodel, key, elapsedMs) : ScheduleUtil.advanceSimpleTargetByElapsed(tmodel, key, elapsedMs);
+      if (!progress.done) {
+        targetValue.catchupAt = now - progress.remainingMs;
+      }
+      return progress;
+    }
+  }, {
+    key: "advanceSimpleTargetByElapsed",
+    value: function advanceSimpleTargetByElapsed(tmodel, key, elapsedMs) {
+      var steps = tmodel.getTargetSteps(key);
+      var interval = tmodel.getTargetInterval(key) || 8;
+      var cycles = tmodel.getTargetCycles(key);
+      var step = tmodel.getTargetStep(key);
+      var cycle = tmodel.getTargetCycle(key);
+      var remainingMs = elapsedMs;
+      if (steps <= 0) {
+        return {
+          step: steps,
+          valuePointer: 0,
+          cycle: cycles,
+          done: true,
+          remainingMs: 0
+        };
+      }
+      while (remainingMs > 0 && cycle < cycles) {
+        var remainingSteps = Math.max(steps - step, 0);
+        var remainingSegmentMs = remainingSteps * interval;
+        if (remainingMs >= remainingSegmentMs) {
+          remainingMs -= remainingSegmentMs;
+          cycle++;
+          if (cycle >= cycles) {
+            return {
+              step: steps,
+              valuePointer: 0,
+              cycle: cycles,
+              done: true,
+              remainingMs: remainingMs
+            };
+          }
+          step = 0;
+          continue;
+        }
+        var advancedSteps = TUtil.limit(Math.floor(remainingMs / interval), 0, remainingSteps);
+        step += advancedSteps;
+        remainingMs -= advancedSteps * interval;
+        return {
+          step: step,
+          steps: steps,
+          valuePointer: 0,
+          cycle: cycle,
+          done: false,
+          remainingMs: remainingMs
+        };
+      }
+      return {
+        step: step,
+        steps: steps,
+        valuePointer: 0,
+        cycle: cycle,
+        done: cycle >= cycles,
+        remainingMs: remainingMs
+      };
+    }
+  }, {
+    key: "advanceValueListTargetByElapsed",
+    value: function advanceValueListTargetByElapsed(tmodel, key, elapsedMs) {
+      var targetValue = tmodel.targetValues[key];
+      var valueList = targetValue.valueList;
+      var stepList = targetValue.stepList || [1];
+      var intervalList = targetValue.intervalList || [targetValue.interval || 8];
+      var cycles = tmodel.getTargetCycles(key);
+      var cycle = tmodel.getTargetCycle(key);
+      var valuePointer = tmodel.getValueListPointer(key);
+      var step = tmodel.getTargetStep(key);
+      var remainingMs = elapsedMs;
+      while (cycle < cycles) {
+        while (remainingMs > 0 && valuePointer < valueList.length) {
+          var segmentSteps = stepList[(valuePointer - 1) % stepList.length];
+          var interval = intervalList[(valuePointer - 1) % intervalList.length] || 8;
+          step = TUtil.limit(step, 0, segmentSteps);
+          var remainingSteps = Math.max(segmentSteps - step, 0);
+          var remainingSegmentMs = remainingSteps * interval;
+          if (remainingMs >= remainingSegmentMs) {
+            remainingMs -= remainingSegmentMs;
+            valuePointer++;
+            step = 0;
+            continue;
+          }
+          var advancedSteps = TUtil.limit(Math.floor(remainingMs / interval), 0, remainingSteps);
+          step += advancedSteps;
+          remainingMs -= advancedSteps * interval;
+          return {
+            step: step,
+            steps: segmentSteps,
+            valuePointer: valuePointer,
+            cycle: cycle,
+            done: false,
+            remainingMs: remainingMs
+          };
+        }
+        if (valuePointer >= valueList.length) {
+          cycle++;
+          if (cycle >= cycles) {
+            var finalPointer = valueList.length;
+            var finalStepIndex = Math.max(0, valueList.length - 2);
+            var finalSteps = stepList[finalStepIndex % stepList.length];
+            return {
+              step: finalSteps,
+              steps: finalSteps,
+              valuePointer: finalPointer,
+              cycle: cycles,
+              done: true,
+              remainingMs: remainingMs
+            };
+          }
+          valuePointer = 1;
+          step = 0;
+          if (remainingMs <= 0) {
+            break;
+          }
+          continue;
+        }
+        break;
+      }
+      var currentSteps = stepList[(valuePointer - 1) % stepList.length];
+      return {
+        step: step,
+        steps: currentSteps,
+        valuePointer: valuePointer,
+        cycle: cycle,
+        remainingMs: remainingMs,
+        done: cycle >= cycles
+      };
+    }
   }]);
 }();
 export { ScheduleUtil };