architwin 1.10.23 → 1.11.1

package/lib/atwinui/components/toolbar/generalSettingsMenuPane.d.ts

@@ -1,4 +1,7 @@
+export declare let selectedOptionMap: string;
 export declare function renderGeneralSettingsMenu(): HTMLDivElement;
 export declare function initGeneralSelectedMap(): void;
 export declare function toggleGeneralMapOptions(): void;
+export declare function setSelectedMap(id: string): void;
+export declare function getSelectedMapOption(): string;
 export declare function displayGeneralSettingsMenu(): void;

package/lib/atwinui/components/toolbar/generalSettingsMenuPane.js

@@ -1,7 +1,8 @@
-import { MAP_OPTIONS } from '../../../types';
+import { MAP_OPTIONS, SPACE_EVENTS } from '../../../types';
+import { dispatchSpaceEvent, getSpaceId } from '../../../architwin';
 import log from 'loglevel';
 import i18n from './i18n';
-let selectedOptionMap = '';
+export let selectedOptionMap = MAP_OPTIONS.DEFAULT_MAP;
 export function renderGeneralSettingsMenu() {
     const element = document.createElement('div');
     element.classList.add('at_container');
@@ -13,7 +14,7 @@ export function renderGeneralSettingsMenu() {
     <div id="at-general-setting-container" class="at_flex at_flex_column">
         <div class="at_form_container">
                 <div class="at_flex at_space_between">
-                <span class="at_bolder at_text_base">${i18n.t('GeneralSettings')}</span>
+                <span class="at_bolder at_text_base">${i18n.t('General Settings')}</span>
                 <span class="mdi mdi-close at_text_base" style="cursor:pointer" id="at-close-general-settings" target-pane="at-general-setting-pane"></span>
             </div>
 
@@ -27,17 +28,17 @@ export function renderGeneralSettingsMenu() {
                     <div style="position:absolute;">
                         <div class="at_dropdown_options" id="at-setting-map-filter-options" data-cy="at-setting-map-filter-options">
                             <div class="at_dropdown_option" data-value="${MAP_OPTIONS.DEFAULT_MAP}" data-cy="at-setting-map-option-default" id="at-setting-map-option-default">
-                                <span>${i18n.t(MAP_OPTIONS.DEFAULT_MAP)}</span>
+                                <span class="at_option">${i18n.t('Default Minimap')}</span>
                             </div>
                             <div class="at_dropdown_option" data-value="${MAP_OPTIONS.CUSTOM_MAP}" data-cy="at-setting-map-option-custom" id="at-setting-map-option-custom">
-                                <span>${i18n.t(MAP_OPTIONS.CUSTOM_MAP)}</span>
+                                <span class="at_option">${i18n.t('Custom Minimap')}</span>
                             </div>
                         </div>
                     </div>
             </div>
 
             <span class="at_text_xxs at_mx-w-16 mdi mdi-information-slab-circle" id="at-general-settings-note">
-                ${i18n.t("Due to restrictions, original minimap is unavailable in password protected spaces. Please select and setup a custom minimap instead")}
+                ${i18n.t("Due to restrictions, original minimap is unavailable in password protected spaces. Please select and setup a custom minimap instead.")}
             </span>
             <div class="at_scrollable_container at_h-min-45"></div>
         </div>
@@ -48,8 +49,7 @@ export function renderGeneralSettingsMenu() {
 export function initGeneralSelectedMap() {
     log.info('initGeneralSelectedMap()');
     const selectedMap = document.getElementById('at-setting-selected-map');
-    selectedMap.innerText = i18n.t(MAP_OPTIONS.DEFAULT_MAP);
-    selectedOptionMap = MAP_OPTIONS.DEFAULT_MAP;
+    selectedMap.innerText = i18n.t(selectedOptionMap);
 }
 export function toggleGeneralMapOptions() {
     log.info('toggleGeneralMapOptions()');
@@ -57,35 +57,67 @@ export function toggleGeneralMapOptions() {
     const defaultOption = document.getElementById('at-setting-map-option-default');
     const customOption = document.getElementById('at-setting-map-option-custom');
     const mapOptions = document.getElementById('at-setting-map-filter-options');
+    const spaceId = getSpaceId(window.location.href);
     dropdown.addEventListener('click', () => {
         mapOptions.classList.toggle('open');
         defaultOption.addEventListener('click', () => {
             setSelectedMap(MAP_OPTIONS.DEFAULT_MAP);
+            const defaultPayload = {
+                minimap: {
+                    type: MAP_OPTIONS.DEFAULT_MAP,
+                    custom_floor_data: null
+                }
+            };
+            dispatchSpaceEvent(SPACE_EVENTS.MINIMAP_CHANGED, { space_id: spaceId, payload: defaultPayload });
             if (mapOptions.classList.contains('open')) {
                 mapOptions.classList.toggle('close');
             }
         });
         customOption.addEventListener('click', () => {
             setSelectedMap(MAP_OPTIONS.CUSTOM_MAP);
+            const custom = {
+                minimap: {
+                    type: MAP_OPTIONS.CUSTOM_MAP,
+                    custom_floor_data: null
+                }
+            };
+            dispatchSpaceEvent(SPACE_EVENTS.MINIMAP_CHANGED, { space_id: spaceId, payload: custom });
             if (mapOptions.classList.contains('open')) {
                 mapOptions.classList.toggle('close');
             }
         });
     });
 }
-function setSelectedMap(id) {
+export function setSelectedMap(id) {
     log.info('setSelectedMap()');
     const selectedMap = document.getElementById('at-setting-selected-map');
     if (selectedMap && id) {
         if (id == MAP_OPTIONS.DEFAULT_MAP) {
-            selectedMap.innerText = `${i18n.t('Default Map')}`;
+            selectedMap.innerText = `${i18n.t('Default Minimap')}`;
             selectedOptionMap = MAP_OPTIONS.DEFAULT_MAP;
+            log.info('initCustomMap ', selectedOptionMap);
         }
         else if (id == MAP_OPTIONS.CUSTOM_MAP) {
-            selectedMap.innerText = `${i18n.t('Custom Map')}`;
+            selectedMap.innerText = `${i18n.t('Custom Minimap')}`;
             selectedOptionMap = MAP_OPTIONS.CUSTOM_MAP;
         }
+        log.info('initCustomMap ', selectedOptionMap);
+        getSelectedMapOption();
+        // during init()
     }
+    else if (!selectedMap && id) {
+        if (id == MAP_OPTIONS.DEFAULT_MAP) {
+            selectedOptionMap = `${i18n.t('Default Minimap')}`;
+        }
+        else if (id == MAP_OPTIONS.CUSTOM_MAP) {
+            selectedOptionMap = `${i18n.t('Custom Minimap')}`;
+        }
+        getSelectedMapOption();
+    }
+}
+export function getSelectedMapOption() {
+    log.info('getSelectedMapOption()');
+    return selectedOptionMap;
 }
 export function displayGeneralSettingsMenu() {
     log.info('displayGeneralSettingsMenu()');

package/lib/atwinui/components/toolbar/i18n.js

@@ -164,7 +164,9 @@ i18n
                 "Millimeter": "Millimeter",
                 "Centimeter": "Centimeter",
                 "PleaseWaitTagPlacement": "Please wait for the current tag to be placed before placing a new one",
-                "RotateMinimap": "Rotate Minimap"
+                "RotateMinimap": "Rotate Minimap",
+                "General Settings": "General Settings",
+                "UploadImage": "Upload Image"
             }
         },
         ja: {
@@ -323,13 +325,14 @@ i18n
                 "Millimeter": "ミリメートル",
                 "Centimeter": "センチメートル",
                 "PleaseWaitTagPlacement": "新しいタグを配置する前に、現在のタグが配置されるまでお待ちください。",
-                "DEFAULT MINIMAP": "デフォルトミニマップ",
-                "CUSTOM MINIMAP": "カスタムミニマップ",
-                "GeneralSettings": "一般設定",
+                "Default Minimap": "デフォルトミニマップ",
+                "Custom Minimap": "カスタムミニマップ",
+                "General Settings": "一般設定",
                 "BIM Settings": "BIM設定",
-                "Due to restrictions, original minimap is unavailable in password protected spaces. Please select and setup a custom minimap instead": "制限事項により、パスワードで保護されたスペースではオリジナルのミニマップはご利用いただけません。代わりにカスタムミニマップを選択して設定してください。",
+                "Due to restrictions, original minimap is unavailable in password protected spaces. Please select and setup a custom minimap instead.": "制限事項により、パスワードで保護されたスペースではオリジナルのミニマップはご利用いただけません。代わりにカスタムミニマップを選択して設定してください。",
                 "RotateMinimap": "ミニマップの回転",
-                "Search...": "検索..."
+                "Search...": "検索...",
+                "UploadImage": "画像をアップロード"
             }
         }
     },

package/lib/atwinui/components/toolbar/menuBar.js

@@ -5,7 +5,6 @@ import { toggleActionBar } from "../../events";
 import { getAssetUrl } from "../../../utils";
 import { toggleBasepointCalibratePane } from "./basepointCalibratePane";
 import { toggleModelControl } from "./modelControlsPane";
-// import { generalSettingsMenuPane } from './generalSettingsMenuPane'
 export let activeMenu;
 export let isObjectListEnabled = true;
 export let isMeetingEnabled = false;
@@ -38,10 +37,6 @@ export function renderMenuBar(iFrame) {
         <span class="mdi mdi-map"  id="at-minimap-btn" data-cy="at-minimap-btn" target-pane="at-map"></span>
         <div class="at_icon_tooltip" data-cy="at-tooltip-minimap">${i18n.t('Minimap')}</div>
     </div>
-    <div class="at_sidebar_button_icon">
-        <span class="mdi mdi-map"  id="at-custom-minimap-btn" data-cy="at-custom-minimap-btn"></span>
-        <div class="at_icon_tooltip" data-cy="at-tooltip-minimap">Custom Minimap</div>
-    </div> 
     <div class="at_sidebar_button_icon" style="display:${isMeetingEnabled ? 'block' : 'none'}">
         <span class="mdi mdi-message-video" id="at-videocall-btn" data-cy="at-videocall-btn" target-pane="at-video-call-pane"></span>
         <div class="at_icon_tooltip" data-cy="at-tooltip-meeting">${i18n.t('Meeting')}</div>
@@ -64,7 +59,7 @@ export function renderMenuBar(iFrame) {
     </div>
     <div class="at_sidebar_button_icon">
         <span class="mdi mdi-cog-outline" id="at-general-setting-btn" data-cy="at-general-setting-btn" target-pane="at-general-setting-pane"></span>
-        <div class="at_icon_tooltip" data-cy="at-tooltip-general-setting">${i18n.t('GeneralSettings')}</div>
+        <div class="at_icon_tooltip" data-cy="at-tooltip-general-setting">${i18n.t('General Settings')}</div>
     </div>
     `;
     return menuBarElement;
@@ -103,7 +98,7 @@ function setMenuItemsStatus() {
             isBIMEnabled = _mpConfig.toolbarConfig.menuItems.bim;
             log.info("__@ isBIMEnabled: ", isBIMEnabled);
         }
-        // THEME
+        // GENERAL SETTINGS
         if (menuItems.generalSetting !== undefined) {
             isThemeEnabled = _mpConfig.toolbarConfig.menuItems.generalSetting;
             log.info("__@ isGeneralSettingsEnabled: ", isGeneralSettingsEnabled);
@@ -127,7 +122,7 @@ export function setActiveMenu(id) {
         case 'at-theme-picker-btn':
         case 'at-room-creation-btn':
         case 'at-settings-btn':
-        case 'general-setting':
+        case 'at-general-setting-btn':
             if (parent.classList.contains('at_sidebar_button_icon_active')) {
                 // remove
                 log.info("removing active...");

package/lib/atwinui/components/toolbar/modelControlsPane.js

@@ -1,11 +1,12 @@
 import { convertMeasurement, degreesToRadians, radiansToDegrees, useCapitalizeFirstLetter } from "../../../utils";
-import { getSelectedObject, setObjectTransformation, get3DXObjects, _3DXObjects, isToolbarFeatureEnabled } from "../../../architwin";
+import { getSelectedObject, setObjectTransformation, get3DXObjects, _mpConfig, _3DXObjects, isToolbarFeatureEnabled, actionHistory, transformHistory } from "../../../architwin";
 import { COORDINATE_SYSTEM, UNITS } from "../../../types";
 import { convertZupToYup, convertYupToZup, getOffsetPositionFromBasepoint, convertYupScaleToZupScale, convertZupScaleToYupScale } from "../../../worldConversion";
 import { getScaleFactor, getMeasurementUnit, getBasepoint, getCoordinateSystem, isAdjust, getMPBasepoint, getRotationUnit } from "./actionSettingsPane";
 import { Notyf } from 'notyf';
 import log from 'loglevel';
 import i18n from "./i18n";
+import { toggleActionBarButtons } from "../../components/toolbar";
 let notyf = new Notyf({ position: { x: 'left', y: 'bottom' }, duration: 4500 });
 export let activeModelControlPane = false;
 export let modelControlPane;
@@ -213,7 +214,7 @@ export function getCoordinateValues() {
         y: parseFloat(inputY.value),
         z: parseFloat(inputZ.value)
     };
-    log.info("___caroline formcoords xyz: ", formCoords);
+    log.info("___formcoords xyz: ", formCoords);
     let mpPosition;
     let mpRotation;
     let mpScale;
@@ -288,6 +289,24 @@ export function getCoordinateValues() {
     transform.object_position = transformType === 'translate' ? mpPosition : selectedObject.node.position;
     transform.object_scale = transformType === 'scale' ? mpScale : selectedObject.node.scale;
     transform.object_rotation = transformType === 'rotate' ? mpRotation : selectedObject.object.object_rotation;
+    console.log("caroline input transform", transform, formCoords);
+    if (transform && formCoords) {
+        console.log("caroline input undo coordinates", transform, formCoords);
+        setObjectTransformation(selectedObject.node, transform);
+        //Add to the action history so it can be reverse with undo or redo
+        console.log("caroline input undo test", formCoords);
+        const currentTransform = JSON.stringify(formCoords);
+        if (currentTransform) {
+            console.log("caroline input current transform", transform, currentTransform);
+            actionHistory.push(currentTransform);
+            // @ts-expect-error
+            transformHistory.addAction(selectedObject.object.id, transform.object_position, transform.object_rotation, transform.object_scale);
+        }
+        if (_mpConfig.toolbarConfig) {
+            toggleActionBarButtons('at-redo-action-btn', transformHistory.canRedo(selectedObject.object.id));
+            toggleActionBarButtons('at-undo-action-btn', transformHistory.canUndo(selectedObject.object.id));
+        }
+    }
     console.log("getCoordinateValues rotation quaternion values", selectedObject.node.quaternion);
     return transform;
 }
@@ -924,7 +943,6 @@ function updateObjectViaInput() {
     // }
     if ((inputX && inputY && inputZ)) {
         const transform = getCoordinateValues();
-        console.log("JAMES transform", transform);
         const selectedObject = getSelectedObject();
         setObjectTransformation(selectedObject.node, transform);
         if (transformType == 'translate') {

package/lib/atwinui/events.js

@@ -11,7 +11,7 @@ import { actionBar, renderObjectCards, renderLibraryCards, renderTags, renderTag
 import { getTargetPosition, addMediaScreen, _3DXObjects, selectedObject, setTransformControls, copyObject, revertTransform, clearSelectedObject, removeTransformControls, getLibrary, getMpTags, renderTag, captureSpaceScreenshot, moveTag, subscribeSpaceEvent, setModelVisibility, disposeModel, disposeTag, _tags, _tagCategories, dispatchSpaceEvent, editTagLabel, editTagDescription, setTagMessageRecepients, setTagMessages, setSelectedTagUuid, renderMeetingSidebar, setTagIcon, setObjectTransformation, getSelectedObject, _atwin, isCdnMapDataAvailable, captureScreenshotAndCameraDetails, _mpConfig, cancelModelPlacement, _modelDetails, actionHistory, get3DXObjects, transformHistory, goToModel, themeManager, _partitionNodes, setSpacePartitionNodes, getSpaceId, setFloorBaseHeight, toggleWallVisibility, getChildrenOfModel, toggleFloorVisibility, renderPolygon, getCurrentPolygon, getFloorBaseHeight, setSelectedObject, redoDrawAction, undoDrawAction, setWallBaseHeight, clearWallBaseHeight, clearFloorBaseHeight, isToolbarFeatureEnabled, captureCurrentView, getCurrentFloor, } from "../architwin";
 import { Notyf } from 'notyf';
 import 'notyf/notyf.min.css';
-import { SPACE_EVENTS, COORDINATE_SYSTEM, UNITS } from "../types";
+import { SPACE_EVENTS, COORDINATE_SYSTEM, UNITS, DEGREE, MAP_OPTIONS } from "../types";
 import { initFormData } from "./components/toolbar/tagFormPane";
 import { renderObjectList } from "./components/toolbar/objectListPane";
 import { renderLibraryList } from "./components/toolbar/libraryPane";
@@ -27,7 +27,7 @@ import { getCurrentEditRoomData, displayRoomTree, updatePartitionVisibilityUI, g
 import { toggleDrawPartitionButton, displayPartitionFormMode, setPartitionFormMode, clearPartitionForm, setPolygonData, getPartitionFormData, getPartitionSavingMode, setPartitionSavingMode, getPartitionFormMode, getNewlyAddedPartition, setCurrentPartitionData, getTempCurrentPolygon, clearTempCurrentPolygon } from "./components/toolbar/spacePartition/roomFormPane";
 import { actionSettingsSelectOption, getTempCoordinateSystem, getTempMeasurementUnit, getTempRotationUnit, setCoordinateSystem, setMeasurementUnit, setRotationUnit, initSettingsValues, setTempCoordinateSystem, setTempMeasurementUnit, setTempRotationUnit, toggleActionSettingsDropdown, toggleCalibrateBasepoint, setScaleFactor, getTempScaleFactor, setTempScaleFactor, setBasepoint, getTempBasepoint, setTempBasepoint, getBasepoint, toggleActionSettings, getBasepointObjectPayload, displayConvertedCoordinates, getCoordinateSystem, getScaleFactor, getMeasurementUnit, getRotationUnit, setBasepointObjectPayload } from "./components/toolbar/actionSettingsPane";
 import { getBasepointCalibrateBpCoordinateValues, getBasepointCalibrateMpCoordinateValues, initBsepointCalibratePane, toggleBasepointCalibratePane } from "./components/toolbar/basepointCalibratePane";
-import { toggleGeneralMapOptions, initGeneralSelectedMap } from './components/toolbar/generalSettingsMenuPane';
+import { toggleGeneralMapOptions, initGeneralSelectedMap, getSelectedMapOption } from './components/toolbar/generalSettingsMenuPane';
 import { searchTagList, setSearchTagTerm, searchClearfield, getSearchTagTerm } from './components/toolbar/tagListPane';
 let activeToolbarItem, activeActionItem, activePane, activeActionPane, cancelTagPlacementPrompt, cancelModelPlacementPrompt;
 let notyf = new Notyf({ position: { x: 'left', y: 'bottom' }, duration: 4500, types: [
@@ -253,6 +253,7 @@ function toggleDisplayPane(targetId) {
                 if (paneId === 'at-general-setting-pane') {
                     log.info("General Settings Pane");
                     initGeneralSelectedMap();
+                    handleCloseActiveMinimap();
                 }
                 return;
             }
@@ -338,6 +339,7 @@ function setupIndividualEventListeners() {
     handleShowCustomMinimapSettings();
     handleCloseCustomMinimap();
     handleCustomMapControls();
+    handleCloseActiveMinimap();
 }
 //================ OBJECT EVENT HANDLERS ===============//
 function handleTranslateObject() {
@@ -1064,7 +1066,19 @@ function handleDeleteModel(objId) {
     });
 }
 function handleShowMinimap() {
-    log.info("handleShowMinimap()");
+    log.info("handleShowMinimap()", getSelectedMapOption());
+    const selectedMapOption = getSelectedMapOption();
+    if (selectedMapOption == MAP_OPTIONS.DEFAULT_MAP) {
+        log.info("Default Minimap: ", selectedMapOption == MAP_OPTIONS.DEFAULT_MAP);
+        handleShowDefaultMinimap();
+    }
+    else if (selectedMapOption == MAP_OPTIONS.CUSTOM_MAP) {
+        log.info("Custom Minimap: ", selectedMapOption == MAP_OPTIONS.CUSTOM_MAP);
+        handleShowCustomMinimap();
+    }
+}
+function handleShowDefaultMinimap() {
+    log.info("handleShowDefaultMinimap()");
     if (isCdnMapDataAvailable) {
         const map = document.getElementById('at-map');
         const style = window.getComputedStyle(map);
@@ -2489,6 +2503,8 @@ function handleShowCustomMinimap() {
     if (customMapPane) {
         if (customMapPane.style.display === "none") {
             log.info("Showing custom minimap");
+            minimap.mapPositions.forEach(position => customMapPane.classList.remove(position));
+            customMapPane.classList.add(minimap.getMinimapPosition());
             customMapPane.style.display = 'block';
             minimap.showDirection();
         }
@@ -2505,15 +2521,21 @@ function handleShowCustomMinimapSettings() {
     log.info("handleCustomMinimapSettingsToggle()");
     const settingsBtn = document.getElementById('at-custom-map-settings-btn');
     const mapControlsContainer = document.getElementById('at-custom-minimap-settings');
+    const minimapPane = document.getElementById('at-custom-minimap-pane');
     if (settingsBtn) {
         settingsBtn.addEventListener('click', () => {
             isCustomMapControlsVisible = !isCustomMapControlsVisible;
             if (mapControlsContainer) {
                 if (isCustomMapControlsVisible) {
                     mapControlsContainer.classList.add('show');
+                    minimapPane.classList.add('show-settings');
                 }
                 else {
                     mapControlsContainer.classList.remove('show');
+                    if (minimap.getMinimapPosition().includes('bottom')) {
+                        minimapPane.classList.add('no-transition');
+                    }
+                    minimapPane.classList.remove('show-settings');
                 }
             }
         });
@@ -2529,15 +2551,23 @@ function handleCloseCustomMinimap() {
     if (closeBtn) {
         closeBtn.addEventListener('click', () => {
             customMapPane.style.display = 'none';
+            setActiveMenu('at-minimap-btn');
         });
     }
 }
+/**
+ * Closes General Settings Menu
+ */
 function handleCloseGeneralSettingsMenu() {
     const closeGeneralSettingsButton = document.getElementById('at-close-general-settings');
     log.info('handleCloseGeneralSettingsMenu()');
     if (closeGeneralSettingsButton) {
         closeGeneralSettingsButton.addEventListener('click', () => {
             toggleDisplayPane('at-close-general-settings');
+            const activeElement = document.querySelector('.at_sidebar_button_icon_active');
+            if (activeElement) {
+                activeElement.classList.remove("at_sidebar_button_icon_active");
+            }
         });
     }
 }
@@ -2547,6 +2577,8 @@ function handleCloseGeneralSettingsMenu() {
  */
 function handleCustomMapControls() {
     log.info("handleCustomMinimapSettingsToggle()");
+    // Upload image
+    handleUploadMinimapImage();
     // Screenshot button
     handleScreenshotMinimap();
     // Rotate minimap button
@@ -2561,6 +2593,7 @@ function handleScreenshotMinimap() {
     log.info("handleScreenshotMinimap()");
     const screenshotBtn = document.getElementById('at-custom-screenshot-btn');
     const customMapImage = document.getElementById('at-custom-map-img');
+    const fileInput = document.getElementById('at-custom-image-input');
     if (screenshotBtn) {
         // Screenshot minimap event listener
         screenshotBtn.addEventListener('click', () => __awaiter(this, void 0, void 0, function* () {
@@ -2573,13 +2606,23 @@ function handleScreenshotMinimap() {
                 // Change the img src to the screenshot (base64 string)
                 customMapImage.src = imageURI;
                 customMapImage.style.display = 'block';
-                showLoader(false);
+                customMapImage.classList.remove('at_rotate-90', 'at_rotate-180', 'at_rotate-270', 'at_rotate-360');
+                minimap.setCustomMinimapRotation(DEGREE.DEG_0);
+                customMapImage.classList.add(`at_rotate-${360}`);
+                dispatchSpaceEvent(SPACE_EVENTS.FLOOR_IMAGE_ROTATED, DEGREE.DEG_0);
+                let customMapFloorData = minimap.getCustomMapFloorData();
                 const currentFloor = getCurrentFloor();
+                if (Array.isArray(customMapFloorData)) {
+                    customMapFloorData[currentFloor.sequence].rotate = DEGREE.DEG_0;
+                }
+                dispatchSpaceEvent(SPACE_EVENTS.CUSTOM_MAP_SETTINGS_UPDATED, customMapFloorData);
+                showLoader(false);
                 dispatchSpaceEvent(SPACE_EVENTS.FLOOR_IMAGE_SELECTED, {
                     imageURI,
                     name: `${_modelDetails.name}-${currentFloor.name}-${currentFloor.sequence}.jpg`,
                     currentFloor: currentFloor.sequence
                 });
+                fileInput.value = ''; // to reset uploaded image
             }
             catch (error) {
                 log.error('Screenshot failed', error);
@@ -2828,12 +2871,104 @@ function handleCustomMapFloorImageUploaded(payload) {
             };
             minimap.setCustomMapFloorData(floorData);
         }
+        const updatedFloorData = minimap.getCustomMapFloorData();
+        dispatchSpaceEvent(SPACE_EVENTS.CUSTOM_MAP_SETTINGS_UPDATED, updatedFloorData);
         notyf.success("Saved custom floor image");
     }
 }
 function handleCustomMapFloorUploadFailed() {
     notyf.error("Failed to upload custom floor image. Please try again later");
 }
+function handleUploadMinimapImage() {
+    log.info('handleUploadMinimapImage()');
+    const uploadImageBtn = document.getElementById('at-custom-upload-image-btn');
+    const fileInput = document.getElementById('at-custom-image-input');
+    const customMapImage = document.getElementById('at-custom-map-img');
+    if (uploadImageBtn && fileInput && customMapImage) {
+        uploadImageBtn.addEventListener('click', () => {
+            log.info('Upload button clicked');
+            fileInput.click();
+        });
+        fileInput.addEventListener('change', (event) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            log.info('File input change');
+            const target = event.target;
+            const file = (_a = target.files) === null || _a === void 0 ? void 0 : _a[0];
+            if (file) {
+                const MAX_SIZE = 2.5 * 1024 * 1024; // 2.5MB in bytes
+                if (file.size > MAX_SIZE) {
+                    notyf.error(i18n.t('FileTooBig'));
+                    log.warn(`Upload failed: image is ${file.size} bytes`);
+                    fileInput.value = '';
+                    return;
+                }
+                try {
+                    showLoader(true);
+                    customMapImage.style.display = 'none';
+                    const reader = new FileReader();
+                    reader.onload = (e) => __awaiter(this, void 0, void 0, function* () {
+                        var _b;
+                        const imageURI = (_b = e.target) === null || _b === void 0 ? void 0 : _b.result;
+                        // Set image preview
+                        customMapImage.src = imageURI;
+                        customMapImage.style.display = 'block';
+                        customMapImage.classList.remove('at_rotate-90', 'at_rotate-180', 'at_rotate-270', 'at_rotate-360');
+                        minimap.setCustomMinimapRotation(DEGREE.DEG_0);
+                        customMapImage.classList.add(`at_rotate-${360}`);
+                        dispatchSpaceEvent(SPACE_EVENTS.FLOOR_IMAGE_ROTATED, DEGREE.DEG_0);
+                        let customMapFloorData = minimap.getCustomMapFloorData();
+                        const currentFloor = getCurrentFloor();
+                        if (Array.isArray(customMapFloorData)) {
+                            customMapFloorData[currentFloor.sequence].rotate = DEGREE.DEG_0;
+                        }
+                        dispatchSpaceEvent(SPACE_EVENTS.CUSTOM_MAP_SETTINGS_UPDATED, customMapFloorData);
+                        showLoader(false);
+                        dispatchSpaceEvent(SPACE_EVENTS.FLOOR_IMAGE_SELECTED, {
+                            imageURI,
+                            name: `${_modelDetails.name}-${currentFloor.name}-${currentFloor.sequence}.jpg`,
+                            currentFloor: currentFloor.sequence
+                        });
+                    });
+                    reader.readAsDataURL(file);
+                }
+                catch (error) {
+                    log.error('Image upload failed', error);
+                    showLoader(false);
+                }
+            }
+        }));
+    }
+}
+// This closes active Default/Custom Minimap when General Settings is active
+function handleCloseActiveMinimap() {
+    log.info('handleCloseActiveMinimap()');
+    const defaultMinimap = document.getElementById('at-map');
+    const customMapPane = document.getElementById('at-custom-minimap-pane');
+    const generalSettingBtn = document.getElementById('at-general-setting-btn');
+    const generalSetting = document.getElementById('at-general-setting-pane');
+    if (generalSettingBtn) {
+        generalSettingBtn.addEventListener('click', () => {
+            const activeElement = document.querySelector('.at_sidebar_button_icon_active');
+            if (customMapPane.style.display == "block") {
+                log.info("Hiding custom minimap");
+                customMapPane.style.display = 'none';
+            }
+            if (defaultMinimap.style.display == "block") {
+                log.info("Hiding default minimap");
+                defaultMinimap.style.display = 'none';
+            }
+            if (activeElement == null && generalSetting.style.display == 'block') {
+                setActiveMenu('at-general-setting-btn');
+            }
+            else if (activeElement != null && generalSetting.style.display == 'block') {
+                setActiveMenu('at-general-setting-btn');
+            }
+            else {
+                activeElement.classList.remove("at_sidebar_button_icon_active");
+            }
+        });
+    }
+}
 export { 
 //state
 activeToolbarItem, activeActionItem, cancelModelPlacementPrompt, isCustomMapControlsVisible, 

package/lib/atwinui/index.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { batchAddEventListenerByClassName, batchAddEventListenerById, setActiveToolbarItem, toggleDisplayPane, toggleActionBar, setupIndividualEventListeners, setupSpaceEventSubscriptions, handleShowMinimap, handleRenderMeetingUI, handleShowCustomMinimap } from './events';
+import { batchAddEventListenerByClassName, batchAddEventListenerById, setActiveToolbarItem, toggleDisplayPane, toggleActionBar, setupIndividualEventListeners, setupSpaceEventSubscriptions, handleShowMinimap, handleRenderMeetingUI } from './events';
 import '../../static/atwinui.css';
 import { renderToolbarUI, setActiveMenu, setActiveActionBtn, setActiveThemeCard, toggleModelControl, toggleModal, setModalAction, toggleActionBarButtons } from './components/toolbar';
 import { SPACE_EVENTS } from '../types';
@@ -56,12 +56,6 @@ function initToolbarUI(payload) {
         }
         else if (event.target.id === 'at-videocall-btn') {
             handleRenderMeetingUI();
-            //@ts-ignore
-        }
-        else if (event.target.id === 'at-custom-minimap-btn') {
-            handleShowCustomMinimap();
-            //@ts-ignore
-            setActiveMenu(event.target.id);
         }
         else {
             //@ts-expect-error

package/lib/minimap.d.ts

@@ -1,5 +1,5 @@
 import { MpSdk } from "../bundle/sdk";
-import { ISweep, SweepColor, DEGREE, MAP_OPTIONS, CustomMapFloorData } from "./types";
+import { ISweep, SweepColor, DEGREE, CustomMapFloorData } from "./types";
 import 'notyf/notyf.min.css';
 declare let isMinimapNavigation: boolean;
 interface FloorData {
@@ -7,13 +7,14 @@ interface FloorData {
     label: string;
     sequence: number;
 }
+declare const mapPositions: string[];
 declare function setMap(mpSdk: MpSdk, appKey: string, mapId: string, openOnLoad?: boolean): Promise<void>;
 declare function locateAvatar(): Promise<void>;
 declare function showMinimap(): void;
 declare function hideMinimap(): void;
 declare function resetSweepMarkerColors(): void;
 declare function renderOverlaySweep(item: ISweep, socketId: string, color: string): void;
-declare function showDirection(mapType?: MAP_OPTIONS): void;
+declare function showDirection(): void;
 /**
  * Toggles the visibility of the minimap. This will display a toast notification if the CDN is unavailable or has not
  * finished fetching map data
@@ -49,7 +50,7 @@ declare function createDropdown(mapPositions: string[]): Promise<HTMLDivElement>
  * Sets Minimap Position anywhere inside Space as selected by User
  * @param position Accepts a string (bottomLeft/bottomRight/topRight/topLeft)
  * */
-declare function setMinimapPosition(position: string): Promise<void>;
+declare function setMinimapPosition(mapContainer: HTMLElement, position: string): Promise<void>;
 /**
  * Creates and returns a custom minimap DOM element containing a canvas.
  * @returns {HTMLDivElement} The custom minimap element.
@@ -95,6 +96,7 @@ declare function setCustomMapXOffset(xOffset: number): void;
 declare function getCustomMapXOffset(): number;
 declare function setCustomMapYOffset(yOffset: number): void;
 declare function getCustomMapYOffset(): number;
+declare function getMinimapPosition(): string;
 /**
  * Sets an individual or entire floor data array of custom minimap
  * @param payload
@@ -110,4 +112,4 @@ declare function getCustomMapFloorData(index?: number): CustomMapFloorData[] | C
  * Resets the custom map setting to its defaults values
  */
 declare function resetCustomMapSettingValues(): void;
-export { isMinimapNavigation, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility, setSweepMarkerColor, setStandaloneMap, toggleMinimapFloor, getFloorsInSpace, createDropdown, setMinimapPosition, setCustomMap, setupCustomMinimapPane, setCustomMinimapRotation, getCustomMinimapRotation, generateCustomMinimap, setCustomMapScale, setCustomMapTranslate, setCustomMapXOffset, setCustomMapYOffset, getCustomMapScale, getCustomMapTranslate, getCustomMapXOffset, getCustomMapYOffset, setMinAndMax, setCustomMapFloorData, getCustomMapFloorData, resetCustomMapSettingValues };
+export { isMinimapNavigation, mapPositions, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility, setSweepMarkerColor, setStandaloneMap, toggleMinimapFloor, getFloorsInSpace, createDropdown, setMinimapPosition, setCustomMap, setupCustomMinimapPane, setCustomMinimapRotation, getCustomMinimapRotation, generateCustomMinimap, setCustomMapScale, setCustomMapTranslate, setCustomMapXOffset, setCustomMapYOffset, getCustomMapScale, getCustomMapTranslate, getCustomMapXOffset, getCustomMapYOffset, setMinAndMax, setCustomMapFloorData, getCustomMapFloorData, resetCustomMapSettingValues, getMinimapPosition, };