feat: renderTick

packages/entity/index.js

@@ -201,6 +201,13 @@ export class Entity extends decorate(Resource) {
     this.state = this._setInstanceState(this.state, type, instance);
   }
 
+  renderTick(elapsed) {
+    for (const type in this._traits) {
+      const instance = this._traits[type];
+      instance.renderTick(elapsed);
+    }
+  }
+
   removeAllTraits() {
     const types = this.allTraitTypes();
     this.removeTraits(types);

packages/entity/list/index.js

@@ -102,6 +102,13 @@ export class EntityList extends decorate(class {}) {
     }
   }
 
+  renderTick(elapsed) {
+    for (const uuid in this._entities) {
+      const entity = this._entities[uuid];
+      entity.renderTick(elapsed);
+    }
+  }
+
   tick(elapsed) {
     // Run after destruction tickers.
     const finishedTickers = [];

packages/entity/list/view.js

@@ -25,4 +25,8 @@ export class EntityListView extends Container {
     }
   }
 
+  renderTick(elapsed) {
+    this.entityList.renderTick(elapsed);
+  }
+
 }

packages/entity/trait.js

@@ -67,6 +67,8 @@ export class Trait extends decorate(class {}) {
     }
   }
 
+  renderTick(elapsed) {}
+
   tick(elapsed) {}
 
   toJSON() {

packages/entity/traits/positioned.trait.js

@@ -91,7 +91,7 @@ class PositionedBase extends Trait {
     };
   }
 
-  tick(elapsed) {
+  renderTick(elapsed) {
     if (!this.serverPositionDirty) {
       return;
     }

packages/graphics/stage.js

@@ -58,7 +58,6 @@ export class Stage extends decorate(Container) {
     this.element.appendChild(this.renderer.element);
     this.element.appendChild(this.ui);
     this.element.tabIndex = 0;
-    this.on('cameraChanged', this.onCameraChanged, this);
   }
 
   addToDom(parent) {
@@ -102,7 +101,6 @@ export class Stage extends decorate(Container) {
     for (const end of ['pointerup', 'touchend']) {
       this.element.removeEventListener(end, this.onPointerUp);
     }
-    this.off('cameraChanged', this.onCameraChanged);
   }
 
   get displaySize() {
@@ -135,27 +133,6 @@ export class Stage extends decorate(Container) {
     this.element.focus();
   }
 
-  onCameraChanged(oldCamera) {
-    if (oldCamera) {
-      oldCamera.off('realPositionChanged', this.onCameraRealPositionChanged);
-    }
-    if (this.camera) {
-      this.camera.on(
-        'realPositionChanged',
-        this.onCameraRealPositionChanged,
-        this
-      );
-    }
-  }
-
-  onCameraRealPositionChanged() {
-    const inverseOffset = Vector.mul(
-      this.camera.realOffset,
-      Vector.scale(this.scale, -1),
-    );
-    this.position = inverseOffset;
-  }
-
   onPointerDown(event) {
     const stageEvent = this.stageEventFromNativeEvent(event);
     this.emit('pointerDown', stageEvent);
@@ -216,9 +193,16 @@ export class Stage extends decorate(Container) {
     }
   }
 
-  render() {
+  renderTick(elapsed) {
     this.tick(0);
     this.renderer.render(this);
+    if (this.camera) {
+      const inverseOffset = Vector.mul(
+        this.camera.realOffset,
+        Vector.scale(this.scale, -1),
+      );
+      this.position = inverseOffset;
+    }
   }
 
   resolveUiRendered() {

packages/graphics/traits/visible.trait.js

@@ -181,10 +181,13 @@ export class Visible extends decorate(Trait) {
     }
   }
 
-  tick(elapsed) {
+  renderTick(elapsed) {
     if (this.shouldSynchronizePosition()) {
       this.synchronizePosition();
     }
+  }
+
+  tick(elapsed) {
     if (AVOCADO_SERVER) {
       if (this.scheduledBoundingBoxUpdate) {
         // Collect all bounding boxes.

packages/topdown/layer-view.js

@@ -76,4 +76,8 @@ export class LayerView extends Container {
     this.layerContainer.addChild(tilesSprite);
   }
 
+  renderTick(elapsed) {
+    this.entityListView.renderTick(elapsed);
+  }
+
 }

packages/topdown/layers-view.js

@@ -30,5 +30,12 @@ export class LayersView extends Container {
     this.removeChild(layerView);
   }
 
+  renderTick(elapsed) {
+    for (const index in this.layerViews) {
+      const layerView = this.layerViews[index];
+      layerView.renderTick(elapsed);
+    }
+  }
+
 }
 

packages/topdown/room-view.js

@@ -11,5 +11,9 @@ export class RoomView extends Container {
     this.addChild(this.layersView);
   }
 
+  renderTick(elapsed) {
+    this.layersView.renderTick(elapsed);
+  }
+
 }
 

packages/topdown/traits/followed.trait.js

@@ -64,6 +64,9 @@ export class Followed extends Trait {
 
   tick(elapsed) {
     this.updatePosition();
+  }
+
+  renderTick(elapsed) {
     this._camera.tick(elapsed);
   }