architwin 1.2.6 → 1.2.7

package/README.md

@@ -3287,6 +3287,45 @@ You can technically forego the at_showcase_container class of the parent div wit
 
 - **zIndex** - (optional) Set the z-index of the map. In cases where you have UI elements that coincide with the position of the minimap. You set the z-index value of the minimap to determine what order the minimap should be rendered.
 
+**Customizing Individual Minimap Sweep Buttons**
+
+You may use the `setSweepMarkerColor` method if you need to customize the individual colors of the sweep buttons in the minimap. The method accepts either an object that contains the sweepId of the sweep button and the new background color or an array of said object
+
+| parameter | type | required | default | values |
+| :----: | :----: | :---: | :---: | :---: |
+| payload | SweepColor or Array of SweepColor | yes |  |
+
+
+*Example:*
+```typescript
+  import * as atwin from 'architwin'
+
+  const newSweepColor = {
+    sweepId: 'validSweepId',
+    backgroundColor: '#353535'
+  } as SweepColor
+
+  atwin.minimap.setSweepMarkerColor(newSweepColor)
+```
+
+If you want to change the color of multiple sweep buttons when the minimap
+sweep buttons are rendered, you may subscribe to the `MINIMAP_SWEEPS_RENDERED` event using the `subscribeSpaceEvent` method.
+
+*Example:*
+```typescript
+  import * as atwin from 'architwin'
+
+  const newSweepColors = [
+    {
+    sweepId: 'validSweepId',
+    backgroundColor: '#353535'
+    },
+    //other objects
+  ]
+
+  atwin.subscribeSpaceEvent('MINIMAP_SWEEPS_RENDERED', atwin.minimap.setSweepMarkerColor(newSweepColors))
+```
+
 ##### Toolbar Config
 
 To activate a toolbar display within your 3D Space, you can set the following key-value pairs in your configuration object.

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

@@ -107,7 +107,8 @@ export function renderTagMessage(message, optimisticUpdate = false) {
     chat.classList.add('at_flex_row');
     chat.classList.add('at_justify_start');
     chat.style.display = 'flex';
-    const dateToString = formatWithOptions({ locale: ja }, 'd MMMM yyyy hh:mm:ss');
+    // const dateToString = formatWithOptions({locale: ja},'d MMMM yyyy hh:mm:ss')
+    const dateToString = formatWithOptions({ locale: ja }, 'yyyy/MM/dd HH:mm');
     //const created_on = format(new Date(), 'yyyy-MM-dd HH:mm:ss')
     const parsedDate = parseISO(message.created_on);
     const created_on = dateToString(parsedDate);

package/lib/color.js

@@ -127,5 +127,7 @@ export function isValidCSSColor(value) {
     element.style.color = "inherit";
     element.style.color = value;
     // Check if the computed color is the same as the input value
-    return element.style.color !== "inherit";
+    const res = element.style.color !== "inherit";
+    element.remove();
+    return res;
 }

package/lib/minimap.d.ts

@@ -1,5 +1,5 @@
 import { MpSdk } from "../bundle/sdk";
-import { ISweep } from "./types";
+import { ISweep, SweepColor } from "./types";
 import 'notyf/notyf.min.css';
 declare let isMinimapNavigation: boolean;
 declare function setMap(mpSdk: MpSdk, appKey: string, mapId: string): Promise<void>;
@@ -14,4 +14,10 @@ declare function showDirection(): void;
  * finished fetching map data
  */
 declare function toggleMinimapVisibility(): void;
-export { isMinimapNavigation, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility };
+/**
+ * Changes the default color of an individual or multiple sweep buttons inside the minimap
+ * @param {SweepColor | Array<SweepColor>} payload - An object or array of objects containing the sweepId and new color of the sweep button
+ * @returns {void}
+ */
+declare function setSweepMarkerColor(payload: SweepColor | Array<SweepColor>): void;
+export { isMinimapNavigation, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility, setSweepMarkerColor };

package/lib/minimap.js

@@ -250,6 +250,7 @@ function setMap(mpSdk, appKey, mapId) {
             onCollectionUpdated: function (collection) {
                 log.info('the entire up-to-date collection', collection);
                 _minimapSweepCollection = collection;
+                dispatchSpaceEvent(SPACE_EVENTS.MINIMAP_SWEEPS_RENDERED);
             }
         });
         // On click - move
@@ -522,6 +523,38 @@ function toggleMinimapVisibility() {
         log.error("Matterport CDN content is unavailable. Architwin package tried to fetch map data from CDN but got an empty response. Please try again later");
     }
 }
+/**
+ * Changes the default color of an individual or multiple sweep buttons inside the minimap
+ * @param {SweepColor | Array<SweepColor>} payload - An object or array of objects containing the sweepId and new color of the sweep button
+ * @returns {void}
+ */
+function setSweepMarkerColor(payload) {
+    console.log("setSweepMarkerColor()");
+    if (!payload) {
+        console.error("payload is undefined");
+        return;
+    }
+    if (Array.isArray(payload)) {
+        payload.forEach((p, i) => {
+            if (isValidCSSColor(p.backgroundColor)) {
+                const sweepButton = document.getElementById(`p${p.sweepId}`);
+                if (sweepButton) {
+                    sweepButton.style.background = p.backgroundColor;
+                }
+            }
+        });
+    }
+    else {
+        if (isValidCSSColor(payload.backgroundColor) == false) {
+            console.error("Invalid color value");
+            return;
+        }
+        const sweepButton = document.getElementById(`p${payload.sweepId}`);
+        if (sweepButton) {
+            sweepButton.style.background = payload.backgroundColor;
+        }
+    }
+}
 export { 
 // _miniMapData as minimapData,
-isMinimapNavigation, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility };
+isMinimapNavigation, setMap, showMinimap, hideMinimap, locateAvatar, resetSweepMarkerColors, renderOverlaySweep, showDirection, toggleMinimapVisibility, setSweepMarkerColor };

package/lib/types.d.ts

@@ -631,7 +631,8 @@ export declare enum SPACE_EVENTS {
     VIEW_TAG_MESSAGE = "VIEW_TAG_MESSAGE",
     TOOLBAR_LOADED = "TOOLBAR_LOADED",
     SWEEP_COLLECTION_UPDATED = "SWEEP_COLLECTION_UPDATED",
-    MINIMAP_SWEEP_CLICK = "MINIMAP_SWEEP_CLICK"
+    MINIMAP_SWEEP_CLICK = "MINIMAP_SWEEP_CLICK",
+    MINIMAP_SWEEPS_RENDERED = "MINIMAP_SWEEPS_RENDERED"
 }
 export declare const enum TAG_COLOR {
     MAROON = "MAROON",
@@ -777,6 +778,10 @@ export interface ModalContent {
     description: string;
     buttonLabel?: string;
 }
+export interface SweepColor {
+    sweepId: string;
+    backgroundColor: string;
+}
 export declare const enum IO_ROLE {
     HOST = "host",
     GUEST = "guest"

package/lib/types.js

@@ -43,6 +43,7 @@ export var SPACE_EVENTS;
     SPACE_EVENTS["TOOLBAR_LOADED"] = "TOOLBAR_LOADED";
     SPACE_EVENTS["SWEEP_COLLECTION_UPDATED"] = "SWEEP_COLLECTION_UPDATED";
     SPACE_EVENTS["MINIMAP_SWEEP_CLICK"] = "MINIMAP_SWEEP_CLICK";
+    SPACE_EVENTS["MINIMAP_SWEEPS_RENDERED"] = "MINIMAP_SWEEPS_RENDERED";
 })(SPACE_EVENTS || (SPACE_EVENTS = {}));
 export var MEETING_SIDEBAR;
 (function (MEETING_SIDEBAR) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "architwin",
-  "version": "1.2.6",
+  "version": "1.2.7",
   "description": "ArchiTwin Library for Matterport",
   "main": "./lib/architwin.js",
   "types": "./lib/architwin.d.ts",

package/pre_deploy.sh

@@ -32,7 +32,7 @@ fi
 
 echo "\n=> TAG to publish...$TAG"
 # Pause the script
-read -p "Press Enter to continue..."
+# read -p "Press Enter to continue..."
 
 echo "\n=> Force PUSH TAGS to Origin..."
 git push -f --tags -v