blue-chestnut-solar-expert 0.0.11 → 0.0.12

package/dist/cjs/stencil-library.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["loading-widget.cjs",[[0,"loading-widget"]]],["solar-calculator.cjs",[[0,"solar-calculator",{"apiKey":[1,"api-key"],"buildingInsights":[32],"isLoaded":[32],"autocomplete":[32],"place":[32]}]]],["eraser-icon_9.cjs",[[0,"solar-expert",{"apiKey":[1,"api-key"],"language":[1],"latitude":[32],"longitude":[32],"isLoaded":[32],"autocomplete":[32],"place":[32]}],[0,"map-draw",{"language":[1],"apiKey":[1,"api-key"],"latitude":[2],"longitude":[2],"config":[16],"solarPanel":[16,"solar-panel"],"showInstructions":[32],"zoom":[32],"loadingState":[32],"rgbTiff":[32],"draggedPointIndex":[32],"hoveredPointIndex":[32],"hoveredPolygon":[32],"shiftKeyPressed":[32],"altKeyPressed":[32],"mousePoint":[32],"currentTool":[32],"roofPolygons":[32],"roofPolygonsSolarPanels":[32],"obstructionPolygons":[32],"selectedPolygon":[32],"buildingInsights":[32],"pixelInMeters":[32],"showAzimuth":[32]},[[5,"mousemove","handleMouseMove"],[4,"keydown","handleKeyDown"],[4,"keyup","handleKeyUp"],[5,"mousedown","handleMouseDown"],[5,"mouseup","handleMouseUp"]],{"latitude":["getBuildingInsights","getBuildingImages"],"longitude":["getBuildingInsights","getBuildingImages"],"rgbTiff":["drawMap"],"buildingInsights":["drawMap"],"canvasElement":["drawMap"]}],[0,"icon-selector",{"name":[1],"inline":[4]}],[0,"solar-system-form",{"systemConfigs":[16,"system-configs"],"language":[1],"roofPolygons":[16,"roof-polygons"],"obstructionPolygons":[16,"obstruction-polygons"],"householdConsumption":[32],"consumptionProfile":[32],"electricityPrice":[32],"compensationRate":[32],"autonomy":[32],"costSavings":[32],"numberOfPanels":[32],"panelPeakPower":[32],"name":[32],"email":[32],"nameError":[32],"emailError":[32]},null,{"systemConfigs":["updateSystemConfigs"]}],[0,"eraser-icon",{"inline":[4]}],[0,"house-icon",{"inline":[4]}],[0,"move-icon",{"inline":[4]}],[0,"octagon-minus-icon",{"inline":[4]}],[0,"search-icon",{"inline":[4]}]]]], options);
+  return index.bootstrapLazy([["loading-widget.cjs",[[0,"loading-widget"]]],["solar-calculator.cjs",[[0,"solar-calculator",{"apiKey":[1,"api-key"],"buildingInsights":[32],"isLoaded":[32],"autocomplete":[32],"place":[32]}]]],["eraser-icon_9.cjs",[[0,"solar-expert",{"apiKey":[1,"api-key"],"language":[1],"latitude":[32],"longitude":[32],"isLoaded":[32],"autocomplete":[32],"place":[32]}],[0,"map-draw",{"language":[1],"apiKey":[1,"api-key"],"latitude":[2],"longitude":[2],"config":[16],"solarPanel":[16,"solar-panel"],"showInstructions":[32],"zoom":[32],"loadingState":[32],"rgbTiff":[32],"draggedPointIndex":[32],"hoveredPointIndex":[32],"hoveredPolygon":[32],"shiftKeyPressed":[32],"altKeyPressed":[32],"mousePoint":[32],"currentTool":[32],"roofPolygons":[32],"roofPolygonsSolarPanels":[32],"obstructionPolygons":[32],"selectedPolygon":[32],"buildingInsights":[32],"pixelInMeters":[32],"showAzimuth":[32]},[[5,"mousemove","handleMouseMove"],[4,"keydown","handleKeyDown"],[4,"keyup","handleKeyUp"],[5,"mousedown","handleMouseDown"],[5,"mouseup","handleMouseUp"]],{"latitude":["getBuildingInsights","getBuildingImages"],"longitude":["getBuildingInsights","getBuildingImages"],"rgbTiff":["drawMap"],"buildingInsights":["drawMap"],"canvasElement":["drawMap"]}],[0,"icon-selector",{"name":[1],"inline":[4]}],[0,"solar-system-form",{"systemConfigs":[16,"system-configs"],"language":[1],"roofPolygons":[16,"roof-polygons"],"obstructionPolygons":[16,"obstruction-polygons"],"householdConsumption":[32],"consumptionProfile":[32],"electricityPrice":[32],"compensationRate":[32],"autonomy":[32],"costSavings":[32],"numberOfPanels":[32],"panelPeakPower":[32],"name":[32],"email":[32],"nameError":[32],"emailError":[32],"electricCar":[32],"heatPump":[32],"battery":[32]},null,{"systemConfigs":["updateSystemConfigs"]}],[0,"eraser-icon",{"inline":[4]}],[0,"house-icon",{"inline":[4]}],[0,"move-icon",{"inline":[4]}],[0,"octagon-minus-icon",{"inline":[4]}],[0,"search-icon",{"inline":[4]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/map-draw/map-draw.js

@@ -12,7 +12,6 @@ import { getBestFittingRoofSegment, } from "../../utils/geometry/fitting";
 import { getOptimalSolarPositionFully } from "../../utils/geometry/gridMatch";
 import { BORDER_INSET, DEFAULT_SUNNINESS } from "../../constants";
 import { getLanguageStrings } from "../../utils/lang/general";
-const FACTOR = 1;
 export class MapDraw {
     language = "en";
     apiKey = "";
@@ -54,6 +53,8 @@ export class MapDraw {
     componentDidLoad() {
         if (this.latitude && this.longitude) {
             this.loadingState = "loading";
+            this.getBuildingInsights();
+            this.getBuildingImages();
         }
         requestAnimationFrame(() => {
             if (this.canvasElement) {
@@ -151,10 +152,44 @@ export class MapDraw {
         this.pixelInMeters = getPixelInMeters(this.rgbTiff);
         this.loadingState = "loaded";
     }
+    convertToCanvasCoordinates(event) {
+        const rect = this.polygonCanvas.getBoundingClientRect();
+        const siteX = event.clientX - rect.left;
+        const siteY = event.clientY - rect.top;
+        return {
+            x: siteX / (rect.right - rect.left) * this.canvasElement.width,
+            y: siteY / (rect.bottom - rect.top) * this.canvasElement.height,
+        };
+    }
     async drawMap() {
         if (!this.canvasElement || !this.rgbTiff || !this.buildingInsights)
             return;
-        this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);
+        // Get the container dimensions
+        const container = this.canvasElement.parentElement;
+        if (!container)
+            return;
+        const containerRect = container.getBoundingClientRect();
+        const containerWidth = containerRect.width;
+        const containerHeight = containerRect.height;
+        // Calculate the scale to fit the image while maintaining aspect ratio
+        const imageAspect = this.rgbTiff.width / this.rgbTiff.height;
+        const containerAspect = containerWidth / containerHeight;
+        let width, height;
+        if (imageAspect > containerAspect) {
+            width = containerWidth;
+            height = containerWidth / imageAspect;
+        }
+        else {
+            height = containerHeight;
+            width = containerHeight * imageAspect;
+        }
+        // Set the canvas dimensions
+        this.canvasElement.width = width;
+        this.canvasElement.height = height;
+        this.sizeCanvas(width, height);
+        // this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);
+        // Update zoom factor based on new size
+        this.zoom = width / this.rgbTiff.width;
         renderCombinedWithZoom({
             rgb: this.rgbTiff,
             zoom: this.zoom,
@@ -164,9 +199,8 @@ export class MapDraw {
     handleMouseMove(event) {
         if (!this.polygonCanvas || !this.polygonCtx)
             return;
-        const rect = this.polygonCanvas.getBoundingClientRect();
-        const x = event.clientX - rect.left;
-        const y = event.clientY - rect.top;
+        // translate the website pixel coordinates to the canvas coordinates
+        const { x, y } = this.convertToCanvasCoordinates(event);
         this.mousePoint = { x, y };
         const currentPolygon = this.getCurrentPolygon();
         // Check for point hover
@@ -321,10 +355,7 @@ export class MapDraw {
             return;
         if (!this.polygonCanvas.contains(event.target))
             return;
-        // get the mouse position in the polygon canvas
-        const rect = this.polygonCanvas.getBoundingClientRect();
-        let x = event.clientX - rect.left;
-        let y = event.clientY - rect.top;
+        let { x, y } = this.convertToCanvasCoordinates(event);
         if (this.currentTool.name === "delete") {
             if (!this.hoveredPolygon) {
                 return;
@@ -516,9 +547,9 @@ export class MapDraw {
     render() {
         const t = getLanguageStrings(this.language);
         const currentPolygon = this.getCurrentPolygon();
-        return (h("div", { key: 'c1074bbc3cffffaa59d6b72d65460e3b58dae40e', class: "flex flex-col justify-center items-center w-full h-full gap-4" }, this.showInstructions && (h("div", { key: '2ec73b13be80dea76f8058750f49f8be5b9e56b3', class: "w-full rounded-4xl p-4", style: {
+        return (h("div", { key: '5c4bffa29e1584486b5f1b479fd00bc0495d60c3', class: "flex flex-col justify-center items-center w-full h-full gap-4" }, this.showInstructions && (h("div", { key: 'b1320f8e49b39f0c922c78781e1c74835fa1802b', class: "w-full rounded-4xl p-4", style: {
                 backgroundColor: "rgba(0, 0, 0, 0.1)",
-            } }, "After you have searched and selected your address. Highlight the part of your roof that you want to add solar panels to. Mark each surface with a polygon with the roof tool", " ", h("icon-selector", { key: '8fd5c274bd72dc287ffaf13622332c5000009a29', name: "house", inline: true }), " ", ". If you have skylights or other obstructions where you don't want to add solar panels, mark those as well with the obstruction tool", " ", h("icon-selector", { key: '21c377c9a081e89527090b3fd2f23972cbb7f085', name: "octagon-minus", inline: true }), ". You can delete polygons with the delete tool", " ", h("icon-selector", { key: '3bbd6ed32192bf4b0423d12234836dd20cd8d961', name: "eraser", inline: true }), ". If you want to change the azimuth or pitch of a polygon, select the move tool", " ", h("icon-selector", { key: '40ec20b5c99f6845edb56ff253d9d552d96fd739', name: "move", inline: true }), ", select the polygon you want to change and drag and drop the edges.")), h("div", { key: 'e6da73387ea43a51c1f5eb0e499af8a9ef3cf201', class: "flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full" }, tools.map((tool) => {
+            } }, "After you have searched and selected your address. Highlight the part of your roof that you want to add solar panels to. Mark each surface with a polygon with the roof tool", " ", h("icon-selector", { key: '3592c6d05baaca45ea0ccc28c59600fea84ecd0b', name: "house", inline: true }), " ", ". If you have skylights or other obstructions where you don't want to add solar panels, mark those as well with the obstruction tool", " ", h("icon-selector", { key: 'b9430ece54f0c405970c00f8aec2df37f0eb4cc5', name: "octagon-minus", inline: true }), ". You can delete polygons with the delete tool", " ", h("icon-selector", { key: '48d24aac3f043f09b533cabd8593b951c38fbc55', name: "eraser", inline: true }), ". If you want to change the azimuth or pitch of a polygon, select the move tool", " ", h("icon-selector", { key: 'd69c5da3e5cbb7c1766a81abd3c2b165a33880b4', name: "move", inline: true }), ", select the polygon you want to change and drag and drop the edges.")), h("div", { key: 'd096fb986027c4532ae0a282000bf098be3d58c3', class: "flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full" }, tools.map((tool) => {
             const toolStrings = t.mapDraw.tools[tool.name];
             return (h("button", { class: `px-4 py-2 rounded-4xl transition-colors duration-200 hover:bg-[#ffffff] ${this.currentTool.name === tool.name
                     ? "bg-[#271200] hover:bg-gray-500"
@@ -527,24 +558,25 @@ export class MapDraw {
                         ? "#ffffff"
                         : "#000000",
                 }, "aria-label": toolStrings.ariaLabel, title: toolStrings.explanation, onClick: () => this.handleToolSelect(tool) }, h("div", { class: "flex items-center gap-1 flex-col" }, h("icon-selector", { name: tool.icon }), h("span", null, toolStrings.name))));
-        })), this.loadingState === "empty" && (h("div", { key: 'fcd755d5b1034b65ee91f0e86ddb6255748cda0c', class: "w-full" }, h("p", { key: 'a139b9301c89a76d69ab400be70574478498069f', class: "text-white text-center flex items-center justify-center rounded-4xl p-4 w-full", style: {
+        })), this.loadingState === "empty" && (h("div", { key: '16a1968748a9ade0dded7a43d8eb56de252f47d0', class: "w-full" }, h("p", { key: '7c1779caab5a9466fb200116cb4d8bee2739fe26', class: "text-white text-center flex items-center justify-center rounded-4xl p-4 w-full", style: {
                 backgroundColor: "rgba(0, 0, 0, 0.5)",
             } }, t.mapDraw.noAddressSelected))), (this.latitude && this.longitude &&
-            this.loadingState === "loading") && (h("div", { key: '1c6fde5a93a076b82c7ea676325126e064b4fd7b', class: "flex items-center justify-center bg-white bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: '1e3011375805e4fcddf65a2e077894349190e1b0', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]" }))), h("div", { key: '73cf21d0d11f0228688158ce4955c78ff034699a', class: "flex gap-4 items-start justify-center h-full" }, h("div", { key: '3294d1bf9edb999fa0a3b31f92a5da34246d694f', class: "relative flex-1 h-full p-4 rounded-4xl flex items-center justify-center", style: {
-                width: `${this.rgbTiff?.width * FACTOR || 0}px`,
-                height: `${this.rgbTiff?.height * FACTOR || 0}px`,
-            } }, h("canvas", { key: '12d9b7110cebb4022f8d25d0b6b62d1e83fc91c2', ref: (el) => this.canvasElement = el, class: `absolute top-0 left-0 z-1 rounded-4xl m-auto`, style: {
+            this.loadingState === "loading") && (h("div", { key: 'a2e36a6868392806295dd188d5a6dcf09ad375b3', class: "flex items-center justify-center w-full bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: '38730ad2043af72356f5b61aaf835aa1bf605f1a', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]" }))), h("div", { key: 'a727bc7ab694c998ea870085d2624ed71b190491', class: "flex items-start justify-center h-full w-full bg-[#f3ebda] rounded-4xl" }, h("div", { key: '25175a8d357fcc9535fc21a6d96b026978afcc0e', class: "relative h-full flex items-center justify-center w-full rounded-4xl bg-[#271200]", style: {
+                aspectRatio: this.rgbTiff
+                    ? `${this.rgbTiff.width}/${this.rgbTiff.height}`
+                    : "1/1",
+            } }, h("canvas", { key: '662e580303a7b7b347bc05646bc0a71bade4692f', ref: (el) => this.canvasElement = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", style: {
                 cursor: this.currentTool.cursor,
-            } }), h("canvas", { key: 'f2f116e61c23ff59db85610814ea748210618151', ref: (el) => this.polygonCanvas = el, class: `absolute top-0 left-0 z-10 rounded-4xl m-auto`, style: {
+            } }), h("canvas", { key: '6bb0d1340336296a5ec4ebf42931422d0cf8d076', ref: (el) => this.polygonCanvas = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", style: {
                 cursor: this.currentTool.cursor,
-            } }))), h("div", { key: 'ee1ca6d0acdd3b8a1200657a985726d0dd6c91a6', class: "flex gap-4 flex-row justify-center items-center w-full" }, h("div", { key: 'f3bcb0608a35c24886efdf49feebed250f504e82', class: "w-full bg-[#f3ebda] rounded-4xl p-4" }, h("h3", { key: 'c7e3efa275edfedb2dc99715fc6896e830c00ce1', class: "text-lg font-semibold mb-4 text-center" }, t.mapDraw.information), currentPolygon?.details
+            } }))), h("div", { key: 'f67881f3f696aa658aba1d3bc94ea31912c4bcc4', class: "flex gap-4 flex-row justify-center items-center w-full" }, h("div", { key: '8bc9da72573d53e564c97203d5f20a399b995cfd', class: "w-full bg-[#f3ebda] rounded-4xl p-4" }, h("h3", { key: 'fc679612cc3a3e77dfb79bb0fb69ae536a0f9bca', class: "text-lg font-semibold mb-4 text-center" }, t.mapDraw.information), currentPolygon?.details
             ? (h("div", { class: "space-y-4" }, h("div", { class: "flex flex-col gap-2" }, h("button", { class: "px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#ffffff] hover:text-[#271200] transition-colors duration-200", onClick: () => this.calculateSolarPanels(), style: {
                     color: "#ffffff",
                 } }, t.mapDraw.calculateSolarPanels), this
                 .roofPolygonsSolarPanels[currentPolygon._id] && (h("p", { class: "text-lg text-center" }, this
                 .roofPolygonsSolarPanels[currentPolygon._id].positionedPanels
                 .length, " ", t.mapDraw.panels))), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, t.mapDraw.area), h("p", { class: "text-lg" }, currentPolygon.details?.area
-                .toFixed(2), " m\u00B2")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, "Orientation"), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
+                .toFixed(2), " m\u00B2")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, t.mapDraw.azimuth), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
                     if (e.key === "Enter") {
                         this.handleAzimuthChange(e);
                         e.target
@@ -553,7 +585,21 @@ export class MapDraw {
                 }, value: currentPolygon
                     .details
                     ?.azimuth }), "(", azimuthToCardinal(currentPolygon.details
-                ?.azimuth), ")")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600 pl-2" }, t.mapDraw.pitch), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
+                ?.azimuth), ")"), h("input", { type: "range", min: "0", max: "360", class: "w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white", value: currentPolygon
+                    .details?.azimuth, onInput: (e) => {
+                    const target = e
+                        .target;
+                    const azimuth = parseFloat(target.value);
+                    currentPolygon.details
+                        .azimuth = azimuth;
+                    if (currentPolygon
+                        .type ===
+                        "roof" &&
+                        this.roofPolygonsSolarPanels[currentPolygon
+                            ._id]) {
+                        this.calculateSolarPanels();
+                    }
+                } })), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600 pl-2" }, t.mapDraw.pitch), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
                     if (e.key === "Enter") {
                         this.handlePitchChange(e);
                         e.target
@@ -561,8 +607,22 @@ export class MapDraw {
                     }
                 }, value: currentPolygon
                     .details
-                    ?.pitch }), "\u00B0"))))
-            : (h("p", { class: "text-gray-500 text-center" }, t.mapDraw.noPolygonSelected)))), h("div", { key: '1596027c6a5acffa915c99366f9e74e619f102a7', class: "w-full" }, h("solar-system-form", { key: 'a7712ddf9330d6fa6833d7c717d33af12e8fcfe5', systemConfigs: this.roofPolygonsSolarPanels, language: this.language, roofPolygons: this.roofPolygons, obstructionPolygons: this.obstructionPolygons }))));
+                    ?.pitch }), "\u00B0"), h("input", { type: "range", min: "0", max: "90", class: "w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white", value: currentPolygon
+                    .details?.pitch, onInput: (e) => {
+                    const target = e
+                        .target;
+                    const pitch = parseFloat(target.value);
+                    currentPolygon.details
+                        .pitch = pitch;
+                    if (currentPolygon
+                        .type ===
+                        "roof" &&
+                        this.roofPolygonsSolarPanels[currentPolygon
+                            ._id]) {
+                        this.calculateSolarPanels();
+                    }
+                } }))))
+            : (h("p", { class: "text-gray-500 text-center" }, t.mapDraw.noPolygonSelected)))), h("div", { key: '4bf7b06b1ba3e654336eee59fadbd84acc106fa6', class: "w-full" }, h("solar-system-form", { key: 'd4f07caf0bf86edacd638e88f459a85076035168', systemConfigs: this.roofPolygonsSolarPanels, language: this.language, roofPolygons: this.roofPolygons, obstructionPolygons: this.obstructionPolygons }))));
     }
     static get is() { return "map-draw"; }
     static get originalStyleUrls() {

package/dist/collection/components/map-draw/map-draw.js.map

@@ -1 +1 @@
-{"version":3,"file":"map-draw.js","sourceRoot":"","sources":["../../../src/components/map-draw/map-draw.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n    Component,\r\n    Element,\r\n    h,\r\n    Listen,\r\n    Prop,\r\n    State,\r\n    Watch,\r\n} from \"@stencil/core\";\r\n\r\nimport {\r\n    renderCombinedWithZoom,\r\n    renderSolarPanel,\r\n} from \"../../utils/visualize\";\r\nimport {\r\n    BuildingInsightsResponse,\r\n    GeoTiff,\r\n    SolarPanelType,\r\n} from \"../../utils/solar\";\r\nimport { fetchSolarData, getBuildingImages } from \"../../utils/api\";\r\nimport { drawPolygon, isPointInPolygon } from \"../../utils/render/polygon\";\r\nimport { projectPointPerpendicularToLine } from \"../../utils/render/projection\";\r\nimport { Point, Polygon, SelectedPolygon } from \"../../types/shapes\";\r\nimport { moveTool, roofTool, Tool, tools } from \"../../utils/render/tools\";\r\nimport {\r\n    DEFAULT_SOLAR_EXPERT_CONFIG,\r\n    DEFAULT_SOLAR_PANEL_TYPE,\r\n    SolarExpertConfig,\r\n} from \"../../config\";\r\nimport { getFillColor } from \"../../utils/render/color\";\r\nimport { v4 as uuidv4 } from \"uuid\";\r\nimport {\r\n    azimuthToCardinal,\r\n    calculatePolygonArea,\r\n    getPixelInMeters,\r\n} from \"../../utils/utils\";\r\nimport {\r\n    getBestFittingRoofSegment,\r\n    SolarPanelSystemPart,\r\n} from \"../../utils/geometry/fitting\";\r\nimport { getOptimalSolarPositionFully } from \"../../utils/geometry/gridMatch\";\r\nimport { BORDER_INSET, DEFAULT_SUNNINESS } from \"../../constants\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nconst FACTOR = 1;\r\n\r\n@Component({\r\n    tag: \"map-draw\",\r\n    styleUrl: \"../../output.css\",\r\n    shadow: false,\r\n})\r\nexport class MapDraw {\r\n    @Prop()\r\n    language: Language = \"en\";\r\n    @Prop()\r\n    apiKey: string = \"\";\r\n    @Prop()\r\n    latitude: number | null = null;\r\n    @Prop()\r\n    longitude: number | null = null;\r\n    @Prop()\r\n    config: SolarExpertConfig = DEFAULT_SOLAR_EXPERT_CONFIG;\r\n    @Prop()\r\n    solarPanel: SolarPanelType = DEFAULT_SOLAR_PANEL_TYPE;\r\n\r\n    @State()\r\n    showInstructions: boolean = true;\r\n    @State()\r\n    zoom: number = 1;\r\n    @State()\r\n    loadingState: \"empty\" | \"loading\" | \"loaded\" = \"empty\";\r\n    @State()\r\n    rgbTiff: GeoTiff | null = null;\r\n    @State()\r\n    draggedPointIndex: number | null = null;\r\n    @State()\r\n    hoveredPointIndex: number | null = null;\r\n    @State()\r\n    hoveredPolygon: SelectedPolygon | null = null;\r\n    @State()\r\n    shiftKeyPressed: boolean = false;\r\n    @State()\r\n    altKeyPressed: boolean = false;\r\n    @State()\r\n    mousePoint: Point | null = null;\r\n    @State()\r\n    currentTool: Tool = roofTool;\r\n    @State()\r\n    roofPolygons: { [id: string]: Polygon } = {};\r\n    @State()\r\n    roofPolygonsSolarPanels: { [id: string]: SolarPanelSystemPart } = {};\r\n    @State()\r\n    obstructionPolygons: { [id: string]: Polygon } = {};\r\n    @State()\r\n    selectedPolygon: SelectedPolygon | null = null;\r\n    @State()\r\n    buildingInsights: BuildingInsightsResponse | null = null;\r\n    @State()\r\n    pixelInMeters: number = 0.2;\r\n    @State()\r\n    showAzimuth: boolean = true; // TODO: make this false\r\n\r\n    @Element()\r\n    el: HTMLElement;\r\n    private canvasElement?: HTMLCanvasElement;\r\n    private polygonCanvas?: HTMLCanvasElement;\r\n    private polygonCtx?: CanvasRenderingContext2D;\r\n\r\n    private getCurrentPolygon(): Polygon | null {\r\n        if (!this.selectedPolygon) {\r\n            return null;\r\n        }\r\n        const { _id, type } = this.selectedPolygon;\r\n        return type === \"roof\"\r\n            ? this.roofPolygons[_id]\r\n            : this.obstructionPolygons[_id];\r\n    }\r\n\r\n    componentDidLoad() {\r\n        if (this.latitude && this.longitude) {\r\n            this.loadingState = \"loading\";\r\n        }\r\n\r\n        requestAnimationFrame(() => {\r\n            if (this.canvasElement) {\r\n                const rect = this.canvasElement.getBoundingClientRect();\r\n                this.canvasElement.width = rect.width;\r\n                this.canvasElement.height = rect.height;\r\n                this.drawMap();\r\n            }\r\n        });\r\n    }\r\n\r\n    // // Initial size update\r\n    // requestAnimationFrame(() => {\r\n    //     this.updateCanvasSize();\r\n    // });\r\n    // }\r\n\r\n    // disconnectedCallback() {\r\n    //     if (this.resizeObserver) {\r\n    //         this.resizeObserver.disconnect();\r\n    //     }\r\n    // }\r\n\r\n    // private updateCanvasSize() {\r\n    //     if (!this.containerRef || !this.canvasElement || !this.polygonCanvas) {\r\n    //         return;\r\n    //     }\r\n\r\n    //     const containerRect = this.containerRef.getBoundingClientRect();\r\n    //     const containerWidth = containerRect.width;\r\n    //     const containerHeight = containerRect.height;\r\n\r\n    //     // Calculate the scale to fit the image while maintaining aspect ratio\r\n    //     if (this.rgbTiff) {\r\n    //         const imageAspect = this.rgbTiff.width / this.rgbTiff.height;\r\n    //         const containerAspect = containerWidth / containerHeight;\r\n\r\n    //         let width, height;\r\n    //         if (imageAspect > containerAspect) {\r\n    //             width = containerWidth;\r\n    //             height = containerWidth / imageAspect;\r\n    //         } else {\r\n    //             height = containerHeight;\r\n    //             width = containerHeight * imageAspect;\r\n    //         }\r\n\r\n    //         // Set the canvas dimensions\r\n    //         this.canvasElement.width = width;\r\n    //         this.canvasElement.height = height;\r\n    //         this.polygonCanvas.width = width;\r\n    //         this.polygonCanvas.height = height;\r\n    //         this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n\r\n    //         // Update zoom factor based on new size\r\n    //         this.zoom = width / this.rgbTiff.width;\r\n\r\n    //         // Force a redraw\r\n    //         this.drawMap();\r\n    //     }\r\n    // }\r\n\r\n    private sizeCanvas(width: number, height: number) {\r\n        if (this.polygonCanvas) {\r\n            this.polygonCanvas.width = width;\r\n            this.polygonCanvas.height = height;\r\n            this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n        }\r\n    }\r\n\r\n    @Watch(\"latitude\")\r\n    @Watch(\"longitude\")\r\n    async getBuildingInsights() {\r\n        if (!this.latitude || !this.longitude) {\r\n            return;\r\n        }\r\n        this.loadingState = \"loading\";\r\n\r\n        if (this.buildingInsights) {\r\n            const sameLocation =\r\n                this.buildingInsights.center.latitude === this.latitude &&\r\n                this.buildingInsights.center.longitude === this.longitude;\r\n            if (sameLocation) {\r\n                return;\r\n            }\r\n            this.obstructionPolygons = {};\r\n            this.roofPolygons = {};\r\n            this.selectedPolygon = null;\r\n            this.hoveredPolygon = null;\r\n            this.canvasElement.getContext(\"2d\")?.clearRect(\r\n                0,\r\n                0,\r\n                this.canvasElement.width,\r\n                this.canvasElement.height,\r\n            );\r\n            this.polygonCtx?.clearRect(\r\n                0,\r\n                0,\r\n                this.polygonCanvas.width,\r\n                this.polygonCanvas.height,\r\n            );\r\n            this.rgbTiff = null;\r\n        }\r\n        this.buildingInsights = await fetchSolarData(\r\n            this.latitude,\r\n            this.longitude,\r\n            this.apiKey,\r\n        );\r\n        if (!this.buildingInsights) {\r\n            alert(\"No building insights found. Please enter them manually.\");\r\n        }\r\n    }\r\n\r\n    @Watch(\"latitude\")\r\n    @Watch(\"longitude\")\r\n    async getBuildingImages() {\r\n        if (!this.latitude || !this.longitude) {\r\n            return;\r\n        }\r\n        if (this.buildingInsights) {\r\n            const sameLocation =\r\n                this.buildingInsights.center.latitude === this.latitude &&\r\n                this.buildingInsights.center.longitude === this.longitude;\r\n            if (sameLocation) {\r\n                return;\r\n            }\r\n        }\r\n        this.rgbTiff = await getBuildingImages(\r\n            this.latitude,\r\n            this.longitude,\r\n            this.apiKey,\r\n        );\r\n        this.pixelInMeters = getPixelInMeters(this.rgbTiff);\r\n        this.loadingState = \"loaded\";\r\n    }\r\n\r\n    @Watch(\"rgbTiff\")\r\n    @Watch(\"buildingInsights\")\r\n    @Watch(\"canvasElement\")\r\n    async drawMap() {\r\n        if (\r\n            !this.canvasElement || !this.rgbTiff || !this.buildingInsights\r\n        ) return;\r\n        this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);\r\n        renderCombinedWithZoom({\r\n            rgb: this.rgbTiff,\r\n            zoom: this.zoom,\r\n            canvas: this.canvasElement,\r\n        });\r\n    }\r\n\r\n    @Listen(\"mousemove\", { target: \"document\" })\r\n    handleMouseMove(event: MouseEvent) {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n        const rect = this.polygonCanvas.getBoundingClientRect();\r\n        const x = event.clientX - rect.left;\r\n        const y = event.clientY - rect.top;\r\n        this.mousePoint = { x, y };\r\n\r\n        const currentPolygon = this.getCurrentPolygon();\r\n\r\n        // Check for point hover\r\n        const newHoveredPointIndex = currentPolygon?.points.findIndex(\r\n            (point) => {\r\n                const distance = Math.sqrt(\r\n                    Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n                );\r\n                return distance < 10;\r\n            },\r\n        );\r\n\r\n        // Check for polygon hover\r\n        let newHoveredPolygon = null;\r\n        for (const polygon of Object.values(this.obstructionPolygons)) {\r\n            if (isPointInPolygon({ x, y }, polygon)) {\r\n                newHoveredPolygon = { _id: polygon._id, type: \"obstruction\" };\r\n                break;\r\n            }\r\n        }\r\n        // obstruction polygons get priority\r\n        if (!newHoveredPolygon) {\r\n            for (const polygon of Object.values(this.roofPolygons)) {\r\n                if (isPointInPolygon({ x, y }, polygon)) {\r\n                    newHoveredPolygon = { _id: polygon._id, type: \"roof\" };\r\n                    break;\r\n                }\r\n            }\r\n        }\r\n\r\n        // Only redraw if hover state changed\r\n        if (\r\n            newHoveredPointIndex !== this.hoveredPointIndex ||\r\n            JSON.stringify(newHoveredPolygon) !==\r\n                JSON.stringify(this.hoveredPolygon)\r\n        ) {\r\n            this.hoveredPointIndex = newHoveredPointIndex;\r\n            this.hoveredPolygon = newHoveredPolygon;\r\n            this.drawPolygons();\r\n        }\r\n\r\n        // Handle dragging\r\n        if (\r\n            this.draggedPointIndex !== null && currentPolygon &&\r\n            this.currentTool.name === \"move\"\r\n        ) {\r\n            currentPolygon.points[this.draggedPointIndex] = { x, y };\r\n            this.drawPolygons();\r\n        }\r\n\r\n        if (this.shiftKeyPressed) {\r\n            this.drawPolygons();\r\n        }\r\n    }\r\n\r\n    private drawPolygons() {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n        // Clear the canvas and redraw the map\r\n        this.polygonCtx.clearRect(\r\n            0,\r\n            0,\r\n            this.polygonCanvas.width,\r\n            this.polygonCanvas.height,\r\n        );\r\n\r\n        // draw roof polygons\r\n        for (const polygon of Object.values(this.roofPolygons)) {\r\n            const fillColor = getFillColor(\r\n                this.selectedPolygon,\r\n                this.hoveredPolygon,\r\n                polygon._id,\r\n                polygon,\r\n                this.config,\r\n            );\r\n\r\n            drawPolygon({\r\n                polygonCtx: this.polygonCtx,\r\n                polygonCanvas: this.polygonCanvas,\r\n                polygon,\r\n                strokeColor: polygon.closed\r\n                    ? this.config.closedRoofColor\r\n                    : this.config.openRoofColor,\r\n                fillColor,\r\n                pixelInMeters: this.pixelInMeters,\r\n                shiftKeyPressed: this.shiftKeyPressed,\r\n                mousePoint: this.mousePoint,\r\n            });\r\n\r\n            const solarPanels = this.roofPolygonsSolarPanels[polygon._id];\r\n            const convertedSolarPanel: SolarPanelType = {\r\n                ...this.solarPanel,\r\n                widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n                heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n            };\r\n            if (solarPanels) {\r\n                for (const panel of solarPanels.positionedPanels) {\r\n                    renderSolarPanel(\r\n                        panel,\r\n                        this.polygonCtx,\r\n                        convertedSolarPanel.widthMeters,\r\n                        convertedSolarPanel.heightMeters,\r\n                        polygon.details?.azimuth,\r\n                        polygon.details?.pitch,\r\n                    );\r\n                }\r\n            }\r\n        }\r\n\r\n        // draw obstruction polygons\r\n        for (const polygon of Object.values(this.obstructionPolygons)) {\r\n            const fillColor = getFillColor(\r\n                this.selectedPolygon,\r\n                this.hoveredPolygon,\r\n                polygon._id,\r\n                polygon,\r\n                this.config,\r\n            );\r\n\r\n            drawPolygon({\r\n                polygonCtx: this.polygonCtx,\r\n                polygonCanvas: this.polygonCanvas,\r\n                polygon,\r\n                pixelInMeters: this.pixelInMeters,\r\n                shiftKeyPressed: this.shiftKeyPressed,\r\n                mousePoint: this.mousePoint,\r\n                strokeColor: polygon.closed\r\n                    ? this.config.closedObstructionColor\r\n                    : this.config.openObstructionColor,\r\n                fillColor,\r\n            });\r\n        }\r\n\r\n        // if (this.showAzimuth && this.selectedPolygon) {\r\n        //     const currentPolygon = this.getCurrentPolygon();\r\n        //     renderAzimuth(currentPolygon.details?.azimuth, this.polygonCtx);\r\n        // }\r\n    }\r\n\r\n    private deletePolygon(_id: string) {\r\n        if (this.selectedPolygon?._id === _id) {\r\n            this.selectedPolygon = null;\r\n        }\r\n        if (this.roofPolygons[_id]) {\r\n            delete this.roofPolygons[_id];\r\n            delete this.roofPolygonsSolarPanels[_id];\r\n        }\r\n        if (this.obstructionPolygons[_id]) {\r\n            delete this.obstructionPolygons[_id];\r\n        }\r\n    }\r\n\r\n    @Listen(\"keydown\", { target: \"document\" })\r\n    handleKeyDown(event: KeyboardEvent) {\r\n        if (event.target instanceof HTMLInputElement) {\r\n            return;\r\n        }\r\n        // Handle shift key for perpendicular points\r\n        if (event.shiftKey && !this.shiftKeyPressed) {\r\n            this.shiftKeyPressed = true;\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n        if (event.altKey && !this.altKeyPressed) {\r\n            this.altKeyPressed = true;\r\n            return;\r\n        }\r\n        if (\r\n            (event.key === \"Delete\" || event.key === \"Backspace\") &&\r\n            this.selectedPolygon\r\n        ) {\r\n            const currentPolygon = this.getCurrentPolygon();\r\n            if (currentPolygon.closed) {\r\n                this.deletePolygon(currentPolygon._id);\r\n                this.drawPolygons();\r\n                return;\r\n            }\r\n            currentPolygon.points.pop();\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        // Handle tool selection shortcuts\r\n        const pressedKey = event.key.toLowerCase();\r\n        const tool = tools.find((t) =>\r\n            t.keyboardShortcut?.toLowerCase() === pressedKey\r\n        );\r\n        if (tool) {\r\n            this.currentTool = tool;\r\n        }\r\n    }\r\n\r\n    @Listen(\"keyup\", { target: \"document\" })\r\n    handleKeyUp(event: KeyboardEvent) {\r\n        if (!event.shiftKey && this.shiftKeyPressed) {\r\n            this.shiftKeyPressed = false;\r\n            this.drawPolygons();\r\n        }\r\n        if (!event.altKey && this.altKeyPressed) {\r\n            this.altKeyPressed = false;\r\n        }\r\n    }\r\n\r\n    @Listen(\"mousedown\", { target: \"document\" })\r\n    handleMouseDown(event: MouseEvent) {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n        if (!this.polygonCanvas.contains(event.target as Node)) return;\r\n\r\n        // get the mouse position in the polygon canvas\r\n        const rect = this.polygonCanvas.getBoundingClientRect();\r\n        let x = event.clientX - rect.left;\r\n        let y = event.clientY - rect.top;\r\n\r\n        if (this.currentTool.name === \"delete\") {\r\n            if (!this.hoveredPolygon) {\r\n                return;\r\n            }\r\n            const { _id, type } = this.hoveredPolygon;\r\n            if (type === \"roof\") {\r\n                delete this.roofPolygons[_id];\r\n                delete this.roofPolygonsSolarPanels[_id];\r\n            } else if (type === \"obstruction\") {\r\n                delete this.obstructionPolygons[_id];\r\n            }\r\n            this.hoveredPolygon = null;\r\n            if (this.selectedPolygon?._id === _id) {\r\n                this.selectedPolygon = null;\r\n            }\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n        if (this.currentTool.name === \"move\") {\r\n            // Check if we're clicking on a point of the selected polygon\r\n            if (this.selectedPolygon) {\r\n                const currentPolygon = this.getCurrentPolygon();\r\n                const pointIndex = currentPolygon?.points.findIndex((point) => {\r\n                    const distance = Math.sqrt(\r\n                        Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n                    );\r\n                    return distance < 10;\r\n                });\r\n                if (pointIndex !== undefined && pointIndex !== -1) {\r\n                    this.draggedPointIndex = pointIndex;\r\n                    return;\r\n                }\r\n\r\n                if (this.hoveredPolygon) {\r\n                    this.selectedPolygon = this.hoveredPolygon;\r\n                    return;\r\n                }\r\n            }\r\n            this.selectedPolygon = null;\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        if (!this.selectedPolygon || this.getCurrentPolygon()?.closed) {\r\n            // no polygon is active, create a new one\r\n            const newPolygon: Polygon = {\r\n                _id: uuidv4(),\r\n                points: [{ x, y }],\r\n                type: this.currentTool.name,\r\n                closed: false,\r\n            };\r\n            let _id;\r\n            if (this.currentTool.name === \"roof\") {\r\n                this.roofPolygons = {\r\n                    ...this.roofPolygons,\r\n                    [newPolygon._id]: newPolygon,\r\n                };\r\n                _id = newPolygon._id;\r\n            } else if (this.currentTool.name === \"obstruction\") {\r\n                this.obstructionPolygons = {\r\n                    ...this.obstructionPolygons,\r\n                    [newPolygon._id]: newPolygon,\r\n                };\r\n                _id = newPolygon._id;\r\n            }\r\n            this.selectedPolygon = { _id, type: this.currentTool.name };\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        const { _id, type } = this.selectedPolygon;\r\n        const currentPolygon = type === \"roof\"\r\n            ? this.roofPolygons[_id]\r\n            : this.obstructionPolygons[_id];\r\n\r\n        if (currentPolygon.closed) {\r\n            return;\r\n        }\r\n\r\n        // If we have at least one point, check if we're clicking near the first point\r\n        if (currentPolygon.points.length > 2) {\r\n            const firstPoint = currentPolygon.points[0];\r\n            const distance = Math.sqrt(\r\n                Math.pow(x - firstPoint.x, 2) + Math.pow(y - firstPoint.y, 2),\r\n            );\r\n\r\n            if (distance < 10) {\r\n                this.closePolygon();\r\n                return;\r\n            }\r\n        }\r\n\r\n        // Handle shift key for perpendicular points\r\n        if (event.shiftKey && currentPolygon?.points.length >= 2) {\r\n            const projectedPoint = projectPointPerpendicularToLine({\r\n                x,\r\n                y,\r\n                lastPoint:\r\n                    currentPolygon.points[currentPolygon.points.length - 1],\r\n                secondLastPoint:\r\n                    currentPolygon.points[currentPolygon.points.length - 2],\r\n            });\r\n            x = projectedPoint.x;\r\n            y = projectedPoint.y;\r\n        }\r\n\r\n        currentPolygon.points = [...currentPolygon.points, { x, y }];\r\n        this.drawPolygons();\r\n    }\r\n\r\n    @Listen(\"mouseup\", { target: \"document\" })\r\n    handleMouseUp() {\r\n        this.draggedPointIndex = null;\r\n    }\r\n\r\n    private closePolygon() {\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (\r\n            currentPolygon.points.length >= 3 &&\r\n            (this.currentTool.name === \"roof\" ||\r\n                this.currentTool.name === \"obstruction\")\r\n        ) {\r\n            currentPolygon.closed = true;\r\n        }\r\n\r\n        if (currentPolygon.type === \"roof\") {\r\n            // Calculate basic polygon details\r\n            const metersInPixels = 1 / this.pixelInMeters;\r\n            const area = calculatePolygonArea(currentPolygon.points) /\r\n                (metersInPixels * metersInPixels);\r\n            const bestMatch = getBestFittingRoofSegment(\r\n                currentPolygon,\r\n                this.buildingInsights?.solarPotential.roofSegmentStats,\r\n                this.rgbTiff.bounds,\r\n                this.canvasElement,\r\n            );\r\n\r\n            if (bestMatch) {\r\n                currentPolygon.details = {\r\n                    area,\r\n                    azimuth: bestMatch.azimuthDegrees,\r\n                    pitch: bestMatch.pitchDegrees,\r\n                };\r\n            } else {\r\n                currentPolygon.details = {\r\n                    area,\r\n                    azimuth: 0,\r\n                    pitch: 0,\r\n                };\r\n            }\r\n        }\r\n\r\n        this.drawPolygons();\r\n        this.currentTool = moveTool;\r\n    }\r\n\r\n    private calculateSolarPanels() {\r\n        const currentPolygon = this.getCurrentPolygon();\r\n\r\n        if (!currentPolygon.details) {\r\n            return;\r\n        }\r\n\r\n        if (this.roofPolygonsSolarPanels[currentPolygon._id]) {\r\n            delete this.roofPolygonsSolarPanels[currentPolygon._id];\r\n        }\r\n\r\n        const convertedSolarPanel: SolarPanelType = {\r\n            ...this.solarPanel,\r\n            widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n            heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n        };\r\n        const inset = BORDER_INSET / this.pixelInMeters;\r\n        const solarPanels = getOptimalSolarPositionFully(\r\n            currentPolygon,\r\n            Object.values(this.obstructionPolygons),\r\n            convertedSolarPanel,\r\n            currentPolygon.details?.azimuth,\r\n            inset,\r\n            currentPolygon.details?.pitch,\r\n        );\r\n        this.roofPolygonsSolarPanels = {\r\n            ...this.roofPolygonsSolarPanels,\r\n            [currentPolygon._id]: {\r\n                positionedPanels: solarPanels,\r\n                sunniness: currentPolygon.details?.assignedRoofStats?.stats\r\n                    .sunshineQuantiles[5] ??\r\n                    this.buildingInsights.solarPotential.buildingStats\r\n                        .sunshineQuantiles[5] ??\r\n                    DEFAULT_SUNNINESS,\r\n            },\r\n        };\r\n        this.drawPolygons();\r\n    }\r\n\r\n    private handlePitchChange(event: Event) {\r\n        const target = event.target as HTMLInputElement;\r\n        const pitch = parseFloat(target.value);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (currentPolygon) {\r\n            this.roofPolygons[currentPolygon._id].details.pitch = pitch;\r\n        }\r\n        if (\r\n            currentPolygon.type === \"roof\" &&\r\n            this.roofPolygonsSolarPanels[currentPolygon._id]\r\n        ) {\r\n            this.calculateSolarPanels();\r\n            return;\r\n        }\r\n    }\r\n\r\n    private handleAzimuthChange(event: Event) {\r\n        const target = event.target as HTMLInputElement;\r\n        const azimuth = parseFloat(target.value);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (currentPolygon) {\r\n            this.roofPolygons[currentPolygon._id].details.azimuth = azimuth;\r\n        }\r\n        if (\r\n            currentPolygon.type === \"roof\" &&\r\n            this.roofPolygonsSolarPanels[currentPolygon._id]\r\n        ) {\r\n            this.calculateSolarPanels();\r\n            return;\r\n        }\r\n    }\r\n\r\n    private handleToolSelect(tool: Tool) {\r\n        this.currentTool = tool;\r\n    }\r\n\r\n    render() {\r\n        const t = getLanguageStrings(this.language);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        return (\r\n            <div class=\"flex flex-col justify-center items-center w-full h-full gap-4\">\r\n                {this.showInstructions && (\r\n                    <div\r\n                        class=\"w-full rounded-4xl p-4\"\r\n                        style={{\r\n                            backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n                        }}\r\n                    >\r\n                        After you have searched and selected your address.\r\n                        Highlight the part of your roof that you want to add\r\n                        solar panels to. Mark each surface with a polygon with\r\n                        the roof tool{\" \"}\r\n                        <icon-selector name=\"house\" inline={true} />{\" \"}\r\n                        . If you have skylights or other obstructions where you\r\n                        don't want to add solar panels, mark those as well with\r\n                        the obstruction tool{\" \"}\r\n                        <icon-selector name=\"octagon-minus\" inline={true} />.\r\n                        You can delete polygons with the delete tool{\" \"}\r\n                        <icon-selector name=\"eraser\" inline={true} />. If you\r\n                        want to change the azimuth or pitch of a polygon, select\r\n                        the move tool{\" \"}\r\n                        <icon-selector name=\"move\" inline={true} />, select the\r\n                        polygon you want to change and drag and drop the edges.\r\n                    </div>\r\n                )}\r\n                <div class=\"flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full\">\r\n                    {tools.map((tool) => {\r\n                        const toolStrings = t.mapDraw.tools[tool.name];\r\n                        return (\r\n                            <button\r\n                                class={`px-4 py-2 rounded-4xl transition-colors duration-200 hover:bg-[#ffffff] ${\r\n                                    this.currentTool.name === tool.name\r\n                                        ? \"bg-[#271200] hover:bg-gray-500\"\r\n                                        : \"bg-[#f3ebda] hover:bg-[#ffffff]\"\r\n                                }`}\r\n                                style={{\r\n                                    color: this.currentTool.name === tool.name\r\n                                        ? \"#ffffff\"\r\n                                        : \"#000000\",\r\n                                }}\r\n                                aria-label={toolStrings.ariaLabel}\r\n                                title={toolStrings.explanation}\r\n                                onClick={() => this.handleToolSelect(tool)}\r\n                            >\r\n                                <div class=\"flex items-center gap-1 flex-col\">\r\n                                    <icon-selector name={tool.icon} />\r\n                                    <span>{toolStrings.name}</span>\r\n                                </div>\r\n                            </button>\r\n                        );\r\n                    })}\r\n                </div>\r\n                {this.loadingState === \"empty\" && (\r\n                    <div class=\"w-full\">\r\n                        <p\r\n                            class=\"text-white text-center flex items-center justify-center rounded-4xl p-4 w-full\"\r\n                            style={{\r\n                                backgroundColor: \"rgba(0, 0, 0, 0.5)\",\r\n                            }}\r\n                        >\r\n                            {t.mapDraw.noAddressSelected}\r\n                        </p>\r\n                    </div>\r\n                )}\r\n                {(this.latitude && this.longitude &&\r\n                    this.loadingState === \"loading\") && (\r\n                    <div class=\"flex items-center justify-center bg-white bg-opacity-75 z-20 pt-7 rounded-4xl\">\r\n                        <div class=\"animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]\">\r\n                        </div>\r\n                    </div>\r\n                )}\r\n                <div class=\"flex gap-4 items-start justify-center h-full\">\r\n                    <div\r\n                        class=\"relative flex-1 h-full p-4 rounded-4xl flex items-center justify-center\"\r\n                        style={{\r\n                            width: `${this.rgbTiff?.width * FACTOR || 0}px`,\r\n                            height: `${this.rgbTiff?.height * FACTOR || 0}px`,\r\n                        }}\r\n                    >\r\n                        <canvas\r\n                            ref={(el) => this.canvasElement = el}\r\n                            class={`absolute top-0 left-0 z-1 rounded-4xl m-auto`}\r\n                            style={{\r\n                                cursor: this.currentTool.cursor,\r\n                            }}\r\n                        >\r\n                        </canvas>\r\n                        <canvas\r\n                            ref={(el) => this.polygonCanvas = el}\r\n                            class={`absolute top-0 left-0 z-10 rounded-4xl m-auto`}\r\n                            style={{\r\n                                cursor: this.currentTool.cursor,\r\n                            }}\r\n                        >\r\n                        </canvas>\r\n                    </div>\r\n                </div>\r\n                <div class=\"flex gap-4 flex-row justify-center items-center w-full\">\r\n                    <div class=\"w-full bg-[#f3ebda] rounded-4xl p-4\">\r\n                        <h3 class=\"text-lg font-semibold mb-4 text-center\">\r\n                            {t.mapDraw.information}\r\n                        </h3>\r\n                        {currentPolygon?.details\r\n                            ? (\r\n                                <div class=\"space-y-4\">\r\n                                    <div class=\"flex flex-col gap-2\">\r\n                                        <button\r\n                                            class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#ffffff] hover:text-[#271200] transition-colors duration-200\"\r\n                                            onClick={() =>\r\n                                                this.calculateSolarPanels()}\r\n                                            style={{\r\n                                                color: \"#ffffff\",\r\n                                            }}\r\n                                        >\r\n                                            {t.mapDraw.calculateSolarPanels}\r\n                                        </button>\r\n                                        {this\r\n                                            .roofPolygonsSolarPanels[\r\n                                                currentPolygon._id\r\n                                            ] && (\r\n                                            <p class=\"text-lg text-center\">\r\n                                                {this\r\n                                                    .roofPolygonsSolarPanels[\r\n                                                        currentPolygon._id\r\n                                                    ].positionedPanels\r\n                                                    .length} {t.mapDraw.panels}\r\n                                            </p>\r\n                                        )}\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600\">\r\n                                            {t.mapDraw.area}\r\n                                        </h4>\r\n                                        <p class=\"text-lg\">\r\n                                            {currentPolygon.details?.area\r\n                                                .toFixed(2)} m²\r\n                                        </p>\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600\">\r\n                                            Orientation\r\n                                        </h4>\r\n                                        <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n                                            <input\r\n                                                class=\"text-lg w-full\"\r\n                                                onKeyDown={(e) => {\r\n                                                    if (e.key === \"Enter\") {\r\n                                                        this.handleAzimuthChange(\r\n                                                            e,\r\n                                                        );\r\n                                                        (e.target as HTMLInputElement)\r\n                                                            .blur();\r\n                                                    }\r\n                                                }}\r\n                                                value={currentPolygon\r\n                                                    .details\r\n                                                    ?.azimuth}\r\n                                            />\r\n                                            ({azimuthToCardinal(\r\n                                                currentPolygon.details\r\n                                                    ?.azimuth,\r\n                                            )})\r\n                                        </div>\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600 pl-2\">\r\n                                            {t.mapDraw.pitch}\r\n                                        </h4>\r\n                                        <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n                                            <input\r\n                                                class=\"text-lg w-full\"\r\n                                                onKeyDown={(e) => {\r\n                                                    if (e.key === \"Enter\") {\r\n                                                        this.handlePitchChange(\r\n                                                            e,\r\n                                                        );\r\n                                                        (e.target as HTMLInputElement)\r\n                                                            .blur();\r\n                                                    }\r\n                                                }}\r\n                                                value={currentPolygon\r\n                                                    .details\r\n                                                    ?.pitch}\r\n                                            />\r\n                                            °\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            )\r\n                            : (\r\n                                <p class=\"text-gray-500 text-center\">\r\n                                    {t.mapDraw.noPolygonSelected}\r\n                                </p>\r\n                            )}\r\n                    </div>\r\n                </div>\r\n                <div class=\"w-full\">\r\n                    <solar-system-form\r\n                        systemConfigs={this.roofPolygonsSolarPanels}\r\n                        language={this.language}\r\n                        roofPolygons={this.roofPolygons}\r\n                        obstructionPolygons={this.obstructionPolygons}\r\n                    />\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"map-draw.js","sourceRoot":"","sources":["../../../src/components/map-draw/map-draw.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n    Component,\r\n    Element,\r\n    h,\r\n    Listen,\r\n    Prop,\r\n    State,\r\n    Watch,\r\n} from \"@stencil/core\";\r\n\r\nimport {\r\n    renderCombinedWithZoom,\r\n    renderSolarPanel,\r\n} from \"../../utils/visualize\";\r\nimport {\r\n    BuildingInsightsResponse,\r\n    GeoTiff,\r\n    SolarPanelType,\r\n} from \"../../utils/solar\";\r\nimport { fetchSolarData, getBuildingImages } from \"../../utils/api\";\r\nimport { drawPolygon, isPointInPolygon } from \"../../utils/render/polygon\";\r\nimport { projectPointPerpendicularToLine } from \"../../utils/render/projection\";\r\nimport { Point, Polygon, SelectedPolygon } from \"../../types/shapes\";\r\nimport { moveTool, roofTool, Tool, tools } from \"../../utils/render/tools\";\r\nimport {\r\n    DEFAULT_SOLAR_EXPERT_CONFIG,\r\n    DEFAULT_SOLAR_PANEL_TYPE,\r\n    SolarExpertConfig,\r\n} from \"../../config\";\r\nimport { getFillColor } from \"../../utils/render/color\";\r\nimport { v4 as uuidv4 } from \"uuid\";\r\nimport {\r\n    azimuthToCardinal,\r\n    calculatePolygonArea,\r\n    getPixelInMeters,\r\n} from \"../../utils/utils\";\r\nimport {\r\n    getBestFittingRoofSegment,\r\n    SolarPanelSystemPart,\r\n} from \"../../utils/geometry/fitting\";\r\nimport { getOptimalSolarPositionFully } from \"../../utils/geometry/gridMatch\";\r\nimport { BORDER_INSET, DEFAULT_SUNNINESS } from \"../../constants\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n    tag: \"map-draw\",\r\n    styleUrl: \"../../output.css\",\r\n    shadow: false,\r\n})\r\nexport class MapDraw {\r\n    @Prop()\r\n    language: Language = \"en\";\r\n    @Prop()\r\n    apiKey: string = \"\";\r\n    @Prop()\r\n    latitude: number | null = null;\r\n    @Prop()\r\n    longitude: number | null = null;\r\n    @Prop()\r\n    config: SolarExpertConfig = DEFAULT_SOLAR_EXPERT_CONFIG;\r\n    @Prop()\r\n    solarPanel: SolarPanelType = DEFAULT_SOLAR_PANEL_TYPE;\r\n\r\n    @State()\r\n    showInstructions: boolean = true;\r\n    @State()\r\n    zoom: number = 1;\r\n    @State()\r\n    loadingState: \"empty\" | \"loading\" | \"loaded\" = \"empty\";\r\n    @State()\r\n    rgbTiff: GeoTiff | null = null;\r\n    @State()\r\n    draggedPointIndex: number | null = null;\r\n    @State()\r\n    hoveredPointIndex: number | null = null;\r\n    @State()\r\n    hoveredPolygon: SelectedPolygon | null = null;\r\n    @State()\r\n    shiftKeyPressed: boolean = false;\r\n    @State()\r\n    altKeyPressed: boolean = false;\r\n    @State()\r\n    mousePoint: Point | null = null;\r\n    @State()\r\n    currentTool: Tool = roofTool;\r\n    @State()\r\n    roofPolygons: { [id: string]: Polygon } = {};\r\n    @State()\r\n    roofPolygonsSolarPanels: { [id: string]: SolarPanelSystemPart } = {};\r\n    @State()\r\n    obstructionPolygons: { [id: string]: Polygon } = {};\r\n    @State()\r\n    selectedPolygon: SelectedPolygon | null = null;\r\n    @State()\r\n    buildingInsights: BuildingInsightsResponse | null = null;\r\n    @State()\r\n    pixelInMeters: number = 0.2;\r\n    @State()\r\n    showAzimuth: boolean = true; // TODO: make this false\r\n\r\n    @Element()\r\n    el: HTMLElement;\r\n    private canvasElement?: HTMLCanvasElement;\r\n    private polygonCanvas?: HTMLCanvasElement;\r\n    private polygonCtx?: CanvasRenderingContext2D;\r\n\r\n    private getCurrentPolygon(): Polygon | null {\r\n        if (!this.selectedPolygon) {\r\n            return null;\r\n        }\r\n        const { _id, type } = this.selectedPolygon;\r\n        return type === \"roof\"\r\n            ? this.roofPolygons[_id]\r\n            : this.obstructionPolygons[_id];\r\n    }\r\n\r\n    componentDidLoad() {\r\n        if (this.latitude && this.longitude) {\r\n            this.loadingState = \"loading\";\r\n            this.getBuildingInsights();\r\n            this.getBuildingImages();\r\n        }\r\n\r\n        requestAnimationFrame(() => {\r\n            if (this.canvasElement) {\r\n                const rect = this.canvasElement.getBoundingClientRect();\r\n                this.canvasElement.width = rect.width;\r\n                this.canvasElement.height = rect.height;\r\n                this.drawMap();\r\n            }\r\n        });\r\n    }\r\n\r\n    // // Initial size update\r\n    // requestAnimationFrame(() => {\r\n    //     this.updateCanvasSize();\r\n    // });\r\n    // }\r\n\r\n    // disconnectedCallback() {\r\n    //     if (this.resizeObserver) {\r\n    //         this.resizeObserver.disconnect();\r\n    //     }\r\n    // }\r\n\r\n    // private updateCanvasSize() {\r\n    //     if (!this.containerRef || !this.canvasElement || !this.polygonCanvas) {\r\n    //         return;\r\n    //     }\r\n\r\n    //     const containerRect = this.containerRef.getBoundingClientRect();\r\n    //     const containerWidth = containerRect.width;\r\n    //     const containerHeight = containerRect.height;\r\n\r\n    //     // Calculate the scale to fit the image while maintaining aspect ratio\r\n    //     if (this.rgbTiff) {\r\n    //         const imageAspect = this.rgbTiff.width / this.rgbTiff.height;\r\n    //         const containerAspect = containerWidth / containerHeight;\r\n\r\n    //         let width, height;\r\n    //         if (imageAspect > containerAspect) {\r\n    //             width = containerWidth;\r\n    //             height = containerWidth / imageAspect;\r\n    //         } else {\r\n    //             height = containerHeight;\r\n    //             width = containerHeight * imageAspect;\r\n    //         }\r\n\r\n    //         // Set the canvas dimensions\r\n    //         this.canvasElement.width = width;\r\n    //         this.canvasElement.height = height;\r\n    //         this.polygonCanvas.width = width;\r\n    //         this.polygonCanvas.height = height;\r\n    //         this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n\r\n    //         // Update zoom factor based on new size\r\n    //         this.zoom = width / this.rgbTiff.width;\r\n\r\n    //         // Force a redraw\r\n    //         this.drawMap();\r\n    //     }\r\n    // }\r\n\r\n    private sizeCanvas(width: number, height: number) {\r\n        if (this.polygonCanvas) {\r\n            this.polygonCanvas.width = width;\r\n            this.polygonCanvas.height = height;\r\n            this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n        }\r\n    }\r\n\r\n    @Watch(\"latitude\")\r\n    @Watch(\"longitude\")\r\n    async getBuildingInsights() {\r\n        if (!this.latitude || !this.longitude) {\r\n            return;\r\n        }\r\n        this.loadingState = \"loading\";\r\n\r\n        if (this.buildingInsights) {\r\n            const sameLocation =\r\n                this.buildingInsights.center.latitude === this.latitude &&\r\n                this.buildingInsights.center.longitude === this.longitude;\r\n            if (sameLocation) {\r\n                return;\r\n            }\r\n            this.obstructionPolygons = {};\r\n            this.roofPolygons = {};\r\n            this.selectedPolygon = null;\r\n            this.hoveredPolygon = null;\r\n            this.canvasElement.getContext(\"2d\")?.clearRect(\r\n                0,\r\n                0,\r\n                this.canvasElement.width,\r\n                this.canvasElement.height,\r\n            );\r\n            this.polygonCtx?.clearRect(\r\n                0,\r\n                0,\r\n                this.polygonCanvas.width,\r\n                this.polygonCanvas.height,\r\n            );\r\n            this.rgbTiff = null;\r\n        }\r\n        this.buildingInsights = await fetchSolarData(\r\n            this.latitude,\r\n            this.longitude,\r\n            this.apiKey,\r\n        );\r\n        if (!this.buildingInsights) {\r\n            alert(\"No building insights found. Please enter them manually.\");\r\n        }\r\n    }\r\n\r\n    @Watch(\"latitude\")\r\n    @Watch(\"longitude\")\r\n    async getBuildingImages() {\r\n        if (!this.latitude || !this.longitude) {\r\n            return;\r\n        }\r\n        if (this.buildingInsights) {\r\n            const sameLocation =\r\n                this.buildingInsights.center.latitude === this.latitude &&\r\n                this.buildingInsights.center.longitude === this.longitude;\r\n            if (sameLocation) {\r\n                return;\r\n            }\r\n        }\r\n        this.rgbTiff = await getBuildingImages(\r\n            this.latitude,\r\n            this.longitude,\r\n            this.apiKey,\r\n        );\r\n        this.pixelInMeters = getPixelInMeters(this.rgbTiff);\r\n        this.loadingState = \"loaded\";\r\n    }\r\n\r\n    private convertToCanvasCoordinates(event: MouseEvent): Point {\r\n        const rect = this.polygonCanvas.getBoundingClientRect();\r\n        const siteX = event.clientX - rect.left;\r\n        const siteY = event.clientY - rect.top;\r\n        return {\r\n            x: siteX / (rect.right - rect.left) * this.canvasElement.width,\r\n            y: siteY / (rect.bottom - rect.top) * this.canvasElement.height,\r\n        };\r\n    }\r\n\r\n    @Watch(\"rgbTiff\")\r\n    @Watch(\"buildingInsights\")\r\n    @Watch(\"canvasElement\")\r\n    async drawMap() {\r\n        if (\r\n            !this.canvasElement || !this.rgbTiff || !this.buildingInsights\r\n        ) return;\r\n\r\n        // Get the container dimensions\r\n        const container = this.canvasElement.parentElement;\r\n        if (!container) return;\r\n\r\n        const containerRect = container.getBoundingClientRect();\r\n        const containerWidth = containerRect.width;\r\n        const containerHeight = containerRect.height;\r\n\r\n        // Calculate the scale to fit the image while maintaining aspect ratio\r\n        const imageAspect = this.rgbTiff.width / this.rgbTiff.height;\r\n        const containerAspect = containerWidth / containerHeight;\r\n\r\n        let width, height;\r\n        if (imageAspect > containerAspect) {\r\n            width = containerWidth;\r\n            height = containerWidth / imageAspect;\r\n        } else {\r\n            height = containerHeight;\r\n            width = containerHeight * imageAspect;\r\n        }\r\n\r\n        // Set the canvas dimensions\r\n        this.canvasElement.width = width;\r\n        this.canvasElement.height = height;\r\n        this.sizeCanvas(width, height);\r\n        // this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);\r\n\r\n        // Update zoom factor based on new size\r\n        this.zoom = width / this.rgbTiff.width;\r\n\r\n        renderCombinedWithZoom({\r\n            rgb: this.rgbTiff,\r\n            zoom: this.zoom,\r\n            canvas: this.canvasElement,\r\n        });\r\n    }\r\n\r\n    @Listen(\"mousemove\", { target: \"document\" })\r\n    handleMouseMove(event: MouseEvent) {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n        // translate the website pixel coordinates to the canvas coordinates\r\n        const { x, y } = this.convertToCanvasCoordinates(event);\r\n        this.mousePoint = { x, y };\r\n\r\n        const currentPolygon = this.getCurrentPolygon();\r\n\r\n        // Check for point hover\r\n        const newHoveredPointIndex = currentPolygon?.points.findIndex(\r\n            (point) => {\r\n                const distance = Math.sqrt(\r\n                    Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n                );\r\n                return distance < 10;\r\n            },\r\n        );\r\n\r\n        // Check for polygon hover\r\n        let newHoveredPolygon = null;\r\n        for (const polygon of Object.values(this.obstructionPolygons)) {\r\n            if (isPointInPolygon({ x, y }, polygon)) {\r\n                newHoveredPolygon = { _id: polygon._id, type: \"obstruction\" };\r\n                break;\r\n            }\r\n        }\r\n        // obstruction polygons get priority\r\n        if (!newHoveredPolygon) {\r\n            for (const polygon of Object.values(this.roofPolygons)) {\r\n                if (isPointInPolygon({ x, y }, polygon)) {\r\n                    newHoveredPolygon = { _id: polygon._id, type: \"roof\" };\r\n                    break;\r\n                }\r\n            }\r\n        }\r\n\r\n        // Only redraw if hover state changed\r\n        if (\r\n            newHoveredPointIndex !== this.hoveredPointIndex ||\r\n            JSON.stringify(newHoveredPolygon) !==\r\n                JSON.stringify(this.hoveredPolygon)\r\n        ) {\r\n            this.hoveredPointIndex = newHoveredPointIndex;\r\n            this.hoveredPolygon = newHoveredPolygon;\r\n            this.drawPolygons();\r\n        }\r\n\r\n        // Handle dragging\r\n        if (\r\n            this.draggedPointIndex !== null && currentPolygon &&\r\n            this.currentTool.name === \"move\"\r\n        ) {\r\n            currentPolygon.points[this.draggedPointIndex] = { x, y };\r\n            this.drawPolygons();\r\n        }\r\n\r\n        if (this.shiftKeyPressed) {\r\n            this.drawPolygons();\r\n        }\r\n    }\r\n\r\n    private drawPolygons() {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n        // Clear the canvas and redraw the map\r\n        this.polygonCtx.clearRect(\r\n            0,\r\n            0,\r\n            this.polygonCanvas.width,\r\n            this.polygonCanvas.height,\r\n        );\r\n\r\n        // draw roof polygons\r\n        for (const polygon of Object.values(this.roofPolygons)) {\r\n            const fillColor = getFillColor(\r\n                this.selectedPolygon,\r\n                this.hoveredPolygon,\r\n                polygon._id,\r\n                polygon,\r\n                this.config,\r\n            );\r\n\r\n            drawPolygon({\r\n                polygonCtx: this.polygonCtx,\r\n                polygonCanvas: this.polygonCanvas,\r\n                polygon,\r\n                strokeColor: polygon.closed\r\n                    ? this.config.closedRoofColor\r\n                    : this.config.openRoofColor,\r\n                fillColor,\r\n                pixelInMeters: this.pixelInMeters,\r\n                shiftKeyPressed: this.shiftKeyPressed,\r\n                mousePoint: this.mousePoint,\r\n            });\r\n\r\n            const solarPanels = this.roofPolygonsSolarPanels[polygon._id];\r\n            const convertedSolarPanel: SolarPanelType = {\r\n                ...this.solarPanel,\r\n                widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n                heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n            };\r\n            if (solarPanels) {\r\n                for (const panel of solarPanels.positionedPanels) {\r\n                    renderSolarPanel(\r\n                        panel,\r\n                        this.polygonCtx,\r\n                        convertedSolarPanel.widthMeters,\r\n                        convertedSolarPanel.heightMeters,\r\n                        polygon.details?.azimuth,\r\n                        polygon.details?.pitch,\r\n                    );\r\n                }\r\n            }\r\n        }\r\n\r\n        // draw obstruction polygons\r\n        for (const polygon of Object.values(this.obstructionPolygons)) {\r\n            const fillColor = getFillColor(\r\n                this.selectedPolygon,\r\n                this.hoveredPolygon,\r\n                polygon._id,\r\n                polygon,\r\n                this.config,\r\n            );\r\n\r\n            drawPolygon({\r\n                polygonCtx: this.polygonCtx,\r\n                polygonCanvas: this.polygonCanvas,\r\n                polygon,\r\n                pixelInMeters: this.pixelInMeters,\r\n                shiftKeyPressed: this.shiftKeyPressed,\r\n                mousePoint: this.mousePoint,\r\n                strokeColor: polygon.closed\r\n                    ? this.config.closedObstructionColor\r\n                    : this.config.openObstructionColor,\r\n                fillColor,\r\n            });\r\n        }\r\n\r\n        // if (this.showAzimuth && this.selectedPolygon) {\r\n        //     const currentPolygon = this.getCurrentPolygon();\r\n        //     renderAzimuth(currentPolygon.details?.azimuth, this.polygonCtx);\r\n        // }\r\n    }\r\n\r\n    private deletePolygon(_id: string) {\r\n        if (this.selectedPolygon?._id === _id) {\r\n            this.selectedPolygon = null;\r\n        }\r\n        if (this.roofPolygons[_id]) {\r\n            delete this.roofPolygons[_id];\r\n            delete this.roofPolygonsSolarPanels[_id];\r\n        }\r\n        if (this.obstructionPolygons[_id]) {\r\n            delete this.obstructionPolygons[_id];\r\n        }\r\n    }\r\n\r\n    @Listen(\"keydown\", { target: \"document\" })\r\n    handleKeyDown(event: KeyboardEvent) {\r\n        if (event.target instanceof HTMLInputElement) {\r\n            return;\r\n        }\r\n        // Handle shift key for perpendicular points\r\n        if (event.shiftKey && !this.shiftKeyPressed) {\r\n            this.shiftKeyPressed = true;\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n        if (event.altKey && !this.altKeyPressed) {\r\n            this.altKeyPressed = true;\r\n            return;\r\n        }\r\n        if (\r\n            (event.key === \"Delete\" || event.key === \"Backspace\") &&\r\n            this.selectedPolygon\r\n        ) {\r\n            const currentPolygon = this.getCurrentPolygon();\r\n            if (currentPolygon.closed) {\r\n                this.deletePolygon(currentPolygon._id);\r\n                this.drawPolygons();\r\n                return;\r\n            }\r\n            currentPolygon.points.pop();\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        // Handle tool selection shortcuts\r\n        const pressedKey = event.key.toLowerCase();\r\n        const tool = tools.find((t) =>\r\n            t.keyboardShortcut?.toLowerCase() === pressedKey\r\n        );\r\n        if (tool) {\r\n            this.currentTool = tool;\r\n        }\r\n    }\r\n\r\n    @Listen(\"keyup\", { target: \"document\" })\r\n    handleKeyUp(event: KeyboardEvent) {\r\n        if (!event.shiftKey && this.shiftKeyPressed) {\r\n            this.shiftKeyPressed = false;\r\n            this.drawPolygons();\r\n        }\r\n        if (!event.altKey && this.altKeyPressed) {\r\n            this.altKeyPressed = false;\r\n        }\r\n    }\r\n\r\n    @Listen(\"mousedown\", { target: \"document\" })\r\n    handleMouseDown(event: MouseEvent) {\r\n        if (!this.polygonCanvas || !this.polygonCtx) return;\r\n        if (!this.polygonCanvas.contains(event.target as Node)) return;\r\n\r\n        let { x, y } = this.convertToCanvasCoordinates(event);\r\n\r\n        if (this.currentTool.name === \"delete\") {\r\n            if (!this.hoveredPolygon) {\r\n                return;\r\n            }\r\n            const { _id, type } = this.hoveredPolygon;\r\n            if (type === \"roof\") {\r\n                delete this.roofPolygons[_id];\r\n                delete this.roofPolygonsSolarPanels[_id];\r\n            } else if (type === \"obstruction\") {\r\n                delete this.obstructionPolygons[_id];\r\n            }\r\n            this.hoveredPolygon = null;\r\n            if (this.selectedPolygon?._id === _id) {\r\n                this.selectedPolygon = null;\r\n            }\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n        if (this.currentTool.name === \"move\") {\r\n            // Check if we're clicking on a point of the selected polygon\r\n            if (this.selectedPolygon) {\r\n                const currentPolygon = this.getCurrentPolygon();\r\n                const pointIndex = currentPolygon?.points.findIndex((point) => {\r\n                    const distance = Math.sqrt(\r\n                        Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n                    );\r\n                    return distance < 10;\r\n                });\r\n                if (pointIndex !== undefined && pointIndex !== -1) {\r\n                    this.draggedPointIndex = pointIndex;\r\n                    return;\r\n                }\r\n\r\n                if (this.hoveredPolygon) {\r\n                    this.selectedPolygon = this.hoveredPolygon;\r\n                    return;\r\n                }\r\n            }\r\n            this.selectedPolygon = null;\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        if (!this.selectedPolygon || this.getCurrentPolygon()?.closed) {\r\n            // no polygon is active, create a new one\r\n            const newPolygon: Polygon = {\r\n                _id: uuidv4(),\r\n                points: [{ x, y }],\r\n                type: this.currentTool.name,\r\n                closed: false,\r\n            };\r\n            let _id;\r\n            if (this.currentTool.name === \"roof\") {\r\n                this.roofPolygons = {\r\n                    ...this.roofPolygons,\r\n                    [newPolygon._id]: newPolygon,\r\n                };\r\n                _id = newPolygon._id;\r\n            } else if (this.currentTool.name === \"obstruction\") {\r\n                this.obstructionPolygons = {\r\n                    ...this.obstructionPolygons,\r\n                    [newPolygon._id]: newPolygon,\r\n                };\r\n                _id = newPolygon._id;\r\n            }\r\n            this.selectedPolygon = { _id, type: this.currentTool.name };\r\n            this.drawPolygons();\r\n            return;\r\n        }\r\n\r\n        const { _id, type } = this.selectedPolygon;\r\n        const currentPolygon = type === \"roof\"\r\n            ? this.roofPolygons[_id]\r\n            : this.obstructionPolygons[_id];\r\n\r\n        if (currentPolygon.closed) {\r\n            return;\r\n        }\r\n\r\n        // If we have at least one point, check if we're clicking near the first point\r\n        if (currentPolygon.points.length > 2) {\r\n            const firstPoint = currentPolygon.points[0];\r\n            const distance = Math.sqrt(\r\n                Math.pow(x - firstPoint.x, 2) + Math.pow(y - firstPoint.y, 2),\r\n            );\r\n\r\n            if (distance < 10) {\r\n                this.closePolygon();\r\n                return;\r\n            }\r\n        }\r\n\r\n        // Handle shift key for perpendicular points\r\n        if (event.shiftKey && currentPolygon?.points.length >= 2) {\r\n            const projectedPoint = projectPointPerpendicularToLine({\r\n                x,\r\n                y,\r\n                lastPoint:\r\n                    currentPolygon.points[currentPolygon.points.length - 1],\r\n                secondLastPoint:\r\n                    currentPolygon.points[currentPolygon.points.length - 2],\r\n            });\r\n            x = projectedPoint.x;\r\n            y = projectedPoint.y;\r\n        }\r\n\r\n        currentPolygon.points = [...currentPolygon.points, { x, y }];\r\n        this.drawPolygons();\r\n    }\r\n\r\n    @Listen(\"mouseup\", { target: \"document\" })\r\n    handleMouseUp() {\r\n        this.draggedPointIndex = null;\r\n    }\r\n\r\n    private closePolygon() {\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (\r\n            currentPolygon.points.length >= 3 &&\r\n            (this.currentTool.name === \"roof\" ||\r\n                this.currentTool.name === \"obstruction\")\r\n        ) {\r\n            currentPolygon.closed = true;\r\n        }\r\n\r\n        if (currentPolygon.type === \"roof\") {\r\n            // Calculate basic polygon details\r\n            const metersInPixels = 1 / this.pixelInMeters;\r\n            const area = calculatePolygonArea(currentPolygon.points) /\r\n                (metersInPixels * metersInPixels);\r\n            const bestMatch = getBestFittingRoofSegment(\r\n                currentPolygon,\r\n                this.buildingInsights?.solarPotential.roofSegmentStats,\r\n                this.rgbTiff.bounds,\r\n                this.canvasElement,\r\n            );\r\n\r\n            if (bestMatch) {\r\n                currentPolygon.details = {\r\n                    area,\r\n                    azimuth: bestMatch.azimuthDegrees,\r\n                    pitch: bestMatch.pitchDegrees,\r\n                };\r\n            } else {\r\n                currentPolygon.details = {\r\n                    area,\r\n                    azimuth: 0,\r\n                    pitch: 0,\r\n                };\r\n            }\r\n        }\r\n\r\n        this.drawPolygons();\r\n        this.currentTool = moveTool;\r\n    }\r\n\r\n    private calculateSolarPanels() {\r\n        const currentPolygon = this.getCurrentPolygon();\r\n\r\n        if (!currentPolygon.details) {\r\n            return;\r\n        }\r\n\r\n        if (this.roofPolygonsSolarPanels[currentPolygon._id]) {\r\n            delete this.roofPolygonsSolarPanels[currentPolygon._id];\r\n        }\r\n\r\n        const convertedSolarPanel: SolarPanelType = {\r\n            ...this.solarPanel,\r\n            widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n            heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n        };\r\n        const inset = BORDER_INSET / this.pixelInMeters;\r\n        const solarPanels = getOptimalSolarPositionFully(\r\n            currentPolygon,\r\n            Object.values(this.obstructionPolygons),\r\n            convertedSolarPanel,\r\n            currentPolygon.details?.azimuth,\r\n            inset,\r\n            currentPolygon.details?.pitch,\r\n        );\r\n        this.roofPolygonsSolarPanels = {\r\n            ...this.roofPolygonsSolarPanels,\r\n            [currentPolygon._id]: {\r\n                positionedPanels: solarPanels,\r\n                sunniness: currentPolygon.details?.assignedRoofStats?.stats\r\n                    .sunshineQuantiles[5] ??\r\n                    this.buildingInsights.solarPotential.buildingStats\r\n                        .sunshineQuantiles[5] ??\r\n                    DEFAULT_SUNNINESS,\r\n            },\r\n        };\r\n        this.drawPolygons();\r\n    }\r\n\r\n    private handlePitchChange(event: Event) {\r\n        const target = event.target as HTMLInputElement;\r\n        const pitch = parseFloat(target.value);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (currentPolygon) {\r\n            this.roofPolygons[currentPolygon._id].details.pitch = pitch;\r\n        }\r\n        if (\r\n            currentPolygon.type === \"roof\" &&\r\n            this.roofPolygonsSolarPanels[currentPolygon._id]\r\n        ) {\r\n            this.calculateSolarPanels();\r\n            return;\r\n        }\r\n    }\r\n\r\n    private handleAzimuthChange(event: Event) {\r\n        const target = event.target as HTMLInputElement;\r\n        const azimuth = parseFloat(target.value);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        if (currentPolygon) {\r\n            this.roofPolygons[currentPolygon._id].details.azimuth = azimuth;\r\n        }\r\n        if (\r\n            currentPolygon.type === \"roof\" &&\r\n            this.roofPolygonsSolarPanels[currentPolygon._id]\r\n        ) {\r\n            this.calculateSolarPanels();\r\n            return;\r\n        }\r\n    }\r\n\r\n    private handleToolSelect(tool: Tool) {\r\n        this.currentTool = tool;\r\n    }\r\n\r\n    render() {\r\n        const t = getLanguageStrings(this.language);\r\n        const currentPolygon = this.getCurrentPolygon();\r\n        return (\r\n            <div class=\"flex flex-col justify-center items-center w-full h-full gap-4\">\r\n                {this.showInstructions && (\r\n                    <div\r\n                        class=\"w-full rounded-4xl p-4\"\r\n                        style={{\r\n                            backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n                        }}\r\n                    >\r\n                        After you have searched and selected your address.\r\n                        Highlight the part of your roof that you want to add\r\n                        solar panels to. Mark each surface with a polygon with\r\n                        the roof tool{\" \"}\r\n                        <icon-selector name=\"house\" inline={true} />{\" \"}\r\n                        . If you have skylights or other obstructions where you\r\n                        don't want to add solar panels, mark those as well with\r\n                        the obstruction tool{\" \"}\r\n                        <icon-selector name=\"octagon-minus\" inline={true} />.\r\n                        You can delete polygons with the delete tool{\" \"}\r\n                        <icon-selector name=\"eraser\" inline={true} />. If you\r\n                        want to change the azimuth or pitch of a polygon, select\r\n                        the move tool{\" \"}\r\n                        <icon-selector name=\"move\" inline={true} />, select the\r\n                        polygon you want to change and drag and drop the edges.\r\n                    </div>\r\n                )}\r\n                <div class=\"flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full\">\r\n                    {tools.map((tool) => {\r\n                        const toolStrings = t.mapDraw.tools[tool.name];\r\n                        return (\r\n                            <button\r\n                                class={`px-4 py-2 rounded-4xl transition-colors duration-200 hover:bg-[#ffffff] ${\r\n                                    this.currentTool.name === tool.name\r\n                                        ? \"bg-[#271200] hover:bg-gray-500\"\r\n                                        : \"bg-[#f3ebda] hover:bg-[#ffffff]\"\r\n                                }`}\r\n                                style={{\r\n                                    color: this.currentTool.name === tool.name\r\n                                        ? \"#ffffff\"\r\n                                        : \"#000000\",\r\n                                }}\r\n                                aria-label={toolStrings.ariaLabel}\r\n                                title={toolStrings.explanation}\r\n                                onClick={() => this.handleToolSelect(tool)}\r\n                            >\r\n                                <div class=\"flex items-center gap-1 flex-col\">\r\n                                    <icon-selector name={tool.icon} />\r\n                                    <span>{toolStrings.name}</span>\r\n                                </div>\r\n                            </button>\r\n                        );\r\n                    })}\r\n                </div>\r\n                {this.loadingState === \"empty\" && (\r\n                    <div class=\"w-full\">\r\n                        <p\r\n                            class=\"text-white text-center flex items-center justify-center rounded-4xl p-4 w-full\"\r\n                            style={{\r\n                                backgroundColor: \"rgba(0, 0, 0, 0.5)\",\r\n                            }}\r\n                        >\r\n                            {t.mapDraw.noAddressSelected}\r\n                        </p>\r\n                    </div>\r\n                )}\r\n                {(this.latitude && this.longitude &&\r\n                    this.loadingState === \"loading\") && (\r\n                    <div class=\"flex items-center justify-center w-full bg-opacity-75 z-20 pt-7 rounded-4xl\">\r\n                        <div class=\"animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]\">\r\n                        </div>\r\n                    </div>\r\n                )}\r\n                <div class=\"flex items-start justify-center h-full w-full bg-[#f3ebda] rounded-4xl\">\r\n                    <div\r\n                        class=\"relative h-full flex items-center justify-center w-full rounded-4xl bg-[#271200]\"\r\n                        style={{\r\n                            aspectRatio: this.rgbTiff\r\n                                ? `${this.rgbTiff.width}/${this.rgbTiff.height}`\r\n                                : \"1/1\",\r\n                        }}\r\n                    >\r\n                        <canvas\r\n                            ref={(el) => this.canvasElement = el}\r\n                            class=\"absolute top-0 left-0 w-full h-full rounded-4xl\"\r\n                            style={{\r\n                                cursor: this.currentTool.cursor,\r\n                            }}\r\n                        >\r\n                        </canvas>\r\n                        <canvas\r\n                            ref={(el) => this.polygonCanvas = el}\r\n                            class=\"absolute top-0 left-0 w-full h-full rounded-4xl\"\r\n                            style={{\r\n                                cursor: this.currentTool.cursor,\r\n                            }}\r\n                        >\r\n                        </canvas>\r\n                    </div>\r\n                </div>\r\n                <div class=\"flex gap-4 flex-row justify-center items-center w-full\">\r\n                    <div class=\"w-full bg-[#f3ebda] rounded-4xl p-4\">\r\n                        <h3 class=\"text-lg font-semibold mb-4 text-center\">\r\n                            {t.mapDraw.information}\r\n                        </h3>\r\n                        {currentPolygon?.details\r\n                            ? (\r\n                                <div class=\"space-y-4\">\r\n                                    <div class=\"flex flex-col gap-2\">\r\n                                        <button\r\n                                            class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#ffffff] hover:text-[#271200] transition-colors duration-200\"\r\n                                            onClick={() =>\r\n                                                this.calculateSolarPanels()}\r\n                                            style={{\r\n                                                color: \"#ffffff\",\r\n                                            }}\r\n                                        >\r\n                                            {t.mapDraw.calculateSolarPanels}\r\n                                        </button>\r\n                                        {this\r\n                                            .roofPolygonsSolarPanels[\r\n                                                currentPolygon._id\r\n                                            ] && (\r\n                                            <p class=\"text-lg text-center\">\r\n                                                {this\r\n                                                    .roofPolygonsSolarPanels[\r\n                                                        currentPolygon._id\r\n                                                    ].positionedPanels\r\n                                                    .length} {t.mapDraw.panels}\r\n                                            </p>\r\n                                        )}\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600\">\r\n                                            {t.mapDraw.area}\r\n                                        </h4>\r\n                                        <p class=\"text-lg\">\r\n                                            {currentPolygon.details?.area\r\n                                                .toFixed(2)} m²\r\n                                        </p>\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600\">\r\n                                            {t.mapDraw.azimuth}\r\n                                        </h4>\r\n                                        <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n                                            <input\r\n                                                class=\"text-lg w-full\"\r\n                                                onKeyDown={(e) => {\r\n                                                    if (e.key === \"Enter\") {\r\n                                                        this.handleAzimuthChange(\r\n                                                            e,\r\n                                                        );\r\n                                                        (e.target as HTMLInputElement)\r\n                                                            .blur();\r\n                                                    }\r\n                                                }}\r\n                                                value={currentPolygon\r\n                                                    .details\r\n                                                    ?.azimuth}\r\n                                            />\r\n                                            ({azimuthToCardinal(\r\n                                                currentPolygon.details\r\n                                                    ?.azimuth,\r\n                                            )})\r\n                                        </div>\r\n                                        <input\r\n                                            type=\"range\"\r\n                                            min=\"0\"\r\n                                            max=\"360\"\r\n                                            class=\"w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white\"\r\n                                            value={currentPolygon\r\n                                                .details?.azimuth}\r\n                                            onInput={(e) => {\r\n                                                const target = e\r\n                                                    .target as HTMLInputElement;\r\n                                                const azimuth = parseFloat(\r\n                                                    target.value,\r\n                                                );\r\n                                                currentPolygon.details\r\n                                                    .azimuth = azimuth;\r\n                                                if (\r\n                                                    currentPolygon\r\n                                                            .type ===\r\n                                                        \"roof\" &&\r\n                                                    this.roofPolygonsSolarPanels[\r\n                                                        currentPolygon\r\n                                                            ._id\r\n                                                    ]\r\n                                                ) {\r\n                                                    this.calculateSolarPanels();\r\n                                                }\r\n                                            }}\r\n                                        />\r\n                                    </div>\r\n                                    <div>\r\n                                        <h4 class=\"text-sm font-medium text-gray-600 pl-2\">\r\n                                            {t.mapDraw.pitch}\r\n                                        </h4>\r\n                                        <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n                                            <input\r\n                                                class=\"text-lg w-full\"\r\n                                                onKeyDown={(e) => {\r\n                                                    if (e.key === \"Enter\") {\r\n                                                        this.handlePitchChange(\r\n                                                            e,\r\n                                                        );\r\n                                                        (e.target as HTMLInputElement)\r\n                                                            .blur();\r\n                                                    }\r\n                                                }}\r\n                                                value={currentPolygon\r\n                                                    .details\r\n                                                    ?.pitch}\r\n                                            />\r\n                                            °\r\n                                        </div>\r\n                                        <input\r\n                                            type=\"range\"\r\n                                            min=\"0\"\r\n                                            max=\"90\"\r\n                                            class=\"w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white\"\r\n                                            value={currentPolygon\r\n                                                .details?.pitch}\r\n                                            onInput={(e) => {\r\n                                                const target = e\r\n                                                    .target as HTMLInputElement;\r\n                                                const pitch = parseFloat(\r\n                                                    target.value,\r\n                                                );\r\n                                                currentPolygon.details\r\n                                                    .pitch = pitch;\r\n                                                if (\r\n                                                    currentPolygon\r\n                                                            .type ===\r\n                                                        \"roof\" &&\r\n                                                    this.roofPolygonsSolarPanels[\r\n                                                        currentPolygon\r\n                                                            ._id\r\n                                                    ]\r\n                                                ) {\r\n                                                    this.calculateSolarPanels();\r\n                                                }\r\n                                            }}\r\n                                        />\r\n                                    </div>\r\n                                </div>\r\n                            )\r\n                            : (\r\n                                <p class=\"text-gray-500 text-center\">\r\n                                    {t.mapDraw.noPolygonSelected}\r\n                                </p>\r\n                            )}\r\n                    </div>\r\n                </div>\r\n                <div class=\"w-full\">\r\n                    <solar-system-form\r\n                        systemConfigs={this.roofPolygonsSolarPanels}\r\n                        language={this.language}\r\n                        roofPolygons={this.roofPolygons}\r\n                        obstructionPolygons={this.obstructionPolygons}\r\n                    />\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/dist/collection/components/solar-expert/solar-expert.js

@@ -5,8 +5,8 @@ export class SolarExpert {
     el;
     apiKey = Env.GOOGLE_MAPS_API_KEY;
     language = "en";
-    latitude = null;
-    longitude = null;
+    latitude = 49.40004754661986;
+    longitude = 8.695138526494068;
     isLoaded = false;
     autocomplete = null;
     place = null;
@@ -40,7 +40,7 @@ export class SolarExpert {
     }
     render() {
         const t = getLanguageStrings(this.language);
-        return (h("div", { key: '903ebe90b101a4fe38e3f63e4d5bf1dd739b64a8', class: "flex flex-col w-full h-full p-3 max-w-2xl m-auto" }, h("div", { key: '02263768bf02acf0d16569ef4e700493f8ecc271', class: "pb-3" }, h("div", { key: '3acce218a79e83001b0206251c92d76e31408ab8', class: "relative" }, h("div", { key: '46ef67fec6c5f02fbc9e665715aa8df86426b9e7', class: "absolute left-3 top-1/2 transform -translate-y-1/2" }, h("search-icon", { key: 'df7a34a638f668cd75b6f680397599f257b9327b' })), h("input", { key: '28cddff50fac67c9d0204ec1d20ec9171cdb4a38', ref: (el) => this.inputElement = el, type: "text", placeholder: t.solarExpert.searchPlaceholder, class: "w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white" }))), h("map-draw", { key: '74f2e7b1326b874c179ad6e5e323effc419c74b6', latitude: this.latitude, longitude: this.longitude, apiKey: this.apiKey, language: this.language })));
+        return (h("div", { key: 'd6a613b4954410776aa0e4d01caa1be5e7a30fd4', class: "flex flex-col w-full h-full p-3 max-w-2xl m-auto" }, h("div", { key: '6e7fa8d45ee6061f3e4efd0171f2a6fae5b3ff79', class: "pb-3" }, h("div", { key: 'bc30fe81f02f78d70c219e0a8c4484137686ce76', class: "relative" }, h("div", { key: '27ef7031466bc5f92ff87ceafa1b0a78eef67313', class: "absolute left-3 top-1/2 transform -translate-y-1/2" }, h("search-icon", { key: 'abbffcdff555a299ffe25adaa1d6241fb1dc4171' })), h("input", { key: '407fbb8f8ac6e07eba1688f7e76295b7383783bb', ref: (el) => this.inputElement = el, type: "text", placeholder: t.solarExpert.searchPlaceholder, class: "w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white" }))), h("map-draw", { key: '0b149a4d7f6166a2d0a3585ed756d74c6a308f1e', latitude: this.latitude, longitude: this.longitude, apiKey: this.apiKey, language: this.language })));
     }
     static get is() { return "solar-expert"; }
     static get originalStyleUrls() {

package/dist/collection/components/solar-expert/solar-expert.js.map

@@ -1 +1 @@
-{"version":3,"file":"solar-expert.js","sourceRoot":"","sources":["../../../src/components/solar-expert/solar-expert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAO9D,MAAM,OAAO,WAAW;IAEpB,EAAE,CAAe;IAGjB,MAAM,GAAW,GAAG,CAAC,mBAAmB,CAAC;IAEzC,QAAQ,GAAa,IAAI,CAAC;IAG1B,QAAQ,GAAkB,IAAI,CAAC;IAE/B,SAAS,GAAkB,IAAI,CAAC;IAEhC,QAAQ,GAAY,KAAK,CAAC;IAE1B,YAAY,GAA2C,IAAI,CAAC;IAE5D,KAAK,GAA0C,IAAI,CAAC;IAE5C,YAAY,CAAoB;IAExC,iBAAiB;QACb,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAChC,CAAC;IAEO,KAAK,CAAC,oBAAoB;QAC9B,IAAI,CAAC;YACD,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;gBACtB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,SAAS,EAAE,CAAC,QAAQ,CAAC;aACxB,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YACpD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QACxC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACxD,CAAC;IACL,CAAC;IAEO,sBAAsB,CAC1B,MAAiC;QAEjC,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QACjD,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAE/D,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,eAAe,EAAE,GAAG,EAAE;YAChD,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAE,CAAC;YAC5C,IAAI,CAAC,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;YACtD,IAAI,CAAC,SAAS,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACP,CAAC;IAED,MAAM;QACF,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5C,OAAO,CACH,4DAAK,KAAK,EAAC,kDAAkD;YACzD,4DAAK,KAAK,EAAC,MAAM;gBACb,4DAAK,KAAK,EAAC,UAAU;oBACjB,4DAAK,KAAK,EAAC,oDAAoD;wBAC3D,qEAAe,CACb;oBACN,8DACI,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,EACnC,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,iBAAiB,EAC5C,KAAK,EAAC,wHAAwH,GAChI,CACA,CACJ;YACN,iEACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACzB,CACA,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n    tag: \"solar-expert\",\r\n    shadow: false,\r\n    styleUrl: \"../../output.css\",\r\n})\r\nexport class SolarExpert {\r\n    @Element()\r\n    el!: HTMLElement;\r\n\r\n    @Prop()\r\n    apiKey: string = Env.GOOGLE_MAPS_API_KEY;\r\n    @Prop()\r\n    language: Language = \"en\";\r\n\r\n    @State()\r\n    latitude: number | null = null;\r\n    @State()\r\n    longitude: number | null = null;\r\n    @State()\r\n    isLoaded: boolean = false;\r\n    @State()\r\n    autocomplete: google.maps.places.Autocomplete | null = null;\r\n    @State()\r\n    place: google.maps.places.PlaceResult | null = null;\r\n\r\n    private inputElement?: HTMLInputElement;\r\n\r\n    componentWillLoad() {\r\n        this.loadGoogleMapsScript();\r\n    }\r\n\r\n    private async loadGoogleMapsScript() {\r\n        try {\r\n            const loader = new Loader({\r\n                apiKey: this.apiKey,\r\n                libraries: [\"places\"],\r\n            });\r\n\r\n            const places = await loader.importLibrary(\"places\");\r\n            this.isLoaded = true;\r\n            this.initializeAutocomplete(places);\r\n        } catch (error) {\r\n            console.error(\"Error loading Google Maps: \", error);\r\n        }\r\n    }\r\n\r\n    private initializeAutocomplete(\r\n        places: google.maps.PlacesLibrary,\r\n    ) {\r\n        if (!this.inputElement || !this.isLoaded) return;\r\n        this.autocomplete = new places.Autocomplete(this.inputElement);\r\n\r\n        this.autocomplete.addListener(\"place_changed\", () => {\r\n            const place = this.autocomplete?.getPlace();\r\n            this.latitude = place?.geometry?.location?.lat() ?? 0;\r\n            this.longitude = place?.geometry?.location?.lng() ?? 0;\r\n        });\r\n    }\r\n\r\n    render() {\r\n        const t = getLanguageStrings(this.language);\r\n        return (\r\n            <div class=\"flex flex-col w-full h-full p-3 max-w-2xl m-auto\">\r\n                <div class=\"pb-3\">\r\n                    <div class=\"relative\">\r\n                        <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2\">\r\n                            <search-icon />\r\n                        </div>\r\n                        <input\r\n                            ref={(el) => this.inputElement = el}\r\n                            type=\"text\"\r\n                            placeholder={t.solarExpert.searchPlaceholder}\r\n                            class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white\"\r\n                        />\r\n                    </div>\r\n                </div>\r\n                <map-draw\r\n                    latitude={this.latitude}\r\n                    longitude={this.longitude}\r\n                    apiKey={this.apiKey}\r\n                    language={this.language}\r\n                />\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"solar-expert.js","sourceRoot":"","sources":["../../../src/components/solar-expert/solar-expert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAO9D,MAAM,OAAO,WAAW;IAEpB,EAAE,CAAe;IAGjB,MAAM,GAAW,GAAG,CAAC,mBAAmB,CAAC;IAEzC,QAAQ,GAAa,IAAI,CAAC;IAG1B,QAAQ,GAAkB,iBAAiB,CAAC;IAE5C,SAAS,GAAkB,iBAAiB,CAAC;IAE7C,QAAQ,GAAY,KAAK,CAAC;IAE1B,YAAY,GAA2C,IAAI,CAAC;IAE5D,KAAK,GAA0C,IAAI,CAAC;IAE5C,YAAY,CAAoB;IAExC,iBAAiB;QACb,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAChC,CAAC;IAEO,KAAK,CAAC,oBAAoB;QAC9B,IAAI,CAAC;YACD,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;gBACtB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,SAAS,EAAE,CAAC,QAAQ,CAAC;aACxB,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YACpD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QACxC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACxD,CAAC;IACL,CAAC;IAEO,sBAAsB,CAC1B,MAAiC;QAEjC,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QACjD,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAE/D,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,eAAe,EAAE,GAAG,EAAE;YAChD,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAE,CAAC;YAC5C,IAAI,CAAC,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;YACtD,IAAI,CAAC,SAAS,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACP,CAAC;IAED,MAAM;QACF,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5C,OAAO,CACH,4DAAK,KAAK,EAAC,kDAAkD;YACzD,4DAAK,KAAK,EAAC,MAAM;gBACb,4DAAK,KAAK,EAAC,UAAU;oBACjB,4DAAK,KAAK,EAAC,oDAAoD;wBAC3D,qEAAe,CACb;oBACN,8DACI,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,EACnC,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,iBAAiB,EAC5C,KAAK,EAAC,wHAAwH,GAChI,CACA,CACJ;YACN,iEACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACzB,CACA,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n    tag: \"solar-expert\",\r\n    shadow: false,\r\n    styleUrl: \"../../output.css\",\r\n})\r\nexport class SolarExpert {\r\n    @Element()\r\n    el!: HTMLElement;\r\n\r\n    @Prop()\r\n    apiKey: string = Env.GOOGLE_MAPS_API_KEY;\r\n    @Prop()\r\n    language: Language = \"en\";\r\n\r\n    @State()\r\n    latitude: number | null = 49.40004754661986;\r\n    @State()\r\n    longitude: number | null = 8.695138526494068;\r\n    @State()\r\n    isLoaded: boolean = false;\r\n    @State()\r\n    autocomplete: google.maps.places.Autocomplete | null = null;\r\n    @State()\r\n    place: google.maps.places.PlaceResult | null = null;\r\n\r\n    private inputElement?: HTMLInputElement;\r\n\r\n    componentWillLoad() {\r\n        this.loadGoogleMapsScript();\r\n    }\r\n\r\n    private async loadGoogleMapsScript() {\r\n        try {\r\n            const loader = new Loader({\r\n                apiKey: this.apiKey,\r\n                libraries: [\"places\"],\r\n            });\r\n\r\n            const places = await loader.importLibrary(\"places\");\r\n            this.isLoaded = true;\r\n            this.initializeAutocomplete(places);\r\n        } catch (error) {\r\n            console.error(\"Error loading Google Maps: \", error);\r\n        }\r\n    }\r\n\r\n    private initializeAutocomplete(\r\n        places: google.maps.PlacesLibrary,\r\n    ) {\r\n        if (!this.inputElement || !this.isLoaded) return;\r\n        this.autocomplete = new places.Autocomplete(this.inputElement);\r\n\r\n        this.autocomplete.addListener(\"place_changed\", () => {\r\n            const place = this.autocomplete?.getPlace();\r\n            this.latitude = place?.geometry?.location?.lat() ?? 0;\r\n            this.longitude = place?.geometry?.location?.lng() ?? 0;\r\n        });\r\n    }\r\n\r\n    render() {\r\n        const t = getLanguageStrings(this.language);\r\n        return (\r\n            <div class=\"flex flex-col w-full h-full p-3 max-w-2xl m-auto\">\r\n                <div class=\"pb-3\">\r\n                    <div class=\"relative\">\r\n                        <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2\">\r\n                            <search-icon />\r\n                        </div>\r\n                        <input\r\n                            ref={(el) => this.inputElement = el}\r\n                            type=\"text\"\r\n                            placeholder={t.solarExpert.searchPlaceholder}\r\n                            class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white\"\r\n                        />\r\n                    </div>\r\n                </div>\r\n                <map-draw\r\n                    latitude={this.latitude}\r\n                    longitude={this.longitude}\r\n                    apiKey={this.apiKey}\r\n                    language={this.language}\r\n                />\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}