// updateObjectListWidgets.js

(function () {
  /* global AdventureJS A */

  var p = AdventureJS.Display.prototype;

  /**
   * Update objects list in object widgets.
   * @method AdventureJS.Display#updateObjectListWidgets
   * @param {Object} properties
   */
  p.updateObjectListWidgets = function Display_updateObjectListWidgets(
    properties
  ) {
    if (this.object_list_widgets.length === 0) return;

    const room = this.game.world[this.game.world._room];
    const objects = room.getListableContents(); // returns assets

    this.object_list_widgets.forEach(function (widget) {
      let html = "";

      objects.forEach(function (asset) {
        let src = "";
        // exclude player
        if (asset.id === this.game.world._player) return;

        let image = "";
        let hasimage = "";
        let noname = "";
        let noimage = "ajs-noimage";
        if (widget.print_images && asset.image) {
          src = this.game.getImage(asset.image);
          //image = `<span class="ajs-object-image ajs-icon ajs-image-container">${src}</span>`;
          hasimage = "hasimage";
          noimage = "";
          if ("undefined" !== typeof widget.print_name && !widget.print_name) {
            noname = "ajs-noname";
          }
        }
        let allow = true;

        // assetclasses

        // state

        // container

        if (allow) {
          let itemhtml = `
            <button 
              data-id="${asset.id}" 
              data-name="${asset.name}" 
              class="button ajs-widget-button id_${asset.id} class_${asset.class} ${hasimage}" 
              data-name="${asset.name}"
              aria-label="${asset.name}"
              title="${asset.name}"
              aria-hidden=false
              tab-index="0"
            >
              <span class="ajs-object-image ajs-image-container ajs-button-image ${noimage}">
                ${src}
              </span>
              <span class="ajs-object-name ajs-button-label ${noname}">
                ${asset.name}
              </span>
            </button>
          `;
          html += itemhtml;
        }
      }, this);

      html = `
        <div class="ajs-inner ajs-scroll-container">
          <div class="ajs-scroll-content">
            ${html}
          </div>
        </div>
      `;
      widget.innerHTML = html;

      widget.querySelectorAll(".ajs-widget-button").forEach(function (el) {
        el.game = this.game;
        el.addEventListener("click", function () {
          if (this.game.display.inputEl.value.length) {
            this.game.sendToInput(` ${el.dataset.name}`);
          } else {
            this.game.sendToParser(
              `${widget.verb || "examine"} ${el.dataset.name}`
            );
          }
        });
      }, this);
    }, this);
  };
})();