'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index$1 = require('./index-ee190ee0.js');
const store = require('./store-27073b3b.js');
const index = require('./index-4901314f.js');
require('./getHandlebarsHelpers-8ef28401.js');
require('./_commonjsHelpers-a5111d61.js');
require('./index-ba857994.js');
require('./localforage-af1b8c0e.js');

const { state, onChange } = index.createStore({
  dots: []
});
onChange("dots", async (value) => {
  console.log(value);
});

const modalSiteEditCss = "modal-site-edit .banner{background-color:var(--ion-color-secondary)}modal-site-edit h1{color:#fff}modal-site-edit floodteam-photo-carousel .fallback-wrapper{padding:50px 0}modal-site-edit fireenjin-select ion-select{--max-width:100% !important}modal-site-edit ion-badge.photo-pagination{padding-left:10px;left:40px}modal-site-edit p{margin:0 0 15px 0;color:rgba(255, 255, 255, 0.8);font-weight:normal}modal-site-edit form[name=\"areas\"] ion-item-divider ion-text{padding-right:10px}modal-site-edit .gallery-view{height:0px !important;width:100% !important;padding:0 !important;border:none !important;overflow:hidden !important;min-height:50px !important;max-height:50px !important}modal-site-edit .gallery-view ion-slides,modal-site-edit .gallery-view ion-badge{opacity:0;pointer-events:none}.modal-site-edit{--width:700px;--max-width:700px}@media only screen and (max-width: 800px){.modal-site-edit{--width:100%;--max-width:auto}}";

const ModalSiteEdit = class {
  constructor(hostRef) {
    index$1.registerInstance(this, hostRef);
    this.floodteamCloseModal = index$1.createEvent(this, "floodteamCloseModal", 7);
    this.floodteamCloseToast = index$1.createEvent(this, "floodteamCloseToast", 7);
    this.fireenjinFetch = index$1.createEvent(this, "fireenjinFetch", 7);
    this.fireenjinSubmit = index$1.createEvent(this, "fireenjinSubmit", 7);
    this.fireenjinTrigger = index$1.createEvent(this, "fireenjinTrigger", 7);
    this.steps = ["info", "photos", "areas", "dots"];
    this.jobId = undefined;
    this.isUploading = false;
    this.photo = {};
    this.uploadUrl = undefined;
    this.currentSlide = undefined;
    this.viewGallery = true;
    this.showProgress = false;
    this.photoUploading = false;
    this.siteId = undefined;
    this.materialId = undefined;
    this.selectedTab = undefined;
    this.photoCarouselEl = undefined;
  }
  async onSuccess(event) {
    var _a, _b, _c, _d, _e, _f;
    if (((_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "addSite") {
      console.log(event.detail);
      this.siteId = ((_d = (_c = (_b = event === null || event === void 0 ? void 0 : event.detail) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.addSite) === null || _d === void 0 ? void 0 : _d.id) || null;
      store.state.site = ((_f = (_e = event === null || event === void 0 ? void 0 : event.detail) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.addSite) || null;
    }
    if (this.steps.includes(event.target.name)) {
      const nextTabName = this.steps[this.steps.indexOf(event.target.name) + 1];
      this.onTabClick(nextTabName);
      this.tabsEl.select(nextTabName);
    }
  }
  onReset(event) {
    var _a;
    if (event.target.name === "info") {
      if (confirm("Are you sure you want to delete this site?")) {
        this.fireenjinSubmit.emit({
          endpoint: "deleteSite",
          data: {
            id: this.siteId,
          },
        });
        this.floodteamCloseModal.emit();
      }
    }
    else if (this.steps.includes(event.target.name)) {
      const backTabName = this.steps[this.steps.indexOf(event.target.name) - 1];
      this.onTabClick(backTabName);
      this.tabsEl.select(backTabName);
    }
    if (((_a = event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "addPhoto") {
      const modalEl = document.querySelector("ion-modal.modal-site-edit");
      if (modalEl === null || modalEl === void 0 ? void 0 : modalEl.dismiss) {
        modalEl.dismiss();
      }
    }
  }
  async onChange() {
    var _a, _b;
    this.materialId = ((_b = (_a = this.flowRiderEl) === null || _a === void 0 ? void 0 : _a.formData) === null || _b === void 0 ? void 0 : _b.materialId) || null;
  }
  onTabClick(tabName) {
    if (this.siteId)
      return;
    let stopUnderline = false;
    this.tabBarEl.querySelectorAll("ion-tab-button").forEach((tabButtonEl) => {
      tabButtonEl.style.borderBottom = "none";
      if (tabName === tabButtonEl.tab)
        stopUnderline = true;
      if (!stopUnderline)
        tabButtonEl.style.borderBottom = "2px solid var(--ion-color-success)";
    });
  }
  async deleteDot(dotId) {
    console.log(dotId);
    // this.fireenjinSubmit.emit({
    //   endpoint: "deleteDot",
    //   data: {
    //     id: dotId,
    //   },
    // });
    // this.floodteamCloseModal.emit();
  }
  removeEquipment(equipment) {
    var _a;
    if (!confirm(`Are you sure you want to remove ${((_a = equipment === null || equipment === void 0 ? void 0 : equipment.service) === null || _a === void 0 ? void 0 : _a.name) ? equipment.service.name : "equipment"}?`))
      return;
    this.fireenjinFetch.emit({
      endpoint: "deleteSiteEquipment",
      params: {
        data: {
          id: equipment.id,
          siteId: this.siteId,
        },
      },
    });
  }
  beforeDotSubmit(data) {
    state.dots.push(data);
    return { ...data, siteId: this.siteId, jobId: this.jobId };
  }
  toGalleryView(_event) {
    this.viewGallery = true;
  }
  componentDidLoad() {
    var _a;
    if (!(index$1.Build === null || index$1.Build === void 0 ? void 0 : index$1.Build.isBrowser))
      return;
    state.dots = ((_a = store.state === null || store.state === void 0 ? void 0 : store.state.site) === null || _a === void 0 ? void 0 : _a.dots) || [];
    if (!this.siteId) {
      this.showProgress = true;
    }
    if (this.selectedTab) {
      setTimeout(() => {
        this.tabsEl.select(this.selectedTab);
      }, 200);
    }
  }
  render() {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
    return [
      index$1.h("ion-header", null, index$1.h("ion-toolbar", null, index$1.h("ion-title", null, ((_a = store.state.site) === null || _a === void 0 ? void 0 : _a.name) || "Add a Site"), index$1.h("ion-buttons", { slot: "end" }, index$1.h("ion-button", { onClick: () => this.floodteamCloseModal.emit(), style: {
          "--color": "var(--ion-text-color)",
          "--color-hover": "var(--ion-color-danger",
        } }, index$1.h("ion-icon", { slot: "icon-only", name: "close-circle-outline" }))))),
      index$1.h("ion-content", null, index$1.h("ion-tabs", { ref: (el) => (this.tabsEl = el) }, index$1.h("ion-tab-bar", { ref: (el) => (this.tabBarEl = el), slot: "top" }, index$1.h("ion-tab-button", { tab: "info", onClick: () => this.onTabClick("info") }, index$1.h("ion-icon", { name: "information-circle" }), index$1.h("ion-label", null, "Info")), index$1.h("ion-tab-button", { tab: "photos", onClick: () => this.onTabClick("photos") }, index$1.h("ion-icon", { name: "images" }), index$1.h("ion-label", null, "Photos"), index$1.h("ion-badge", null, ((_c = (_b = store.state.site) === null || _b === void 0 ? void 0 : _b.photos) === null || _c === void 0 ? void 0 : _c.length) || 0)), index$1.h("ion-tab-button", { tab: "areas", onClick: () => this.onTabClick("areas") }, index$1.h("ion-icon", { name: "cube" }), index$1.h("ion-label", null, "Areas"), index$1.h("ion-badge", null, ((_e = (_d = store.state.site) === null || _d === void 0 ? void 0 : _d.affectedAreas) === null || _e === void 0 ? void 0 : _e.length) || 0, "/", ((_g = (_f = store.state.site) === null || _f === void 0 ? void 0 : _f.areas) === null || _g === void 0 ? void 0 : _g.length) || 0)), index$1.h("ion-tab-button", { tab: "dots", onClick: () => this.onTabClick("dots") }, index$1.h("ion-icon", { name: "ellipse" }), index$1.h("ion-label", null, "Dots"), index$1.h("ion-badge", null, ((_j = (_h = store.state.site) === null || _h === void 0 ? void 0 : _h.services) === null || _j === void 0 ? void 0 : _j.length) || 0))), index$1.h("ion-tab", { tab: "info" }, index$1.h("ion-content", null, index$1.h("ion-card", null, index$1.h("floodteam-form-site-info", { jobId: this.jobId })))), index$1.h("ion-tab", { tab: "photos" }, index$1.h("ion-content", null, index$1.h("floodteam-photo-carousel", { class: {
          "is-loading": !!this.isUploading,
          "gallery-view": this.viewGallery,
        }, hideAddButton: !this.viewGallery, ref: (el) => (this.photoCarouselEl = el), photos: ((_k = store.state.site) === null || _k === void 0 ? void 0 : _k.photos) || [], jobId: this.jobId, siteId: this.siteId }), index$1.h("ion-grid", { style: this.viewGallery
          ? {
            display: "block",
          }
          : {
            display: "none",
          } }, index$1.h("ion-row", null, (((_l = store.state.site) === null || _l === void 0 ? void 0 : _l.photos) || []).map((photo, index) => {
        var _a, _b;
        return (index$1.h("ion-col", { style: { cursor: "pointer" }, size: "4", onClick: async () => {
            await this.photoCarouselEl.slideTo(index + 1);
            this.viewGallery = false;
            setTimeout(async () => {
              await this.photoCarouselEl.update();
            }, 10);
          } }, index$1.h("ion-img", { src: ((_b = (_a = photo === null || photo === void 0 ? void 0 : photo.url) === null || _a === void 0 ? void 0 : _a.includes) === null || _b === void 0 ? void 0 : _b.call(_a, "api.floodteamms.com"))
            ? photo.url
            : ((photo === null || photo === void 0 ? void 0 : photo.url) || "")
              .replace(".jpeg", "_200x200.webp")
              .replace(".jpg", "_200x200.webp")
              .replace(".png", "_200x200.webp") })));
      }))))), index$1.h("ion-tab", { tab: "areas" }, index$1.h("ion-content", null, index$1.h("ion-card", null, index$1.h("floodteam-form-site-areas", { jobId: this.jobId, siteId: this.siteId })))), index$1.h("ion-tab", { tab: "dots" }, index$1.h("ion-content", null, index$1.h("ion-card", null, index$1.h("ion-card-header", null, index$1.h("ion-card-title", null, "Add Dot")), index$1.h("floodteam-flow-rider", { ref: (el) => (this.flowRiderEl = el), flowId: "3cj19bUYxPSA3VoiWnV9", renderId: "default", beforeSubmit: async (data) => this.beforeDotSubmit(data), stepInput: {
          dotConfirm: {
            material: (store.state.materials || []).find((material) => material.id === this.materialId),
          },
        } })), index$1.h("ion-card", null, ((state === null || state === void 0 ? void 0 : state.dots) || []).map((dot) => (index$1.h("ion-item", null, index$1.h("ion-label", { style: { textAlign: "center" } }, (dot === null || dot === void 0 ? void 0 : dot.name) || "no name"), index$1.h("ion-button", { onClick: () => this.deleteDot(dot.id), fill: "clear", slot: "end" }, index$1.h("ion-icon", { color: "danger", slot: "icon-only", name: "trash" })))))))))),
      !this.viewGallery && (index$1.h("ion-footer", { collapse: "fade" }, index$1.h("ion-toolbar", null, index$1.h("fireenjin-form", { name: "photos", endpoint: ((_m = this.photo) === null || _m === void 0 ? void 0 : _m.id) ? "editPhoto" : "addPhoto", beforeSubmit: async (data) => ({
          jobId: this.jobId,
          siteId: this.siteId || null,
          ...data,
        }), submitButton: "Save", hideControls: true }, index$1.h("ion-grid", null, index$1.h("ion-row", null, index$1.h("ion-col", { style: { maxWidth: "100px", display: "flex" } }, index$1.h("ion-buttons", null, !((_p = (_o = store.state.site) === null || _o === void 0 ? void 0 : _o.photos) === null || _p === void 0 ? void 0 : _p.length) ? null : (index$1.h("ion-button", { style: {
          "--color-hover": "var(--ion-color-primary)",
          "--background-hover": "transparent",
        }, title: "View Gallery", class: "view-gallery", onClick: (event) => this.toGalleryView(event) }, index$1.h("ion-icon", { name: "grid", slot: "icon-only" }))), index$1.h("ion-button", { title: "Move", style: {
          "--color-hover": "var(--ion-color-primary)",
          "--background-hover": "transparent",
        }, onClick: (event) => {
          var _a;
          return this.fireenjinTrigger.emit({
            event,
            name: "move",
            type: "move",
            payload: {
              filter: true,
              onFilter: (event, inst) => {
                console.log(event, inst);
              },
              control: {
                name: "move",
                label: "Move To",
                icon: "arrow-redo",
                options: (((_a = store.state === null || store.state === void 0 ? void 0 : store.state.job) === null || _a === void 0 ? void 0 : _a.sites) || []).map((site) => ({
                  label: site.name
                    ? site.name
                    : "No Site Name...",
                  value: site.id,
                })),
                value: this.siteId,
              },
            },
          });
        } }, index$1.h("ion-icon", { slot: "icon-only", name: "arrow-redo" })))), index$1.h("ion-col", { style: {
          display: "flex",
          "flex-wrap": "wrap",
          paddingTop: "5px",
        } }, index$1.h("small", { style: { textIndent: "20px" } }, index$1.h("ion-icon", { name: "pricetags" }), " \u00A0 Tags"), index$1.h("fireenjin-select-tags", { style: {
          display: "block",
          width: "100%",
          height: "40px",
        }, lines: "none", name: "tags", value: ((_q = this.photo) === null || _q === void 0 ? void 0 : _q.tags) || [], options: [
          {
            label: "Shareable",
            value: "shareable",
          },
          {
            label: "Curbshot",
            value: "curbshot",
          },
          {
            label: "Important",
            value: "important",
          },
          {
            label: "Contents",
            value: "contents",
          },
          {
            label: "Reading",
            value: "reading",
          },
        ] })), index$1.h("ion-col", { style: { maxWidth: "50px", display: "flex" } }, index$1.h("ion-buttons", null, index$1.h("ion-button", { title: "Delete Photo", style: {
          "--color-hover": "var(--ion-color-danger)",
          "--background-hover": "transparent",
        }, onClick: async (event) => {
          event.preventDefault();
          if (!confirm("Are you sure you wish to delete this photo?"))
            return;
          const photo = await this.photoCarouselEl.getPhoto();
          this.fireenjinSubmit.emit({
            endpoint: "deletePhoto",
            event,
            id: photo === null || photo === void 0 ? void 0 : photo.id,
          });
        } }, index$1.h("ion-icon", { slot: "icon-only", name: "trash" })))))))))),
    ];
  }
};
ModalSiteEdit.style = modalSiteEditCss;

exports.modal_site_edit = ModalSiteEdit;
