foo component initialization

gistfile1.txt

// Assume some networked template:
// <template id="foo-template"><a-entity foo></a-entity></template>
//
// And some initialization elsewhere:
// const el = document.createElement("a-entity");
// el.setAttribute("networked", {
//   template: "#foo-template",
//   attachTemplateToLocal: false
// });
// el.setAttribute("foo", { someSchemaProp: true });
// scene.appendChild(el);
AFRAME.registerComponent("foo", {
  schema: {
    someSchemaProp: { default: false }
  },
  init() {
    this.updateCount = 0;
    this.tickCount = 0;
    this.system = this.el.sceneEl.systems["hubs-systems"].someSystem;
    this.didRegisterWithSystem = false;
  },
  update() {
    if (this.didRegisterWithSystem) {
      return;
    }
    this.updateCount = this.updateCount + 1;
    // If this was created by networked aframe and I am not the creator, then
    // this.data.someSchemaProp will be undefined until the second update.
    // We cannot simply check this.el.components.networked.createdByMe() here
    // because the networked component's data property is undefined during
    // this component's first update (and createdByMe() needs to check
    // the networked component's data.creator)
    if (this.updateCount === 2) {
      console.log("registered in update");
      this.system.registerComponent(this);
      this.didRegisterWithSystem = true;
    }
  },
  tick() {
    if (this.didRegisterWithSystem) {
      return;
    }
    this.tickCount = this.tickCount + 1;
    if (this.tickCount === 2) {
      // If this component is not networked or it was created by me, then this.data
      // was correct during its first update. Don't need to check specificially that
      // that happened. Instead if we reach the second tick without registering then
      // we have hit this scenario.
      console.log("registered in tick");
      this.system.registerComponent(this);
      this.didRegisterWithSystem = true;
    }
  },
  remove() {
    if (!this.didRegisterWithSystem) {
      console.warn("Foo component removed without ever having registered with the system.");
    } else {
      this.system.unregisterComponent(this);
    }
  }
});