import { Host, h } from "@stencil/core";
import state from "../../../store";
export class MoistureMap {
  render() {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
    return (h(Host, { id: "moisture-map" }, !((_a = state === null || state === void 0 ? void 0 : state.job) === null || _a === void 0 ? void 0 : _a.moistureMap) && !((_b = state === null || state === void 0 ? void 0 : state.job) === null || _b === void 0 ? void 0 : _b.matterportModelId) && h("div", { class: "default" }, h("fireenjin-upload-button", { name: "moistureMap", placeholder: "Upload Drawing", value: (_c = state === null || state === void 0 ? void 0 : state.job) === null || _c === void 0 ? void 0 : _c.moistureMap, endpoint: "editJob", documentId: (_d = state === null || state === void 0 ? void 0 : state.job) === null || _d === void 0 ? void 0 : _d.id, autoSubmit: true }), h("h4", { class: "ion-text-center ion-no-margin" }, "- or -"), h("fireenjin-form", { endpoint: "editJob", documentId: (_e = state === null || state === void 0 ? void 0 : state.job) === null || _e === void 0 ? void 0 : _e.id, hideControls: true, ref: (el) => (this.formEl = el) }, h("div", { style: {
        display: "flex",
        gap: "0.5rem",
        alignItems: "center",
      } }, h("ion-button", { shape: "round", size: "small", fill: "clear", href: "https://floodteam.notion.site/How-to-Add-a-Matterport-Model-to-a-Job-8f8e72b90fe04e72a293ff262b5ffd78", target: "_blank", color: "medium" }, h("ion-icon", { name: "information-circle", slot: "icon-only" })), h("fireenjin-input", { style: {
        width: "100%",
      }, lines: "none", labelPosition: "floating", name: "matterportModelId", label: "MatterPort Link", placeholder: "https://my.matterport.com/show?m=ABC123", required: true }), h("ion-button", { style: { height: "40px", width: "40px", marginRight: "8px" }, shape: "round", size: "small", href: "#", onClick: () => this.formEl.submit(), color: "primary" }, h("ion-icon", { name: "save", slot: "icon-only" }))))), ((_f = state === null || state === void 0 ? void 0 : state.job) === null || _f === void 0 ? void 0 : _f.moistureMap) && !((_g = state === null || state === void 0 ? void 0 : state.job) === null || _g === void 0 ? void 0 : _g.matterportModelId) && (h("div", { class: "drawing" }, h("img", { src: (_h = state === null || state === void 0 ? void 0 : state.job) === null || _h === void 0 ? void 0 : _h.moistureMap, style: { width: "100%" } }))), ((_j = state === null || state === void 0 ? void 0 : state.job) === null || _j === void 0 ? void 0 : _j.matterportModelId) && (h("div", { class: "matterport", style: { position: "relative" } }, h("iframe", { style: {
        maxWidth: "100%",
        maxHeight: "100%",
        display: "block",
      }, width: "853", height: "480", frameborder: "0", allowfullScreen: "true", allow: "xr-spatial-tracking", src: `https://my.matterport.com/show/?m=${(_k = state === null || state === void 0 ? void 0 : state.job) === null || _k === void 0 ? void 0 : _k.matterportModelId}&brand=0&help=1` })))));
  }
  static get is() { return "floodteam-moisture-map"; }
  static get originalStyleUrls() {
    return {
      "$": ["moisture-map.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["moisture-map.css"]
    };
  }
}
