@smarterplan/ngx-smarterplan-locations 0.2.6 → 0.2.8

package/esm2020/public-api.mjs

@@ -6,4 +6,4 @@ export * from './lib/ngx-smarterplan-locations.module';
 // Components
 export * from './lib/components/locations/map/map.component';
 export * from './lib/components/tab-navigation/tab-navigation.component';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1zbWFydGVycGxhbi1sb2NhdGlvbnMvc3JjL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLHlDQUF5QyxDQUFDO0FBQ3hELGNBQWMsd0NBQXdDLENBQUM7QUFFdkQsYUFBYTtBQUViLGNBQWMsOENBQThDLENBQUM7QUFDN0QsY0FBYywwREFBMEQsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygbmd4LXNtYXJ0ZXJwbGFuLWxvY2F0aW9uc1xuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vbGliL25neC1zbWFydGVycGxhbi1sb2NhdGlvbnMuc2VydmljZSc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9uZ3gtc21hcnRlcnBsYW4tbG9jYXRpb25zLm1vZHVsZSc7XG5cbi8vIENvbXBvbmVudHNcblxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9sb2NhdGlvbnMvbWFwL21hcC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy90YWItbmF2aWdhdGlvbi90YWItbmF2aWdhdGlvbi5jb21wb25lbnQnO1xuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25neC1zbWFydGVycGxhbi1sb2NhdGlvbnMvc3JjL3B1YmxpYy1hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLHlDQUF5QyxDQUFDO0FBQ3hELGNBQWMsd0NBQXdDLENBQUM7QUFFdkQsYUFBYTtBQUViLGNBQWMsOENBQThDLENBQUM7QUFDN0QsY0FBYywwREFBMEQsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXHJcbiAqIFB1YmxpYyBBUEkgU3VyZmFjZSBvZiBuZ3gtc21hcnRlcnBsYW4tbG9jYXRpb25zXHJcbiAqL1xyXG5cclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbmd4LXNtYXJ0ZXJwbGFuLWxvY2F0aW9ucy5zZXJ2aWNlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbmd4LXNtYXJ0ZXJwbGFuLWxvY2F0aW9ucy5tb2R1bGUnO1xyXG5cclxuLy8gQ29tcG9uZW50c1xyXG5cclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9sb2NhdGlvbnMvbWFwL21hcC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL3RhYi1uYXZpZ2F0aW9uL3RhYi1uYXZpZ2F0aW9uLmNvbXBvbmVudCc7XHJcbiJdfQ==

package/fesm2015/smarterplan-ngx-smarterplan-locations.mjs

@@ -60,10 +60,10 @@ class TabNavigationComponent {
     }
 }
 TabNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: TabNavigationComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
-TabNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: { menuItems: "menuItems" }, outputs: { onGoBack: "onGoBack" }, ngImport: i0, template: "<span class=\"menu\">\n    <span *ngFor=\"let item of menuItems; let index = index;\">\n        <span class=\"item\" [ngClass]=\"{'current':index === menuItems.length - 1}\"\n            (click)=\"onClick(item.url,item.back, index)\">{{item.label | translate}}</span> <span\n            *ngIf=\"index !== menuItems.length - 1\" class=\"separator\">></span>\n    </span>\n</span>\n", styles: [".item{font-size:1.35em;color:var(--smarterplan-primary);cursor:pointer}.current{color:var(--smarterplan-primary)!important;cursor:default!important;text-decoration:none!important}.separator{font-size:1.4em;margin-left:10px;margin-right:10px;color:var(--smarterplan-primary)}.item:hover{text-decoration:underline}.menu{margin-top:15px;margin-bottom:20px}\n"], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i3.TranslatePipe } });
+TabNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: { menuItems: "menuItems" }, outputs: { onGoBack: "onGoBack" }, ngImport: i0, template: "<span class=\"menu\">\r\n    <span *ngFor=\"let item of menuItems; let index = index;\">\r\n        <span class=\"item\" [ngClass]=\"{'current':index === menuItems.length - 1}\"\r\n            (click)=\"onClick(item.url,item.back, index)\">{{item.label | translate}}</span> <span\r\n            *ngIf=\"index !== menuItems.length - 1\" class=\"separator\">></span>\r\n    </span>\r\n</span>\r\n", styles: [".item{font-size:1.35em;color:var(--smarterplan-primary);cursor:pointer}.current{color:var(--smarterplan-primary)!important;cursor:default!important;text-decoration:none!important}.separator{font-size:1.4em;margin-left:10px;margin-right:10px;color:var(--smarterplan-primary)}.item:hover{text-decoration:underline}.menu{margin-top:15px;margin-bottom:20px}\n"], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: TabNavigationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-tab-navigation', template: "<span class=\"menu\">\n    <span *ngFor=\"let item of menuItems; let index = index;\">\n        <span class=\"item\" [ngClass]=\"{'current':index === menuItems.length - 1}\"\n            (click)=\"onClick(item.url,item.back, index)\">{{item.label | translate}}</span> <span\n            *ngIf=\"index !== menuItems.length - 1\" class=\"separator\">></span>\n    </span>\n</span>\n", styles: [".item{font-size:1.35em;color:var(--smarterplan-primary);cursor:pointer}.current{color:var(--smarterplan-primary)!important;cursor:default!important;text-decoration:none!important}.separator{font-size:1.4em;margin-left:10px;margin-right:10px;color:var(--smarterplan-primary)}.item:hover{text-decoration:underline}.menu{margin-top:15px;margin-bottom:20px}\n"] }]
+            args: [{ selector: 'lib-tab-navigation', template: "<span class=\"menu\">\r\n    <span *ngFor=\"let item of menuItems; let index = index;\">\r\n        <span class=\"item\" [ngClass]=\"{'current':index === menuItems.length - 1}\"\r\n            (click)=\"onClick(item.url,item.back, index)\">{{item.label | translate}}</span> <span\r\n            *ngIf=\"index !== menuItems.length - 1\" class=\"separator\">></span>\r\n    </span>\r\n</span>\r\n", styles: [".item{font-size:1.35em;color:var(--smarterplan-primary);cursor:pointer}.current{color:var(--smarterplan-primary)!important;cursor:default!important;text-decoration:none!important}.separator{font-size:1.4em;margin-left:10px;margin-right:10px;color:var(--smarterplan-primary)}.item:hover{text-decoration:underline}.menu{margin-top:15px;margin-bottom:20px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { onGoBack: [{
                 type: Output
             }], menuItems: [{
@@ -128,10 +128,10 @@ class MapPopupComponent {
     }
 }
 MapPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MapPopupComponent, deps: [{ token: i1.Router }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-MapPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MapPopupComponent, selector: "lib-map-popup", ngImport: i0, template: "<div id=\"map-popup\">\n    <div class=\"map-popup-header\" (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">\n        <img [src]=\"space.annexes\" />\n    </div>\n    <div class=\"map-popup-details\">\n    <h1 (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">{{space.name}}</h1>\n    <span class=\"map-popup-address\">{{space.addresses}}</span>\n    <span *ngFor=\"let visit of space.visits\" class=\"map-popup-visit\" (click)=\"onVisitClick(visit)\"\n                  [style.cursor]=\"'pointer'\">\u27A4 {{ visit.name ? visit.name : space.name}}</span>\n    </div>\n</div>\n", styles: [".map-popup-header{height:120px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px}.map-popup-header img{width:100%;position:relative;top:50%;transform:translateY(-50%)}.map-popup-details{padding:5px 10px 10px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;background-color:#fff;color:#000}.map-popup-details{display:flex;flex-direction:column}.map-popup-details h1{font-size:1.5rem;font-weight:700;margin-bottom:0;color:var(--smarterplan-primary)}.map-popup-address{align-self:flex-end;margin-bottom:10px}.map-popup-visit{color:var(--smarterplan-primary);font-size:1.15rem}.map-popup-visit:hover{color:var(--smarterplan-primary)}\n"], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+MapPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MapPopupComponent, selector: "lib-map-popup", ngImport: i0, template: "<div id=\"map-popup\">\r\n    <div class=\"map-popup-header\" (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">\r\n        <img [src]=\"space.annexes\" />\r\n    </div>\r\n    <div class=\"map-popup-details\">\r\n    <h1 (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">{{space.name}}</h1>\r\n    <span class=\"map-popup-address\">{{space.addresses}}</span>\r\n    <span *ngFor=\"let visit of space.visits\" class=\"map-popup-visit\" (click)=\"onVisitClick(visit)\"\r\n                  [style.cursor]=\"'pointer'\">\u27A4 {{ visit.name ? visit.name : space.name}}</span>\r\n    </div>\r\n</div>\r\n", styles: [".map-popup-header{height:120px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px}.map-popup-header img{width:100%;position:relative;top:50%;transform:translateY(-50%)}.map-popup-details{padding:5px 10px 10px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;background-color:#fff;color:#000}.map-popup-details{display:flex;flex-direction:column}.map-popup-details h1{font-size:1.5rem;font-weight:700;margin-bottom:0;color:var(--smarterplan-primary)}.map-popup-address{align-self:flex-end;margin-bottom:10px}.map-popup-visit{color:var(--smarterplan-primary);font-size:1.15rem}.map-popup-visit:hover{color:var(--smarterplan-primary)}\n"], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MapPopupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-map-popup', template: "<div id=\"map-popup\">\n    <div class=\"map-popup-header\" (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">\n        <img [src]=\"space.annexes\" />\n    </div>\n    <div class=\"map-popup-details\">\n    <h1 (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">{{space.name}}</h1>\n    <span class=\"map-popup-address\">{{space.addresses}}</span>\n    <span *ngFor=\"let visit of space.visits\" class=\"map-popup-visit\" (click)=\"onVisitClick(visit)\"\n                  [style.cursor]=\"'pointer'\">\u27A4 {{ visit.name ? visit.name : space.name}}</span>\n    </div>\n</div>\n", styles: [".map-popup-header{height:120px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px}.map-popup-header img{width:100%;position:relative;top:50%;transform:translateY(-50%)}.map-popup-details{padding:5px 10px 10px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;background-color:#fff;color:#000}.map-popup-details{display:flex;flex-direction:column}.map-popup-details h1{font-size:1.5rem;font-weight:700;margin-bottom:0;color:var(--smarterplan-primary)}.map-popup-address{align-self:flex-end;margin-bottom:10px}.map-popup-visit{color:var(--smarterplan-primary);font-size:1.15rem}.map-popup-visit:hover{color:var(--smarterplan-primary)}\n"] }]
+            args: [{ selector: 'lib-map-popup', template: "<div id=\"map-popup\">\r\n    <div class=\"map-popup-header\" (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">\r\n        <img [src]=\"space.annexes\" />\r\n    </div>\r\n    <div class=\"map-popup-details\">\r\n    <h1 (click)=\"onClickVisitFirst()\" [style.cursor]=\"'pointer'\">{{space.name}}</h1>\r\n    <span class=\"map-popup-address\">{{space.addresses}}</span>\r\n    <span *ngFor=\"let visit of space.visits\" class=\"map-popup-visit\" (click)=\"onVisitClick(visit)\"\r\n                  [style.cursor]=\"'pointer'\">\u27A4 {{ visit.name ? visit.name : space.name}}</span>\r\n    </div>\r\n</div>\r\n", styles: [".map-popup-header{height:120px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px}.map-popup-header img{width:100%;position:relative;top:50%;transform:translateY(-50%)}.map-popup-details{padding:5px 10px 10px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;background-color:#fff;color:#000}.map-popup-details{display:flex;flex-direction:column}.map-popup-details h1{font-size:1.5rem;font-weight:700;margin-bottom:0;color:var(--smarterplan-primary)}.map-popup-address{align-self:flex-end;margin-bottom:10px}.map-popup-visit{color:var(--smarterplan-primary);font-size:1.15rem}.map-popup-visit:hover{color:var(--smarterplan-primary)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.Router }, { type: i0.NgZone }]; } });
 
 const iconRetinaUrl = "assets/marker-icon-2x.png";
@@ -212,10 +212,10 @@ class MapComponent {
     }
 }
 MapComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MapComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-MapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MapComponent, selector: "lib-map", inputs: { spaces: "spaces" }, usesOnChanges: true, ngImport: i0, template: "<div [leafletLayers]=\"layers\" [leafletOptions]=\"options\" (leafletMapReady)=\"onMapReady($event)\" id=\"map\" leaflet\n    style=\"height: 500px; margin-top: 30px; z-index: 195\"></div>\n", styles: [""], directives: [{ type: i1$1.LeafletDirective, selector: "[leaflet]", inputs: ["leafletFitBoundsOptions", "leafletPanOptions", "leafletZoomOptions", "leafletZoomPanOptions", "leafletOptions", "leafletZoom", "leafletCenter", "leafletFitBounds", "leafletMaxBounds", "leafletMinZoom", "leafletMaxZoom"], outputs: ["leafletMapReady", "leafletZoomChange", "leafletCenterChange", "leafletClick", "leafletDoubleClick", "leafletMouseDown", "leafletMouseUp", "leafletMouseMove", "leafletMouseOver", "leafletMouseOut", "leafletMapMove", "leafletMapMoveStart", "leafletMapMoveEnd", "leafletMapZoom", "leafletMapZoomStart", "leafletMapZoomEnd"] }, { type: i1$1.LeafletLayersDirective, selector: "[leafletLayers]", inputs: ["leafletLayers"] }] });
+MapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: MapComponent, selector: "lib-map", inputs: { spaces: "spaces" }, usesOnChanges: true, ngImport: i0, template: "<div [leafletLayers]=\"layers\" [leafletOptions]=\"options\" (leafletMapReady)=\"onMapReady($event)\" id=\"map\" leaflet\r\n    style=\"height: 500px; margin-top: 30px; z-index: 195\"></div>\r\n", styles: [""], directives: [{ type: i1$1.LeafletDirective, selector: "[leaflet]", inputs: ["leafletFitBoundsOptions", "leafletPanOptions", "leafletZoomOptions", "leafletZoomPanOptions", "leafletOptions", "leafletZoom", "leafletCenter", "leafletFitBounds", "leafletMaxBounds", "leafletMinZoom", "leafletMaxZoom"], outputs: ["leafletMapReady", "leafletZoomChange", "leafletCenterChange", "leafletClick", "leafletDoubleClick", "leafletMouseDown", "leafletMouseUp", "leafletMouseMove", "leafletMouseOver", "leafletMouseOut", "leafletMapMove", "leafletMapMoveStart", "leafletMapMoveEnd", "leafletMapZoom", "leafletMapZoomStart", "leafletMapZoomEnd"] }, { type: i1$1.LeafletLayersDirective, selector: "[leafletLayers]", inputs: ["leafletLayers"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: MapComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-map', template: "<div [leafletLayers]=\"layers\" [leafletOptions]=\"options\" (leafletMapReady)=\"onMapReady($event)\" id=\"map\" leaflet\n    style=\"height: 500px; margin-top: 30px; z-index: 195\"></div>\n", styles: [""] }]
+            args: [{ selector: 'lib-map', template: "<div [leafletLayers]=\"layers\" [leafletOptions]=\"options\" (leafletMapReady)=\"onMapReady($event)\" id=\"map\" leaflet\r\n    style=\"height: 500px; margin-top: 30px; z-index: 195\"></div>\r\n", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; }, propDecorators: { spaces: [{
                 type: Input
             }] } });
@@ -803,7 +803,7 @@ class CalibrationComponent {
             this.setupMenuItems();
             this.chosenPlan = this.planService.getChosenPlan();
             if (this.chosenPlan) {
-                this.chosenPlanIsPdf = this.chosenPlan.annexe.includes("pdf");
+                this.chosenPlanIsPdf = this.chosenPlan.annexe.includes('pdf');
                 this.launchViewer();
                 setTimeout(() => {
                     this.configureCanvas().then(() => {
@@ -819,11 +819,7 @@ class CalibrationComponent {
                 }, 500);
             }
             else {
-                this.router.navigate([
-                    "/dashboard/localisation",
-                    this.spaceID,
-                    "plans",
-                ]);
+                this.router.navigate(['/dashboard/localisation', this.spaceID, 'plans']);
             }
         });
     }
@@ -832,17 +828,17 @@ class CalibrationComponent {
      *********************************************************************************************** */
     setupMenuItems() {
         this.menuItems = [
-            { label: "Locations", url: "/localisation" },
+            { label: 'Locations', url: '/localisation' },
             {
                 label: this.currentSpace.name,
                 url: `/localisation/${this.spaceID}`,
             },
             {
-                label: "Plans",
+                label: 'Plans',
                 url: `/localisation/${this.currentSpace.id}/plans`,
             },
             {
-                label: "Calibration",
+                label: 'Calibration',
                 url: `/localisation/${this.currentSpace.id}/plan-calibration?spaceID=${this.currentSpace.id}`,
             },
         ];
@@ -855,7 +851,7 @@ class CalibrationComponent {
         return __awaiter(this, void 0, void 0, function* () {
             /** Get canvas */
             if (!this.canvas) {
-                const canvas = document.querySelector("#canvas");
+                const canvas = document.querySelector('#canvas');
                 this.canvas = canvas;
             }
             if (!this.chosenPlanIsPdf) {
@@ -888,7 +884,7 @@ class CalibrationComponent {
     drawImage(url, x = 0, y = 0, icone = false) {
         const image = new Image();
         const size = this.canvasSize;
-        const context = this.canvas.getContext("2d");
+        const context = this.canvas.getContext('2d');
         /** Flip the context, for symmetry */
         // if (this.reflectV) {
         //     context.translate(size.w, 0);
@@ -900,7 +896,7 @@ class CalibrationComponent {
         // }
         let imageWidth = size.w;
         let imageHeight = size.h;
-        image.addEventListener("load", () => {
+        image.addEventListener('load', () => {
             if (icone) {
                 imageWidth = image.width;
                 imageHeight = image.height;
@@ -929,7 +925,8 @@ class CalibrationComponent {
             const pdfjs = yield import('pdfjs-dist/build/pdf');
             const pdfjsWorker = yield import('pdfjs-dist/build/pdf.worker.entry');
             pdfjs.GlobalWorkerOptions.workerSrc = pdfjsWorker;
-            const pdf = yield getDocument(this.chosenPlan.filepath).promise;
+            const pdf = yield getDocument(this.chosenPlan.filepath)
+                .promise;
             const page = yield pdf.getPage(1);
             const viewPortParameters = { scale: 1 };
             const viewport = page.getViewport(viewPortParameters);
@@ -939,13 +936,13 @@ class CalibrationComponent {
             console.log(size);
             this.canvasSize = size;
             this.canvasZoom = size.w / viewport.width;
-            const context = this.canvas.getContext("2d");
+            const context = this.canvas.getContext('2d');
             const renderContext = {
                 canvasContext: context,
                 viewport,
             };
             const renderTask = page.render(renderContext).promise;
-            renderTask.then(() => console.log("Page rendered"));
+            renderTask.then(() => console.log('Page rendered'));
             // const res = canvas.toDataURL();
             // if (pdf != null) pdf.destroy();
             // return res;
@@ -973,25 +970,28 @@ class CalibrationComponent {
             // console.log(this.floors);
             setTimeout(() => __awaiter(this, void 0, void 0, function* () {
                 /** Move Floor mode */
-                yield sdk.Mode.moveTo(sdk.Mode.Mode.FLOORPLAN);
-                /** Display the correct floor for the plan */
-                try {
-                    yield this.matterportImportService.moveToFloor(this.chosenPlan.name);
-                }
-                catch (_a) {
-                    console.log("couldnot move to floor");
-                }
+                yield sdk.Mode.moveTo(sdk.Mode.Mode.FLOORPLAN).then((nextMode) => __awaiter(this, void 0, void 0, function* () {
+                    // Move successful
+                    console.log(`Arrived at new view mode ${nextMode}`);
+                    /** Display the correct floor for the plan */
+                    try {
+                        yield this.matterportImportService.moveToFloor(this.chosenPlan.name);
+                        /** When the user try to change the view mode we set it back to floorpan */
+                        sdk.on(sdk.Mode.Event.CHANGE_END, (oldMode, newMode) => {
+                            if (newMode !== sdk.Mode.Mode.FLOORPLAN) {
+                                sdk.Mode.moveTo(sdk.Mode.Mode.FLOORPLAN, {
+                                    transition: 'transition.instant',
+                                });
+                            }
+                        });
+                    }
+                    catch (_a) {
+                        console.log('couldnot move to floor');
+                    }
+                }));
                 /** We can display the matterport view now */
                 this.loading = false;
-            }), 300);
-            /** When the user try to change the view mode we set it back to floorpan */
-            sdk.on(sdk.Mode.Event.CHANGE_END, (oldMode, newMode) => {
-                if (newMode !== sdk.Mode.Mode.FLOORPLAN) {
-                    sdk.Mode.moveTo(sdk.Mode.Mode.FLOORPLAN, {
-                        transition: "transition.instant",
-                    });
-                }
-            });
+            }), 1000);
             /** Update current camera pose and rotation */
             sdk.Camera.pose.subscribe((event) => {
                 /** We update only if the user is not changing the rotation with the <input> range, to not override the <input> value */
@@ -1064,15 +1064,15 @@ class CalibrationComponent {
             if (deltaXPlan === 0) {
                 // console.log("we moved along Y axis on Plan");
                 const deltaYPlan = this.secondMarkPlan.y - this.firstMarkPlan.y;
-                this.calibrage.nameYAxis = "z";
-                this.calibrage.nameXAxis = "x";
+                this.calibrage.nameYAxis = 'z';
+                this.calibrage.nameXAxis = 'x';
                 this.calibrage.offsetY = this.secondMarkPlan.y;
                 this.calibrage.scaleY = deltaYPlan / deltaZVisit;
             }
             else {
                 // console.log(" we moved along X axis on Plan");
-                this.calibrage.nameYAxis = "x";
-                this.calibrage.nameXAxis = "z";
+                this.calibrage.nameYAxis = 'x';
+                this.calibrage.nameXAxis = 'z';
                 this.calibrage.offsetX = this.secondMarkPlan.x;
                 this.calibrage.scaleX = deltaXPlan / deltaZVisit;
             }
@@ -1116,21 +1116,13 @@ class CalibrationComponent {
                 if (navigations.length > 0) {
                     for (const navigation of navigations) {
                         const testPosition = JSON.parse(navigation.position);
-                        const positionX = this.calibrage.nameXAxis === "x"
-                            ? testPosition.x
-                            : testPosition.z;
-                        const positionY = this.calibrage.nameYAxis === "x"
-                            ? testPosition.x
-                            : testPosition.z;
-                        const testX = positionX * this.calibrage.scaleX +
-                            this.calibrage.offsetX;
-                        const testY = positionY * this.calibrage.scaleY +
-                            this.calibrage.offsetY;
+                        const positionX = this.calibrage.nameXAxis === 'x' ? testPosition.x : testPosition.z;
+                        const positionY = this.calibrage.nameYAxis === 'x' ? testPosition.x : testPosition.z;
+                        const testX = positionX * this.calibrage.scaleX + this.calibrage.offsetX;
+                        const testY = positionY * this.calibrage.scaleY + this.calibrage.offsetY;
                         // console.log("test position GREEN", testX, testY);
-                        const transformedX = (testX - this.calibrage.offsetXPlan) /
-                            this.calibrage.scalePlan; // we are undoing the pan and zoom
-                        const transformedY = (testY - this.calibrage.offsetYPlan) /
-                            this.calibrage.scalePlan;
+                        const transformedX = (testX - this.calibrage.offsetXPlan) / this.calibrage.scalePlan; // we are undoing the pan and zoom
+                        const transformedY = (testY - this.calibrage.offsetYPlan) / this.calibrage.scalePlan;
                         this.positions.push({
                             navID: navigation.id,
                             planID: this.chosenPlan.id,
@@ -1139,7 +1131,7 @@ class CalibrationComponent {
                         });
                         const iconSize = 30 * this.calibrage.scalePlan;
                         const shift = iconSize / 2;
-                        this.drawImage("https://api.iconify.design/mdi:adjust.svg?color=green&height=30&width=30", transformedX - shift, transformedY - shift, true);
+                        this.drawImage('https://api.iconify.design/mdi:adjust.svg?color=green&height=30&width=30', transformedX - shift, transformedY - shift, true);
                     }
                 }
             }
@@ -1188,12 +1180,8 @@ class CalibrationComponent {
                 })));
             }
             this.matterportImportService.removeFrame();
-            this.router.navigate([
-                "/dashboard/localisation",
-                this.spaceID,
-                "plans",
-            ]);
-            alert(this.translate.instant("calibration.success"));
+            this.router.navigate(['/dashboard/localisation', this.spaceID, 'plans']);
+            alert(this.translate.instant('calibration.success'));
         });
     }
     /** Reset the canvas */
@@ -1206,12 +1194,8 @@ class CalibrationComponent {
     /** Cancel, leave */
     onCancel() {
         this.matterportImportService.removeFrame();
-        this.router.navigate([
-            "/dashboard/localisation",
-            this.spaceID,
-            "plans",
-        ]);
-        alert(this.translate.instant("calibration.canceled"));
+        this.router.navigate(['/dashboard/localisation', this.spaceID, 'plans']);
+        alert(this.translate.instant('calibration.canceled'));
     }
     onFloorClick(floor) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -1221,9 +1205,9 @@ class CalibrationComponent {
     }
     onActivateZoomChange() {
         this.zoomCanBeChanged = !this.zoomCanBeChanged;
-        const iframe = document.querySelector("#viewer-frame");
+        const iframe = document.querySelector('#viewer-frame');
         if (iframe) {
-            iframe.style.zIndex = this.zoomCanBeChanged ? "1" : "0";
+            iframe.style.zIndex = this.zoomCanBeChanged ? '1' : '0';
         }
     }
 }
@@ -1234,7 +1218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImpor
             args: [{ selector: 'lib-calibration', template: "<div class=\"row mt-3\">\r\n    <div class=\"col\">\r\n        <div class=\"m-3\">\r\n            <lib-tab-navigation [menuItems]='menuItems'></lib-tab-navigation>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div id=\"rowCanvas\">\r\n    <div #canvasDiv id=\"canvasDiv\">\r\n\r\n        <div id=\"viewer-frame\" [style.pointer-events]=\"zoomCanBeChanged?'auto':'none'\">\r\n            <!-- <div class=\"blur\"></div> -->\r\n        </div>\r\n        <canvas id=\"canvas\" [ngStyle]=\"{'opacity': (preview||loading) ? '1' : 'calc(' + opacity + '/ 100)'}\"></canvas>\r\n    </div>\r\n\r\n    <div class=\"calibration-tools container-fluid\" *ngIf=\"!(preview || loading)\">\r\n        <h1>{{'Calibration tool' | translate}}</h1>\r\n        <div class=\"tool\">\r\n            <div class=\"row ms-0 me-0 legend\">\r\n                <div class=\"legend-bar-indicator\" [ngStyle]=\"{'opacity': 'calc(' + (-(opacity-100)+10) + '/ 100)'}\">\r\n                    {{'Less' | translate}}</div>\r\n                <div class=\"legend-title\">{{'Plan Opacity' | translate }}</div>\r\n                <div class=\"legend-bar-indicator\" [ngStyle]=\"{'opacity': 'calc(' + (opacity+10) + '/ 100)'}\">{{'More' |\r\n                    translate}}</div>\r\n            </div>\r\n            <div class=\"row ms-0 me-0 \">\r\n                <input [disabled]=\"false\" [ngModelOptions]=\"{standalone: true}\" [(ngModel)]=\"opacity\" type=\"range\"\r\n                    class=\"form-range\" min=\"0\" max=\"100\" value=\"50\" id=\"opacity\">\r\n            </div>\r\n        </div>\r\n        <div class=\"tool\">\r\n            <div class=\"row ms-0 me-0 \">\r\n                <div class=\"label-legend\">{{'Change Visit Floor' | translate}}</div>\r\n                <div ngbDropdown class=\"d-inline-block ms-3\">\r\n                    <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" ngbDropdownToggle>\r\n                        {{currentFloor ? currentFloor.id : ('Floor' | translate) }}</button>\r\n                    <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\r\n                        <button ngbDropdownItem *ngFor=\"let floor of floors\" (click)=\"onFloorClick(floor)\">\r\n                            {{ floor.name.length > 0 ? floor.name : ('Floor ' + floor.id) }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"tool\">\r\n            <div class=\"row ms-0 me-0 \">\r\n                <div class=\"tool-checkbox-container\">\r\n                    <div class=\"tool-checkbox-subcontainer\">\r\n                        <div class=\"label-legend me-3\">{{'Pan/Zoom Visit' | translate}} {{zoomCanBeChanged ? \"ON\" :\r\n                            \"OFF\"}}\r\n                        </div>\r\n                        <input type=\"checkbox\" (change)=\"onActivateZoomChange()\" style=\"margin-top: 5px;\">\r\n                    </div>\r\n                    <div class=\"card border-warning mb-3 mt-3\" *ngIf=\"zoomCanBeChanged\">\r\n                        <div class=\"card-body text-warning\">\r\n                            <h5 class=\"card-title\">{{\"calibration.wait-message\" | translate}}</h5>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n\r\n        <div class=\"action\">\r\n            <button type=\"button\" class=\"btn btn-outline-primary rounded-pill\" (click)=\"onPreview()\"\r\n                [disabled]=\"zoomCanBeChanged\">{{'Preview' | translate}}</button>\r\n            <button type=\"button\" class=\"btn btn-outline-primary rounded-pill\" (click)=\"onCancel()\">{{'Cancel' |\r\n                translate}}</button>\r\n\r\n        </div>\r\n\r\n    </div>\r\n    <div class=\"calibration-tools container-fluid\" *ngIf=\"preview\">\r\n        <h1>{{'Validation' | translate}}</h1>\r\n        <div class=\"action\">\r\n            <button type=\"button\" class=\"btn btn-outline-primary rounded-pill\" (click)=\"onSave()\">{{'Validate' |\r\n                translate}}</button>\r\n            <button type=\"button\" class=\"btn btn-outline-primary rounded-pill\" (click)=\"onReset()\">{{'Reset' |\r\n                translate}}</button>\r\n            <button type=\"button\" class=\"btn btn-outline-primary rounded-pill\" (click)=\"onCancel()\">{{'Cancel' |\r\n                translate}}</button>\r\n\r\n        </div>\r\n    </div>\r\n\r\n\r\n    <div class=\"calibration-tools container-fluid\" *ngIf=\"loading\">\r\n        <h3>{{\"Waiting for Matterport\" | translate}}...</h3>\r\n        <div class=\"d-flex justify-content-center\">\r\n            <div class=\"spinner-border\" role=\"status\">\r\n                <span class=\"visually-hidden\">Loading...</span>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n</div>", styles: [".button-visit{display:none;height:30px;width:30px;position:absolute;background:url(https://api.iconify.design/mdi:map-marker-check.svg?color=red&height=30) no-repeat scroll 0 0 transparent;border:none}#button-visit-left{left:350px;top:550px}#button-visit-right{left:500px;top:600px}#rowCanvas{display:flex}#canvasDiv{height:100%;width:100%;position:relative}#canvas{width:100%;height:100%;opacity:.5}#viewer-frame{top:0;position:absolute;width:100%;height:100%}.calibration-tools{margin-left:20px;width:400px;background-color:#fff;z-index:11;border:1px solid var(--smarterplan-primary);padding:7px}.form-range{width:100%}.tool{margin-top:20px}.tool .legend{justify-content:space-between;position:relative;margin-bottom:5px}.tool .legend-title{font-size:1.2rem;color:var(--smarterplan-primary);margin:auto;width:100%;font-weight:700;display:flex;justify-content:center}.tool .legend-bar-indicator{width:15%!important}.tool .label-legend{color:var(--smarterplan-primary);font-size:1.1rem;max-width:55%}.tool .tool-checkbox-container{display:flex;flex-direction:column}.tool .tool-checkbox-container .tool-checkbox-subcontainer{display:flex}.blur{width:150px;height:52px;position:absolute;background-color:#1e2023;bottom:0}.symmetry{padding:5px;border:solid 2px;border-radius:10px;color:var(--smarterplan-primary);margin:25px 10px;cursor:pointer}.symmetry:hover{color:var(--smarterplan-primary)}.symmetry-row{justify-content:center}.action{margin-top:30px;display:flex;justify-content:space-evenly}h1{color:var(--smarterplan-primary);text-align:center;margin-bottom:20px}h3{color:var(--smarterplan-primary);text-align:center;margin-bottom:10px}.btn-outline-primary.disabled{background-color:var(--smarterplan-orange)!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i2.MatterportImportService }, { type: i2.PlanService }, { type: i1.ActivatedRoute }, { type: i1.Router }, { type: i2.ZoneService }, { type: i2.SpaceService }, { type: i2.NavigationService }, { type: i3.TranslateService }]; }, propDecorators: { canvasDiv: [{
                 type: ViewChild,
-                args: ["canvasDiv"]
+                args: ['canvasDiv']
             }] } });
 
 class PlansComponent {
@@ -1446,10 +1430,10 @@ class PlansComponent {
     }
 }
 PlansComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: PlansComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }, { token: i2.SpaceService }, { token: i2.PlanService }, { token: i1$2.FormBuilder }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-PlansComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: PlansComponent, selector: "lib-plans", ngImport: i0, template: "<div class=\"container-fluid\" *ngIf=\"currentSpace\" class=\"dashboard-tab\">\n    <div class=\"m-3\">\n        <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\n    </div>\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n        <div class=\"spinner-border\" role=\"status\">\n            <span class=\"visually-hidden\">Loading...</span>\n        </div>\n    </div>\n    <div class=\"mt-3\" *ngIf=\"!plans && !loading\">\n        <h4 style=\"font-weight: bold;\">{{'No imported plans' | translate }}</h4>\n        <p>{{'For import from 3D visit: go Virtual Visits => Import Images' | translate}}</p>\n    </div>\n    <div class=\"row ms-1\">\n        <div ngbDropdown class=\"d-inline-block me-3\">\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" ngbDropdownToggle>{{getChoosenPlan() ?\n                getChoosenPlan().name: ('Choose Plan' | translate) }}</button>\n            <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\n                <button ngbDropdownItem *ngFor=\"let plan of plans\" (click)=\"onPlanClick(plan)\">{{plan.name }}\n                </button>\n            </div>\n        </div>\n        <div class=\"d-inline-block\" ngbDropdown #myDrop=\"ngbDropdown\">\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\" ngbDropdownToggle>{{'Choose action' |\n                translate}}</button>\n            <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\n                <button (click)=\"onCalibrateClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Calibrate' |\n                    translate}}</button>\n                <button (click)=\"onEditClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Edit plan' |\n                    translate}}\n                </button>\n                <button (click)=\"onUploadClick()\" ngbDropdownItem>{{'Upload new plan' | translate}}</button>\n                <button (click)=\"onDownloadClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Download plan' |\n                    translate}}</button>\n                <button (click)=\"onRemoveClick()\" ngbDropdownItem\n                    [disabled]=\"!getChoosenPlan() || getChoosenPlan().isImportedMatterport\">{{'Delete plan' |\n                    translate}}</button>\n                <!-- <button (click)=\"onDownloadAsPng()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">\n                    {{'Download plan as PNG' | translate}}</button> -->\n            </div>\n        </div>\n    </div>\n    <div class=\"row mt-3 ms-0\">\n        <h4 *ngIf=\"fileToUpload\">{{'New plan' | translate }}</h4>\n        <input class=\"hidden\" type=\"file\" id=\"upload-file\" name=\"upload-file\" accept=\"image/png, image/jpeg, .pdf, .svg\"\n            ngf-max-size=\"6MB\" (change)=\"addPlan($event.target)\">\n    </div>\n    <div class=\"col-md-6 mt-3\" *ngIf=\"planForm\">\n        <form (ngSubmit)=\"onSavePlan()\" [formGroup]=\"planForm\">\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Name' | translate}} </label>\n                <div class=\"col-sm-9\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </div>\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Zone' | translate}} </label>\n                <div class=\"col-sm-9\">\n                    <select class=\"form-control\" formControlName=\"zoneID\">\n                        <option *ngFor=\"let zone of zones\" [ngValue]=\"zone.id\">\n                            {{ zone.name }}\n                        </option>\n                    </select>\n                </div>\n            </div>\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Set as current plan for zone' | translate}}</label>\n                <div class=\"col-sm-3\">\n                    <input type=\"checkbox\" [(ngModel)]=\"isCurrentPlanForZone\" [ngModelOptions]=\"{standalone: true}\">\n                </div>\n            </div>\n            <button [disabled]=\"planForm.invalid\" type='submit' class=\"btn btn-label-file rounded-pill\">{{'Save' |\n                translate}}</button>\n            <button class=\"btn btn-label-file rounded-pill ms-3\" type=\"button\" (click)=\"onCancelUpload()\">{{'Cancel' |\n                translate}}</button>\n        </form>\n    </div>\n    <ul class=\"col-md-6 list-group list-group-flush\" *ngIf=\"getChoosenPlan()\">\n        <li class=\"list-group-item bg-transparent\">{{'Name' | translate }} : {{getChoosenPlan().name}} </li>\n        <li class=\"list-group-item bg-transparent\"> {{'Plan is ' | translate }} :\n            {{getChoosenPlan().calibration ? ('Calibrated' | translate) : ('Not calibrated' | translate)}}</li>\n        <li class=\"list-group-item bg-transparent\">{{'Attributed to zone ' | translate }} :\n            {{getChoosenPlan().zone ? getChoosenPlan().zone.name : 'None'}}</li>\n        <li class=\"list-group-item bg-transparent\">{{'Is current plan for zone ' | translate }} :\n            <input type=\"checkbox\" [(ngModel)]=\"getChoosenPlan().isCurrentForZone\" (change)=\"onCurrentPlanClick()\">\n        </li>\n\n    </ul>\n\n    <div class=\"row mt-4\">\n        <div class=\"col-md-10\">\n            <embed *ngIf=\"getChoosenPlan() && chosenPlanIsPdf\" [src]=\"getChoosenPlan().filepath | safeUrl\"\n                type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"650px;\" width=\"100%\" />\n            <div *ngIf=\"!chosenPlanIsPdf\" class=\"row\" style=\"height: 500px; overflow: hidden;\" id=\"canvasDiv\">\n                <canvas id=\"canvas\" width=\"4096px\" height=\"4096px\">\n                    <!-- <img *ngIf=\"chosenPlan\" id=\"plan-image\" [src]=\"chosenPlan.filepath\" style=\"width: 100%;\"> -->\n                </canvas>\n\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".button-visit{display:none;height:30px;width:30px;position:absolute;background:url(https://api.iconify.design/mdi:map-marker-check.svg?color=red&height=30) no-repeat scroll 0 0 transparent;border:none}#button-visit-left{left:350px;top:550px}#button-visit-right{left:500px;top:600px}.hidden{visibility:hidden;width:1px;height:1px}\n"], components: [{ type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: ["menuItems"], outputs: ["onGoBack"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe, "safeUrl": i2.SafeUrlPipe } });
+PlansComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: PlansComponent, selector: "lib-plans", ngImport: i0, template: "<div class=\"container-fluid\" *ngIf=\"currentSpace\" class=\"dashboard-tab\">\r\n    <div class=\"m-3\">\r\n        <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\r\n    </div>\r\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <div class=\"spinner-border\" role=\"status\">\r\n            <span class=\"visually-hidden\">Loading...</span>\r\n        </div>\r\n    </div>\r\n    <div class=\"mt-3\" *ngIf=\"!plans && !loading\">\r\n        <h4 style=\"font-weight: bold;\">{{'No imported plans' | translate }}</h4>\r\n        <p>{{'For import from 3D visit: go Virtual Visits => Import Images' | translate}}</p>\r\n    </div>\r\n    <div class=\"row ms-1\">\r\n        <div ngbDropdown class=\"d-inline-block me-3\">\r\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" ngbDropdownToggle>{{getChoosenPlan() ?\r\n                getChoosenPlan().name: ('Choose Plan' | translate) }}</button>\r\n            <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\r\n                <button ngbDropdownItem *ngFor=\"let plan of plans\" (click)=\"onPlanClick(plan)\">{{plan.name }}\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <div class=\"d-inline-block\" ngbDropdown #myDrop=\"ngbDropdown\">\r\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\" ngbDropdownToggle>{{'Choose action' |\r\n                translate}}</button>\r\n            <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                <button (click)=\"onCalibrateClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Calibrate' |\r\n                    translate}}</button>\r\n                <button (click)=\"onEditClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Edit plan' |\r\n                    translate}}\r\n                </button>\r\n                <button (click)=\"onUploadClick()\" ngbDropdownItem>{{'Upload new plan' | translate}}</button>\r\n                <button (click)=\"onDownloadClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Download plan' |\r\n                    translate}}</button>\r\n                <button (click)=\"onRemoveClick()\" ngbDropdownItem\r\n                    [disabled]=\"!getChoosenPlan() || getChoosenPlan().isImportedMatterport\">{{'Delete plan' |\r\n                    translate}}</button>\r\n                <!-- <button (click)=\"onDownloadAsPng()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">\r\n                    {{'Download plan as PNG' | translate}}</button> -->\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"row mt-3 ms-0\">\r\n        <h4 *ngIf=\"fileToUpload\">{{'New plan' | translate }}</h4>\r\n        <input class=\"hidden\" type=\"file\" id=\"upload-file\" name=\"upload-file\" accept=\"image/png, image/jpeg, .pdf, .svg\"\r\n            ngf-max-size=\"6MB\" (change)=\"addPlan($event.target)\">\r\n    </div>\r\n    <div class=\"col-md-6 mt-3\" *ngIf=\"planForm\">\r\n        <form (ngSubmit)=\"onSavePlan()\" [formGroup]=\"planForm\">\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Name' | translate}} </label>\r\n                <div class=\"col-sm-9\">\r\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\">\r\n                </div>\r\n            </div>\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Zone' | translate}} </label>\r\n                <div class=\"col-sm-9\">\r\n                    <select class=\"form-control\" formControlName=\"zoneID\">\r\n                        <option *ngFor=\"let zone of zones\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Set as current plan for zone' | translate}}</label>\r\n                <div class=\"col-sm-3\">\r\n                    <input type=\"checkbox\" [(ngModel)]=\"isCurrentPlanForZone\" [ngModelOptions]=\"{standalone: true}\">\r\n                </div>\r\n            </div>\r\n            <button [disabled]=\"planForm.invalid\" type='submit' class=\"btn btn-label-file rounded-pill\">{{'Save' |\r\n                translate}}</button>\r\n            <button class=\"btn btn-label-file rounded-pill ms-3\" type=\"button\" (click)=\"onCancelUpload()\">{{'Cancel' |\r\n                translate}}</button>\r\n        </form>\r\n    </div>\r\n    <ul class=\"col-md-6 list-group list-group-flush\" *ngIf=\"getChoosenPlan()\">\r\n        <li class=\"list-group-item bg-transparent\">{{'Name' | translate }} : {{getChoosenPlan().name}} </li>\r\n        <li class=\"list-group-item bg-transparent\"> {{'Plan is ' | translate }} :\r\n            {{getChoosenPlan().calibration ? ('Calibrated' | translate) : ('Not calibrated' | translate)}}</li>\r\n        <li class=\"list-group-item bg-transparent\">{{'Attributed to zone ' | translate }} :\r\n            {{getChoosenPlan().zone ? getChoosenPlan().zone.name : 'None'}}</li>\r\n        <li class=\"list-group-item bg-transparent\">{{'Is current plan for zone ' | translate }} :\r\n            <input type=\"checkbox\" [(ngModel)]=\"getChoosenPlan().isCurrentForZone\" (change)=\"onCurrentPlanClick()\">\r\n        </li>\r\n\r\n    </ul>\r\n\r\n    <div class=\"row mt-4\">\r\n        <div class=\"col-md-10\">\r\n            <embed *ngIf=\"getChoosenPlan() && chosenPlanIsPdf\" [src]=\"getChoosenPlan().filepath | safeUrl\"\r\n                type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"650px;\" width=\"100%\" />\r\n            <div *ngIf=\"!chosenPlanIsPdf\" class=\"row\" style=\"height: 500px; overflow: hidden;\" id=\"canvasDiv\">\r\n                <canvas id=\"canvas\" width=\"4096px\" height=\"4096px\">\r\n                    <!-- <img *ngIf=\"chosenPlan\" id=\"plan-image\" [src]=\"chosenPlan.filepath\" style=\"width: 100%;\"> -->\r\n                </canvas>\r\n\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".button-visit{display:none;height:30px;width:30px;position:absolute;background:url(https://api.iconify.design/mdi:map-marker-check.svg?color=red&height=30) no-repeat scroll 0 0 transparent;border:none}#button-visit-left{left:350px;top:550px}#button-visit-right{left:500px;top:600px}.hidden{visibility:hidden;width:1px;height:1px}\n"], components: [{ type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: ["menuItems"], outputs: ["onGoBack"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }, { type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i3.TranslatePipe, "safeUrl": i2.SafeUrlPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: PlansComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-plans', template: "<div class=\"container-fluid\" *ngIf=\"currentSpace\" class=\"dashboard-tab\">\n    <div class=\"m-3\">\n        <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\n    </div>\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n        <div class=\"spinner-border\" role=\"status\">\n            <span class=\"visually-hidden\">Loading...</span>\n        </div>\n    </div>\n    <div class=\"mt-3\" *ngIf=\"!plans && !loading\">\n        <h4 style=\"font-weight: bold;\">{{'No imported plans' | translate }}</h4>\n        <p>{{'For import from 3D visit: go Virtual Visits => Import Images' | translate}}</p>\n    </div>\n    <div class=\"row ms-1\">\n        <div ngbDropdown class=\"d-inline-block me-3\">\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" ngbDropdownToggle>{{getChoosenPlan() ?\n                getChoosenPlan().name: ('Choose Plan' | translate) }}</button>\n            <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\n                <button ngbDropdownItem *ngFor=\"let plan of plans\" (click)=\"onPlanClick(plan)\">{{plan.name }}\n                </button>\n            </div>\n        </div>\n        <div class=\"d-inline-block\" ngbDropdown #myDrop=\"ngbDropdown\">\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\" ngbDropdownToggle>{{'Choose action' |\n                translate}}</button>\n            <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\n                <button (click)=\"onCalibrateClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Calibrate' |\n                    translate}}</button>\n                <button (click)=\"onEditClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Edit plan' |\n                    translate}}\n                </button>\n                <button (click)=\"onUploadClick()\" ngbDropdownItem>{{'Upload new plan' | translate}}</button>\n                <button (click)=\"onDownloadClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Download plan' |\n                    translate}}</button>\n                <button (click)=\"onRemoveClick()\" ngbDropdownItem\n                    [disabled]=\"!getChoosenPlan() || getChoosenPlan().isImportedMatterport\">{{'Delete plan' |\n                    translate}}</button>\n                <!-- <button (click)=\"onDownloadAsPng()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">\n                    {{'Download plan as PNG' | translate}}</button> -->\n            </div>\n        </div>\n    </div>\n    <div class=\"row mt-3 ms-0\">\n        <h4 *ngIf=\"fileToUpload\">{{'New plan' | translate }}</h4>\n        <input class=\"hidden\" type=\"file\" id=\"upload-file\" name=\"upload-file\" accept=\"image/png, image/jpeg, .pdf, .svg\"\n            ngf-max-size=\"6MB\" (change)=\"addPlan($event.target)\">\n    </div>\n    <div class=\"col-md-6 mt-3\" *ngIf=\"planForm\">\n        <form (ngSubmit)=\"onSavePlan()\" [formGroup]=\"planForm\">\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Name' | translate}} </label>\n                <div class=\"col-sm-9\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\">\n                </div>\n            </div>\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Zone' | translate}} </label>\n                <div class=\"col-sm-9\">\n                    <select class=\"form-control\" formControlName=\"zoneID\">\n                        <option *ngFor=\"let zone of zones\" [ngValue]=\"zone.id\">\n                            {{ zone.name }}\n                        </option>\n                    </select>\n                </div>\n            </div>\n            <div class=\"mb-3 row\">\n                <label class=\"col-sm-3\">{{'Set as current plan for zone' | translate}}</label>\n                <div class=\"col-sm-3\">\n                    <input type=\"checkbox\" [(ngModel)]=\"isCurrentPlanForZone\" [ngModelOptions]=\"{standalone: true}\">\n                </div>\n            </div>\n            <button [disabled]=\"planForm.invalid\" type='submit' class=\"btn btn-label-file rounded-pill\">{{'Save' |\n                translate}}</button>\n            <button class=\"btn btn-label-file rounded-pill ms-3\" type=\"button\" (click)=\"onCancelUpload()\">{{'Cancel' |\n                translate}}</button>\n        </form>\n    </div>\n    <ul class=\"col-md-6 list-group list-group-flush\" *ngIf=\"getChoosenPlan()\">\n        <li class=\"list-group-item bg-transparent\">{{'Name' | translate }} : {{getChoosenPlan().name}} </li>\n        <li class=\"list-group-item bg-transparent\"> {{'Plan is ' | translate }} :\n            {{getChoosenPlan().calibration ? ('Calibrated' | translate) : ('Not calibrated' | translate)}}</li>\n        <li class=\"list-group-item bg-transparent\">{{'Attributed to zone ' | translate }} :\n            {{getChoosenPlan().zone ? getChoosenPlan().zone.name : 'None'}}</li>\n        <li class=\"list-group-item bg-transparent\">{{'Is current plan for zone ' | translate }} :\n            <input type=\"checkbox\" [(ngModel)]=\"getChoosenPlan().isCurrentForZone\" (change)=\"onCurrentPlanClick()\">\n        </li>\n\n    </ul>\n\n    <div class=\"row mt-4\">\n        <div class=\"col-md-10\">\n            <embed *ngIf=\"getChoosenPlan() && chosenPlanIsPdf\" [src]=\"getChoosenPlan().filepath | safeUrl\"\n                type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"650px;\" width=\"100%\" />\n            <div *ngIf=\"!chosenPlanIsPdf\" class=\"row\" style=\"height: 500px; overflow: hidden;\" id=\"canvasDiv\">\n                <canvas id=\"canvas\" width=\"4096px\" height=\"4096px\">\n                    <!-- <img *ngIf=\"chosenPlan\" id=\"plan-image\" [src]=\"chosenPlan.filepath\" style=\"width: 100%;\"> -->\n                </canvas>\n\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".button-visit{display:none;height:30px;width:30px;position:absolute;background:url(https://api.iconify.design/mdi:map-marker-check.svg?color=red&height=30) no-repeat scroll 0 0 transparent;border:none}#button-visit-left{left:350px;top:550px}#button-visit-right{left:500px;top:600px}.hidden{visibility:hidden;width:1px;height:1px}\n"] }]
+            args: [{ selector: 'lib-plans', template: "<div class=\"container-fluid\" *ngIf=\"currentSpace\" class=\"dashboard-tab\">\r\n    <div class=\"m-3\">\r\n        <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\r\n    </div>\r\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n        <div class=\"spinner-border\" role=\"status\">\r\n            <span class=\"visually-hidden\">Loading...</span>\r\n        </div>\r\n    </div>\r\n    <div class=\"mt-3\" *ngIf=\"!plans && !loading\">\r\n        <h4 style=\"font-weight: bold;\">{{'No imported plans' | translate }}</h4>\r\n        <p>{{'For import from 3D visit: go Virtual Visits => Import Images' | translate}}</p>\r\n    </div>\r\n    <div class=\"row ms-1\">\r\n        <div ngbDropdown class=\"d-inline-block me-3\">\r\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" ngbDropdownToggle>{{getChoosenPlan() ?\r\n                getChoosenPlan().name: ('Choose Plan' | translate) }}</button>\r\n            <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\r\n                <button ngbDropdownItem *ngFor=\"let plan of plans\" (click)=\"onPlanClick(plan)\">{{plan.name }}\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <div class=\"d-inline-block\" ngbDropdown #myDrop=\"ngbDropdown\">\r\n            <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownManual\" ngbDropdownToggle>{{'Choose action' |\r\n                translate}}</button>\r\n            <div ngbDropdownMenu aria-labelledby=\"dropdownManual\">\r\n                <button (click)=\"onCalibrateClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Calibrate' |\r\n                    translate}}</button>\r\n                <button (click)=\"onEditClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Edit plan' |\r\n                    translate}}\r\n                </button>\r\n                <button (click)=\"onUploadClick()\" ngbDropdownItem>{{'Upload new plan' | translate}}</button>\r\n                <button (click)=\"onDownloadClick()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">{{'Download plan' |\r\n                    translate}}</button>\r\n                <button (click)=\"onRemoveClick()\" ngbDropdownItem\r\n                    [disabled]=\"!getChoosenPlan() || getChoosenPlan().isImportedMatterport\">{{'Delete plan' |\r\n                    translate}}</button>\r\n                <!-- <button (click)=\"onDownloadAsPng()\" ngbDropdownItem [disabled]=\"!getChoosenPlan()\">\r\n                    {{'Download plan as PNG' | translate}}</button> -->\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"row mt-3 ms-0\">\r\n        <h4 *ngIf=\"fileToUpload\">{{'New plan' | translate }}</h4>\r\n        <input class=\"hidden\" type=\"file\" id=\"upload-file\" name=\"upload-file\" accept=\"image/png, image/jpeg, .pdf, .svg\"\r\n            ngf-max-size=\"6MB\" (change)=\"addPlan($event.target)\">\r\n    </div>\r\n    <div class=\"col-md-6 mt-3\" *ngIf=\"planForm\">\r\n        <form (ngSubmit)=\"onSavePlan()\" [formGroup]=\"planForm\">\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Name' | translate}} </label>\r\n                <div class=\"col-sm-9\">\r\n                    <input type=\"text\" class=\"form-control\" formControlName=\"name\">\r\n                </div>\r\n            </div>\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Zone' | translate}} </label>\r\n                <div class=\"col-sm-9\">\r\n                    <select class=\"form-control\" formControlName=\"zoneID\">\r\n                        <option *ngFor=\"let zone of zones\" [ngValue]=\"zone.id\">\r\n                            {{ zone.name }}\r\n                        </option>\r\n                    </select>\r\n                </div>\r\n            </div>\r\n            <div class=\"mb-3 row\">\r\n                <label class=\"col-sm-3\">{{'Set as current plan for zone' | translate}}</label>\r\n                <div class=\"col-sm-3\">\r\n                    <input type=\"checkbox\" [(ngModel)]=\"isCurrentPlanForZone\" [ngModelOptions]=\"{standalone: true}\">\r\n                </div>\r\n            </div>\r\n            <button [disabled]=\"planForm.invalid\" type='submit' class=\"btn btn-label-file rounded-pill\">{{'Save' |\r\n                translate}}</button>\r\n            <button class=\"btn btn-label-file rounded-pill ms-3\" type=\"button\" (click)=\"onCancelUpload()\">{{'Cancel' |\r\n                translate}}</button>\r\n        </form>\r\n    </div>\r\n    <ul class=\"col-md-6 list-group list-group-flush\" *ngIf=\"getChoosenPlan()\">\r\n        <li class=\"list-group-item bg-transparent\">{{'Name' | translate }} : {{getChoosenPlan().name}} </li>\r\n        <li class=\"list-group-item bg-transparent\"> {{'Plan is ' | translate }} :\r\n            {{getChoosenPlan().calibration ? ('Calibrated' | translate) : ('Not calibrated' | translate)}}</li>\r\n        <li class=\"list-group-item bg-transparent\">{{'Attributed to zone ' | translate }} :\r\n            {{getChoosenPlan().zone ? getChoosenPlan().zone.name : 'None'}}</li>\r\n        <li class=\"list-group-item bg-transparent\">{{'Is current plan for zone ' | translate }} :\r\n            <input type=\"checkbox\" [(ngModel)]=\"getChoosenPlan().isCurrentForZone\" (change)=\"onCurrentPlanClick()\">\r\n        </li>\r\n\r\n    </ul>\r\n\r\n    <div class=\"row mt-4\">\r\n        <div class=\"col-md-10\">\r\n            <embed *ngIf=\"getChoosenPlan() && chosenPlanIsPdf\" [src]=\"getChoosenPlan().filepath | safeUrl\"\r\n                type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"650px;\" width=\"100%\" />\r\n            <div *ngIf=\"!chosenPlanIsPdf\" class=\"row\" style=\"height: 500px; overflow: hidden;\" id=\"canvasDiv\">\r\n                <canvas id=\"canvas\" width=\"4096px\" height=\"4096px\">\r\n                    <!-- <img *ngIf=\"chosenPlan\" id=\"plan-image\" [src]=\"chosenPlan.filepath\" style=\"width: 100%;\"> -->\r\n                </canvas>\r\n\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".button-visit{display:none;height:30px;width:30px;position:absolute;background:url(https://api.iconify.design/mdi:map-marker-check.svg?color=red&height=30) no-repeat scroll 0 0 transparent;border:none}#button-visit-left{left:350px;top:550px}#button-visit-right{left:500px;top:600px}.hidden{visibility:hidden;width:1px;height:1px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i1.Router }, { type: i2.SpaceService }, { type: i2.PlanService }, { type: i1$2.FormBuilder }, { type: i3.TranslateService }]; } });
 
 class ChevronComponent {
@@ -1460,10 +1444,10 @@ class ChevronComponent {
     }
 }
 ChevronComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ChevronComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChevronComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ChevronComponent, selector: "lib-chevron", inputs: { conditionShowing: "conditionShowing" }, ngImport: i0, template: "<div style=\"height: 30px; width: 30px;\">\n    <span class=\"icon-container\" >\n      <div [class]=\"conditionShowing ? 'icon-img-up' : 'icon-img-down'\"></div>\n    </span>\n</div>\n", styles: [".icon-container{height:30px;width:30px}.icon-img-down{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-right.svg?width=28) no-repeat center center/contain}.icon-img-up{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-down.svg?width=28) no-repeat center center/contain}\n"] });
+ChevronComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ChevronComponent, selector: "lib-chevron", inputs: { conditionShowing: "conditionShowing" }, ngImport: i0, template: "<div style=\"height: 30px; width: 30px;\">\r\n    <span class=\"icon-container\" >\r\n      <div [class]=\"conditionShowing ? 'icon-img-up' : 'icon-img-down'\"></div>\r\n    </span>\r\n</div>\r\n", styles: [".icon-container{height:30px;width:30px}.icon-img-down{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-right.svg?width=28) no-repeat center center/contain}.icon-img-up{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-down.svg?width=28) no-repeat center center/contain}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ChevronComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-chevron', template: "<div style=\"height: 30px; width: 30px;\">\n    <span class=\"icon-container\" >\n      <div [class]=\"conditionShowing ? 'icon-img-up' : 'icon-img-down'\"></div>\n    </span>\n</div>\n", styles: [".icon-container{height:30px;width:30px}.icon-img-down{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-right.svg?width=28) no-repeat center center/contain}.icon-img-up{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-down.svg?width=28) no-repeat center center/contain}\n"] }]
+            args: [{ selector: 'lib-chevron', template: "<div style=\"height: 30px; width: 30px;\">\r\n    <span class=\"icon-container\" >\r\n      <div [class]=\"conditionShowing ? 'icon-img-up' : 'icon-img-down'\"></div>\r\n    </span>\r\n</div>\r\n", styles: [".icon-container{height:30px;width:30px}.icon-img-down{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-right.svg?width=28) no-repeat center center/contain}.icon-img-up{width:30px;height:100%;background:url(https://api.iconify.design/mdi-light/chevron-down.svg?width=28) no-repeat center center/contain}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { conditionShowing: [{
                 type: Input
             }] } });
@@ -1712,10 +1696,10 @@ class CarouselComponent {
     }
 }
 CarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: CarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: CarouselComponent, selector: "lib-carousel", inputs: { images: "images" }, outputs: { currentScan: "currentScan" }, ngImport: i0, template: "<ngb-carousel [interval]=\"5000\" *ngIf=\"images && images.length > 1\" (slide)=\"onSlide($event)\">\n    <ng-template *ngFor=\"let image of images; let i = index\" ngbSlide [id]=\"'slideId_' + i\">\n        <div class=\"picsum-img-wrapper\">\n            <img [src]=\"image.path\" alt=\"Scan\" class=\"d-block w-100\">\n        </div>\n        <div class=\"carousel-caption\">\n            <h3>{{image.title}}</h3>\n            <p>{{image.description}}</p>\n        </div>\n    </ng-template>\n</ngb-carousel>\n\n<img *ngIf=\"images.length === 1\" [src]=\"images[0].path\" alt=\"Scan\" class=\"d-block w-100\">\n", styles: [""], components: [{ type: i7.NgbCarousel, selector: "ngb-carousel", inputs: ["animation", "activeId", "interval", "wrap", "keyboard", "pauseOnHover", "pauseOnFocus", "showNavigationArrows", "showNavigationIndicators"], outputs: ["slide", "slid"], exportAs: ["ngbCarousel"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbSlide, selector: "ng-template[ngbSlide]", inputs: ["id"], outputs: ["slid"] }] });
+CarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: CarouselComponent, selector: "lib-carousel", inputs: { images: "images" }, outputs: { currentScan: "currentScan" }, ngImport: i0, template: "<ngb-carousel [interval]=\"5000\" *ngIf=\"images && images.length > 1\" (slide)=\"onSlide($event)\">\r\n    <ng-template *ngFor=\"let image of images; let i = index\" ngbSlide [id]=\"'slideId_' + i\">\r\n        <div class=\"picsum-img-wrapper\">\r\n            <img [src]=\"image.path\" alt=\"Scan\" class=\"d-block w-100\">\r\n        </div>\r\n        <div class=\"carousel-caption\">\r\n            <h3>{{image.title}}</h3>\r\n            <p>{{image.description}}</p>\r\n        </div>\r\n    </ng-template>\r\n</ngb-carousel>\r\n\r\n<img *ngIf=\"images.length === 1\" [src]=\"images[0].path\" alt=\"Scan\" class=\"d-block w-100\">\r\n", styles: [""], components: [{ type: i7.NgbCarousel, selector: "ngb-carousel", inputs: ["animation", "activeId", "interval", "wrap", "keyboard", "pauseOnHover", "pauseOnFocus", "showNavigationArrows", "showNavigationIndicators"], outputs: ["slide", "slid"], exportAs: ["ngbCarousel"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbSlide, selector: "ng-template[ngbSlide]", inputs: ["id"], outputs: ["slid"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: CarouselComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-carousel', template: "<ngb-carousel [interval]=\"5000\" *ngIf=\"images && images.length > 1\" (slide)=\"onSlide($event)\">\n    <ng-template *ngFor=\"let image of images; let i = index\" ngbSlide [id]=\"'slideId_' + i\">\n        <div class=\"picsum-img-wrapper\">\n            <img [src]=\"image.path\" alt=\"Scan\" class=\"d-block w-100\">\n        </div>\n        <div class=\"carousel-caption\">\n            <h3>{{image.title}}</h3>\n            <p>{{image.description}}</p>\n        </div>\n    </ng-template>\n</ngb-carousel>\n\n<img *ngIf=\"images.length === 1\" [src]=\"images[0].path\" alt=\"Scan\" class=\"d-block w-100\">\n", styles: [""] }]
+            args: [{ selector: 'lib-carousel', template: "<ngb-carousel [interval]=\"5000\" *ngIf=\"images && images.length > 1\" (slide)=\"onSlide($event)\">\r\n    <ng-template *ngFor=\"let image of images; let i = index\" ngbSlide [id]=\"'slideId_' + i\">\r\n        <div class=\"picsum-img-wrapper\">\r\n            <img [src]=\"image.path\" alt=\"Scan\" class=\"d-block w-100\">\r\n        </div>\r\n        <div class=\"carousel-caption\">\r\n            <h3>{{image.title}}</h3>\r\n            <p>{{image.description}}</p>\r\n        </div>\r\n    </ng-template>\r\n</ngb-carousel>\r\n\r\n<img *ngIf=\"images.length === 1\" [src]=\"images[0].path\" alt=\"Scan\" class=\"d-block w-100\">\r\n", styles: [""] }]
         }], ctorParameters: function () { return []; }, propDecorators: { images: [{
                 type: Input
             }], currentScan: [{
@@ -1892,10 +1876,10 @@ class SelectionComponent {
     }
 }
 SelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SelectionComponent, selector: "lib-selection", outputs: { onSelectionChanged: "onSelectionChanged" }, ngImport: i0, template: "<ng-content></ng-content>\n\n<div id=\"selection\"></div>", styles: ["#selection{will-change:top,left,width,height;top:0px;left:0px;position:fixed;display:block;margin-top:0;margin-left:0;width:0px;height:0px;background:rgba(83,182,187,.3);border-radius:.15em;border:.15em solid rgba(83,182,187,.8);pointer-events:none}\n"] });
+SelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: SelectionComponent, selector: "lib-selection", outputs: { onSelectionChanged: "onSelectionChanged" }, ngImport: i0, template: "<ng-content></ng-content>\r\n\r\n<div id=\"selection\"></div>", styles: ["#selection{will-change:top,left,width,height;top:0px;left:0px;position:fixed;display:block;margin-top:0;margin-left:0;width:0px;height:0px;background:rgba(83,182,187,.3);border-radius:.15em;border:.15em solid rgba(83,182,187,.8);pointer-events:none}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: SelectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-selection', template: "<ng-content></ng-content>\n\n<div id=\"selection\"></div>", styles: ["#selection{will-change:top,left,width,height;top:0px;left:0px;position:fixed;display:block;margin-top:0;margin-left:0;width:0px;height:0px;background:rgba(83,182,187,.3);border-radius:.15em;border:.15em solid rgba(83,182,187,.8);pointer-events:none}\n"] }]
+            args: [{ selector: 'lib-selection', template: "<ng-content></ng-content>\r\n\r\n<div id=\"selection\"></div>", styles: ["#selection{will-change:top,left,width,height;top:0px;left:0px;position:fixed;display:block;margin-top:0;margin-left:0;width:0px;height:0px;background:rgba(83,182,187,.3);border-radius:.15em;border:.15em solid rgba(83,182,187,.8);pointer-events:none}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { onSelectionChanged: [{
                 type: Output
             }] } });
@@ -3056,10 +3040,10 @@ class ImagesComponent {
     }
 }
 ImagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ImagesComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.SpaceService }, { token: i2.VisitService }, { token: i2.NodeService }], target: i0.ɵɵFactoryTarget.Component });
-ImagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ImagesComponent, selector: "lib-images", ngImport: i0, template: "<div class=\"container-fluid dashboard-tab col-sm-10 mb-3\" *ngIf=\"currentSpace\" >\n    <div class=\"m-3\">\n      <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\n    </div>\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n      <div class=\"spinner-border\" role=\"status\">\n        <span class=\"visually-hidden\">{{'Loading' | translate}}...</span>\n      </div>\n    </div>\n    <div ngbDropdown class=\"d-inline-block\" *ngIf=\"currentSpace.visits && currentSpace.visits.length > 0\">\n      <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" *ngIf=\"!currentVisit\"\n        ngbDropdownToggle>{{'Choose 3D visit' | translate}}</button>\n      <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\n        <button ngbDropdownItem *ngFor=\"let visit of currentSpace.visits\" (click)=\"setVisit(visit)\"> {{ visit.name }}\n        </button>\n      </div>\n    </div>\n    <h3 *ngIf=\"currentVisit\">{{ currentVisit.name }}</h3>\n    <div class=\"mt-3\" *ngIf=\"currentVisit && currentImages.length == 0 && !loading\">\n      <h4>{{'No imported images' | translate }}</h4>\n      <p>{{'For import: go Virtual Visits => Import Images' | translate}}</p>\n    </div>\n    <button *ngIf=\"currentVisit && currentImages.length > 0 && !loading\"\n      class=\"btn btn-outline-primary rounded-pill no-lowercase mb-2\" (click)=\"onInventoryClick()\">\n      {{'Run AI inventory on this image' | translate}}</button>\n    <lib-carousel [images]=\"currentImages\" *ngIf=\"currentImages\" (currentScan)=\"setCurrentScan($event)\"></lib-carousel>\n  </div>", styles: [""], components: [{ type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: ["menuItems"], outputs: ["onGoBack"] }, { type: CarouselComponent, selector: "lib-carousel", inputs: ["images"], outputs: ["currentScan"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }], pipes: { "translate": i3.TranslatePipe } });
+ImagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.7", type: ImagesComponent, selector: "lib-images", ngImport: i0, template: "<div class=\"container-fluid dashboard-tab col-sm-10 mb-3\" *ngIf=\"currentSpace\" >\r\n    <div class=\"m-3\">\r\n      <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\r\n    </div>\r\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n      <div class=\"spinner-border\" role=\"status\">\r\n        <span class=\"visually-hidden\">{{'Loading' | translate}}...</span>\r\n      </div>\r\n    </div>\r\n    <div ngbDropdown class=\"d-inline-block\" *ngIf=\"currentSpace.visits && currentSpace.visits.length > 0\">\r\n      <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" *ngIf=\"!currentVisit\"\r\n        ngbDropdownToggle>{{'Choose 3D visit' | translate}}</button>\r\n      <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\r\n        <button ngbDropdownItem *ngFor=\"let visit of currentSpace.visits\" (click)=\"setVisit(visit)\"> {{ visit.name }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <h3 *ngIf=\"currentVisit\">{{ currentVisit.name }}</h3>\r\n    <div class=\"mt-3\" *ngIf=\"currentVisit && currentImages.length == 0 && !loading\">\r\n      <h4>{{'No imported images' | translate }}</h4>\r\n      <p>{{'For import: go Virtual Visits => Import Images' | translate}}</p>\r\n    </div>\r\n    <button *ngIf=\"currentVisit && currentImages.length > 0 && !loading\"\r\n      class=\"btn btn-outline-primary rounded-pill no-lowercase mb-2\" (click)=\"onInventoryClick()\">\r\n      {{'Run AI inventory on this image' | translate}}</button>\r\n    <lib-carousel [images]=\"currentImages\" *ngIf=\"currentImages\" (currentScan)=\"setCurrentScan($event)\"></lib-carousel>\r\n  </div>", styles: [""], components: [{ type: TabNavigationComponent, selector: "lib-tab-navigation", inputs: ["menuItems"], outputs: ["onGoBack"] }, { type: CarouselComponent, selector: "lib-carousel", inputs: ["images"], outputs: ["currentScan"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { type: i7.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { type: i7.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgbDropdownItem, selector: "[ngbDropdownItem]", inputs: ["disabled"] }], pipes: { "translate": i3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.7", ngImport: i0, type: ImagesComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-images', template: "<div class=\"container-fluid dashboard-tab col-sm-10 mb-3\" *ngIf=\"currentSpace\" >\n    <div class=\"m-3\">\n      <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\n    </div>\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n      <div class=\"spinner-border\" role=\"status\">\n        <span class=\"visually-hidden\">{{'Loading' | translate}}...</span>\n      </div>\n    </div>\n    <div ngbDropdown class=\"d-inline-block\" *ngIf=\"currentSpace.visits && currentSpace.visits.length > 0\">\n      <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" *ngIf=\"!currentVisit\"\n        ngbDropdownToggle>{{'Choose 3D visit' | translate}}</button>\n      <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\n        <button ngbDropdownItem *ngFor=\"let visit of currentSpace.visits\" (click)=\"setVisit(visit)\"> {{ visit.name }}\n        </button>\n      </div>\n    </div>\n    <h3 *ngIf=\"currentVisit\">{{ currentVisit.name }}</h3>\n    <div class=\"mt-3\" *ngIf=\"currentVisit && currentImages.length == 0 && !loading\">\n      <h4>{{'No imported images' | translate }}</h4>\n      <p>{{'For import: go Virtual Visits => Import Images' | translate}}</p>\n    </div>\n    <button *ngIf=\"currentVisit && currentImages.length > 0 && !loading\"\n      class=\"btn btn-outline-primary rounded-pill no-lowercase mb-2\" (click)=\"onInventoryClick()\">\n      {{'Run AI inventory on this image' | translate}}</button>\n    <lib-carousel [images]=\"currentImages\" *ngIf=\"currentImages\" (currentScan)=\"setCurrentScan($event)\"></lib-carousel>\n  </div>", styles: [""] }]
+            args: [{ selector: 'lib-images', template: "<div class=\"container-fluid dashboard-tab col-sm-10 mb-3\" *ngIf=\"currentSpace\" >\r\n    <div class=\"m-3\">\r\n      <lib-tab-navigation [menuItems]='menuItems' (onGoBack)=\"onGoBack()\"></lib-tab-navigation>\r\n    </div>\r\n    <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\r\n      <div class=\"spinner-border\" role=\"status\">\r\n        <span class=\"visually-hidden\">{{'Loading' | translate}}...</span>\r\n      </div>\r\n    </div>\r\n    <div ngbDropdown class=\"d-inline-block\" *ngIf=\"currentSpace.visits && currentSpace.visits.length > 0\">\r\n      <button class=\"btn btn-label-file rounded-pill\" id=\"dropdownBasic1\" *ngIf=\"!currentVisit\"\r\n        ngbDropdownToggle>{{'Choose 3D visit' | translate}}</button>\r\n      <div ngbDropdownMenu aria-labelledby=\"dropdownBasic1\">\r\n        <button ngbDropdownItem *ngFor=\"let visit of currentSpace.visits\" (click)=\"setVisit(visit)\"> {{ visit.name }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n    <h3 *ngIf=\"currentVisit\">{{ currentVisit.name }}</h3>\r\n    <div class=\"mt-3\" *ngIf=\"currentVisit && currentImages.length == 0 && !loading\">\r\n      <h4>{{'No imported images' | translate }}</h4>\r\n      <p>{{'For import: go Virtual Visits => Import Images' | translate}}</p>\r\n    </div>\r\n    <button *ngIf=\"currentVisit && currentImages.length > 0 && !loading\"\r\n      class=\"btn btn-outline-primary rounded-pill no-lowercase mb-2\" (click)=\"onInventoryClick()\">\r\n      {{'Run AI inventory on this image' | translate}}</button>\r\n    <lib-carousel [images]=\"currentImages\" *ngIf=\"currentImages\" (currentScan)=\"setCurrentScan($event)\"></lib-carousel>\r\n  </div>", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i2.SpaceService }, { type: i2.VisitService }, { type: i2.NodeService }]; } });
 
 class EditPlanComponent {
@@ -3169,9 +3153,7 @@ class EditPlanComponent {
                         this.images360 = yield this.visitService.loadImagesForSpace(currentSpace);
                         this.editedPlan = Object.assign({}, this.chosenPlan);
                         this.editedPlan.filepath = base64;
-                        console.log(event.data);
                         this.newZoneData = event.data.zoneData;
-                        console.log("newZoneData", this.newZoneData);
                         if (this.newZoneData.elements.length === 0) {
                             modalReference.close();
                             alert(this.translate.instant("edition.no-zone"));
@@ -3208,8 +3190,6 @@ class EditPlanComponent {
                 this.svgEditorIframe = svgEditor;
                 this.svgEditor = new svgEditor.contentWindow.SvgEditor();
                 yield this.svgEditor.init();
-                // await this.svgEditor.pref(key, val);
-                // await this.svgEditor.setConfig({ extentions: this.extensions });
                 yield this.svgEditor.setConfig(this.config, {
                     allowInitialUserOverride: true,
                 });
@@ -3224,12 +3204,13 @@ class EditPlanComponent {
                         this.svgEditorIframe.contentWindow.postMessage({ action: "disable-zone" }, "*");
                     }, 1000);
                 }
+                this.svgEditor.svgCanvas.setMode('ext-panning');
+                this.svgEditor.bottomPanel.changeZoom(50);
             }
         });
     }
     onSave(redirect) {
         return __awaiter(this, void 0, void 0, function* () {
-            console.log("in onSave");
             const imgBlob = yield new Blob([this.svgEditor.svgCanvas.getSvgString()], {
                 type: "image/svg+xml",
             });
@@ -3331,6 +3312,8 @@ class EditPlanComponent {
                     },
                 });
                 this.svgEditor.svgCanvas.setHref(newImage, canvas.toDataURL("image/png"));
+                this.svgEditor.svgCanvas.renameCurrentLayer(this.translate.instant("edition.plan-base"));
+                this.svgEditor.svgCanvas.createLayer(this.translate.instant("edition.personalization"));
             });
         });
     }
@@ -3360,6 +3343,8 @@ class EditPlanComponent {
                         },
                     });
                     this.svgEditor.svgCanvas.setHref(newImage, reader.result);
+                    this.svgEditor.svgCanvas.renameCurrentLayer(this.translate.instant("edition.plan-base"));
+                    this.svgEditor.svgCanvas.createLayer(this.translate.instant("edition.personalization"));
                 };
                 reader.readAsDataURL(imgBlob);
             }