architwin 1.12.4 → 1.12.5

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

@@ -15,3 +15,7 @@ export declare function getTagMessageText(): string;
 export declare function clearTagMessageInput(): void;
 export declare function createTagMessage(): TagMessage;
 export declare function setTagMessagingDetails(tagId: string): void;
+export declare function unsendComment(payload: any): void;
+export declare function timedoutComment(payload: Array<TagMessage>): void;
+export declare function checkTimeoutDifference(createdDateInput: Date, mode: string): boolean;
+export declare function getTheseTagMessages(payload: Array<TagMessage>): TagMessage[];

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

@@ -1,3 +1,12 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import { getTagMessageRecepients, getTagMessages, getSelectedTagUuid, dispatchSpaceEvent, _tags } from "../../../architwin";
 import { SPACE_EVENTS } from "../../../types";
 import { bytesToMegabytes, convertToCssRgb, generateUUID } from "../../../utils";
@@ -7,7 +16,9 @@ import { parseISO } from 'date-fns';
 import { formatWithOptions } from "date-fns/fp";
 import { ja } from "date-fns/locale";
 import i18n from './i18n';
+import { batchAddEventListenerByClassName } from '../../events';
 let notyf = new Notyf({ position: { x: 'left', y: 'bottom' } });
+let theseTagMessages = [];
 export function renderTagMessagingPane() {
     const element = document.createElement('div');
     element.classList.add('at_container');
@@ -140,7 +151,11 @@ export function renderTagMessage(message, optimisticUpdate = false) {
                 `
                         <img class="at_chat_media" src="${message.image_url}"/><br>
                         ` : ``}
-                        <small>${created_on}</small>
+                        <small>${created_on}</small><br>
+                        <div class="at_flex at_justify_center at_comment_unsend_container" style="${checkTimeoutDifference(message.created_on, 'check') == true ? 'at_comment_unsend_container' : 'display: none'} id="at-unsend-container-${message.uuid}">
+                            <small class="mdi mdi-arrow-u-left-top at_text_xxs at_align_center at_comment_unsend_text">&nbsp;</small>
+                            <small class="at_text_xxs at_align_center at_comment_unsend_text" id="at-unsend-user-text-${created_on}">Unsend</small>
+                        </div>
                     </div>
                 </div>
             `;
@@ -152,8 +167,8 @@ export function renderTagMessage(message, optimisticUpdate = false) {
     }
     else {
         chat.innerHTML = `
-            <span class="at_chat_avatar at_chat_avatar_sender">${message.owner_name.charAt(0).toUpperCase()}</span>
-            <div class="at_chat_bubble at_chat_bubble_sent">
+            <span class="at_chat_avatar at_chat_avatar_sender" id="at-chat-avatar-container-${message.uuid}">${message.owner_name.charAt(0).toUpperCase()}</span>
+            <div class="at_chat_bubble at_chat_bubble_sent" id="at-chat-bubble-container-${message.uuid}">
                 <div>
                     <small>${message.owner_name} ➡️ ${message.to_user_name}</small> <br>
                     ${message.messages}
@@ -162,8 +177,13 @@ export function renderTagMessage(message, optimisticUpdate = false) {
             `
                     <img class="at_chat_media" src="${message.image_url}"/><br>
                     ` : ``}
-                    <small>${created_on}</small>
+                    <small>${created_on}</small><br>
+                    <div class="at_flex at_justify_center at_comment_unsend_container" id="at-unsend-container-${message.uuid}" style="${checkTimeoutDifference(message.created_on, 'check') == true ? 'at_comment_unsend_container' : 'display: none'}">
+                        <small class="mdi mdi-arrow-u-left-top at_text_xxs at_align_center at_comment_unsend_text">&nbsp;</small>
+                        <small class="at_text_xxs at_align_center at_comment_unsend_text" id="at-unsend-admin-text-${message.uuid}" value="${message.uuid}">Unsend</small>
+                    </div>
                 </div>
+
             </div>
         `;
     }
@@ -171,13 +191,20 @@ export function renderTagMessage(message, optimisticUpdate = false) {
         const firstChild = chatContainer.firstChild;
         chatContainer.insertBefore(chat, firstChild);
         const input = (document.getElementById("at-no-message"));
-        input.remove();
-        return;
+        if (input)
+            input.remove();
+        // return
     }
     else {
         chatContainer.appendChild(chat);
-        return;
     }
+    chat.addEventListener('click', (event) => {
+        //@ts-expect-error
+        const newMessage = event.target.getAttribute('value');
+        console.log('___chat is clicked', newMessage, message);
+        unsendComment({ newMessage });
+    });
+    return;
 }
 export function getSelectedMessageRecepient() {
     const recepientDropdown = document.getElementById('at-recepient-dropdown');
@@ -220,6 +247,7 @@ export function getTagMessageText() {
     return content;
 }
 export function clearTagMessageInput() {
+    console.log('clearTagMessageInput()');
     const textareaInput = document.getElementById('at-chat-textarea');
     textareaInput.value = '';
 }
@@ -261,16 +289,18 @@ export function createTagMessage() {
     message.created_on = created_on;
     dispatchSpaceEvent(SPACE_EVENTS.TAG_MESSAGE_SENT, message);
     // add remove span
+    //clear input field
+    clearTagMessageInput();
     //Perform optimistic update
-    renderTagMessage(message, true);
+    renderTagMessage(message, false); //change to false due to Unsend Option #15713
     //Clear forms
     clearSelectedMedia();
-    clearTagMessageInput();
     notyf.success(`${i18n.t('MessageSentSuccess')}`);
+    getTagMessages();
     return message;
 }
 export function setTagMessagingDetails(tagId) {
-    console.log("setTagMessagingDetails()", tagId);
+    console.log("setTagMessagingDetails() ", tagId);
     if (tagId && tagId !== '') {
         const tagTitle = document.getElementById('at-tag-name-messaging');
         const tagColor = document.getElementById('at-tag-color-messaging');
@@ -299,3 +329,80 @@ export function setTagMessagingDetails(tagId) {
     console.error("tagId is either undefined or empty");
     return;
 }
+// this deletes a selected Chat Bubble
+export function unsendComment(payload) {
+    console.log('___unsendComment()', payload);
+    batchAddEventListenerByClassName('at_comment_unsend_container', (event) => __awaiter(this, void 0, void 0, function* () {
+        console.log('__batch event', event);
+        //@ts-ignore
+        const commentTag = event.target.getAttribute('value');
+        if (commentTag && payload.tagMessages) {
+            console.log('__comment uuid: ', payload.tagMessages);
+            const commentFound = payload.tagMessages.find((message) => {
+                return message.uuid == commentTag;
+            });
+            if (commentFound && checkTimeoutDifference(commentFound.created_on, 'delete') == true) {
+                dispatchSpaceEvent(SPACE_EVENTS.TAG_MESSAGE_UNSEND, { uuid: commentFound.uuid, tagId: commentFound.tag_uuid });
+                hideTagBubble(commentFound.uuid);
+            }
+        }
+    }));
+}
+// this sets the Interval to check if Timeout hadn't pass yet
+export function timedoutComment(payload) {
+    console.log('timedoutComment()', payload);
+    setInterval(function () {
+        // console.log("This message prints every 5 seconds.", payload);
+        payload.filter((message) => __awaiter(this, void 0, void 0, function* () {
+            const difference = yield checkTimeoutDifference(parseISO(message.created_on), 'check');
+            const container = document.getElementById(`at-unsend-container-${message.uuid}`);
+            if (difference == true && container) {
+                // console.log('difference test: ', difference)
+                // container.style.display = 'block'
+            }
+            else if (difference == false && container) {
+                container.style.display = 'none';
+                // console.log('This message print UNSEND STILL AVAIABLE')
+            }
+        }));
+    }, 5000);
+}
+// this compares the created_on and current Time of User its within Timeout
+export function checkTimeoutDifference(createdDateInput, mode) {
+    const createdDate = new Date(createdDateInput);
+    const currentDate = new Date();
+    const difference = currentDate.getTime() - createdDate.getTime();
+    const TIMEOUT = 10 * 60 * 1000;
+    if (mode == 'check') {
+        if (difference <= TIMEOUT) {
+            timedoutComment(theseTagMessages);
+            return true;
+        }
+        else {
+            return false;
+        }
+    }
+    else if (mode == 'delete') {
+        if (difference <= TIMEOUT) {
+            return true;
+        }
+        else {
+            return false;
+        }
+    }
+}
+// this function hides the selected Chat Bubble while it is being deleted
+function hideTagBubble(payload) {
+    console.log('hideTagBubble()', payload);
+    const chatContainer = document.getElementById(`at-chat-bubble-container-${payload}`);
+    const chaAvatar = document.getElementById(`at-chat-avatar-container-${payload}`);
+    if (chatContainer && chaAvatar) {
+        chatContainer.style.display = 'none';
+        chaAvatar.style.display = 'none';
+    }
+}
+// this gets the tagMessages
+export function getTheseTagMessages(payload) {
+    console.log('getTheseTagMessages()');
+    return theseTagMessages = payload;
+}

package/lib/atwinui/events.js

@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { actionBar, renderObjectCards, renderLibraryCards, renderTags, renderTagRow, getTagFormData, addClickEventToTagRow, setActiveCard, setActiveMenu, removeObjectCard, clearActiveMenu, setTagCategoriesOption, toggleDropdown, tagFormMode, selectedTag, renderRecepientOptions, renderTagMessages, createTagMessage, setTagLink, setTagMessagingDetails, renderCategoryDropdownOptions, clearTagFormDropdown, clearActiveActionBtn, clearActiveCard, toggleActionBarButtons, selectedCategoryFilterId, selectedSubCategoryFilterId, filterTagList, toggleModal, setModalAction, } from "./components/toolbar";
-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 { 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, detachTagMedia, getTagDataCollection } from "../architwin";
 import { Notyf } from 'notyf';
 import 'notyf/notyf.min.css';
 import { SPACE_EVENTS, COORDINATE_SYSTEM, UNITS, DEGREE, MAP_OPTIONS } from "../types";
@@ -29,6 +29,7 @@ import { actionSettingsSelectOption, getTempCoordinateSystem, getTempMeasurement
 import { getBasepointCalibrateBpCoordinateValues, getBasepointCalibrateMpCoordinateValues, initBsepointCalibratePane, toggleBasepointCalibratePane } from "./components/toolbar/basepointCalibratePane";
 import { toggleGeneralMapOptions, initGeneralSelectedMap, getSelectedMapOption } from './components/toolbar/generalSettingsMenuPane';
 import { searchTagList, setSearchTagTerm, searchClearfield, getSearchTagTerm } from './components/toolbar/tagListPane';
+import { unsendComment, timedoutComment, getTheseTagMessages } from './components/toolbar/tagMessagingPane';
 let activeToolbarItem, activeActionItem, activePane, activeActionPane, cancelTagPlacementPrompt, cancelModelPlacementPrompt;
 let notyf = new Notyf({ position: { x: 'left', y: 'bottom' }, duration: 4500, types: [
         {
@@ -863,11 +864,13 @@ function handleSaveTag() {
             const index = _tags.findIndex(tag => tag.id == selectedTag.id);
             //Check if object contains a url embed and if the url does not match the existing url in media url
             //perform a validation of the new url embed
-            if (tagFormPayload && tagFormPayload.tagEmbed && _tags[index].media_url !== tagFormPayload.tagEmbed) {
-                if ((yield isValidUrl(tagFormPayload.tagEmbed)) === false) {
-                    notyf.error(`${i18n.t('InvalidURL')}`);
-                    saveTagBtn.classList.remove('at_disabled');
-                    return;
+            if (tagFormPayload && tagFormPayload.tagEmbed != '') { // this condition is added when Embed URL is removed by user and is Empty #15842
+                if (tagFormPayload && tagFormPayload.tagEmbed && _tags[index].media_url !== tagFormPayload.tagEmbed) {
+                    if ((yield isValidUrl(tagFormPayload.tagEmbed)) === false) {
+                        notyf.error(`${i18n.t('InvalidURL')}`);
+                        saveTagBtn.classList.remove('at_disabled');
+                        return;
+                    }
                 }
             }
             if (_tagCategories) {
@@ -915,15 +918,26 @@ function handleSaveTag() {
                         }
                         _tags[index].category_uuid = tagFormPayload.tagSubcategoryId;
                         _tags[index].json_data.color = targetCategory.json_data.color.rgb;
-                        if (tagFormPayload.tagEmbed !== _tags[index].media_url) {
-                            const tagData = {
-                                id: _tags[index].json_data.id,
-                                attachments: []
-                            };
-                            const mediaAttachment = [tagFormPayload.tagEmbed];
-                            yield attachTagMedia({ sdk: _atwin, tag: tagData, attachments: mediaAttachment });
+                        if (tagFormPayload.tagEmbed && tagFormPayload.tagEmbed != '') { // this condition is added when Embed URL is removed by user and is Empty #15842
+                            if (tagFormPayload.tagEmbed !== _tags[index].media_url) {
+                                const tagData = {
+                                    id: _tags[index].json_data.id,
+                                    attachments: []
+                                };
+                                const mediaAttachment = [tagFormPayload.tagEmbed];
+                                const attachments = yield attachTagMedia({ sdk: _atwin, tag: tagData, attachments: mediaAttachment });
+                            }
+                            _tags[index].media_url = tagFormPayload.tagEmbed;
+                        }
+                        else {
+                            _tags[index].media_url = undefined;
+                            const tagDataCollection = getTagDataCollection();
+                            _tags[index].json_data.attachments = tagDataCollection[_tags[index].json_data.id] ? tagDataCollection[_tags[index].json_data.id].attachments : _tags[index].json_data.attachments;
+                            if (_tags[index].json_data.attachments) {
+                                yield detachTagMedia({ tagId: _tags[index].json_data.id, attachmentIds: _tags[index].json_data.attachments });
+                                _tags[index].json_data.attachments = [];
+                            }
                         }
-                        _tags[index].media_url = tagFormPayload.tagEmbed;
                         // Add tag icon data
                         _tags[index].tag_icon_name = thisTagIconName;
                         _tags[index].tag_icon_url = thisTagIconURL;
@@ -1412,6 +1426,9 @@ function handleRetrieveTagMessage(payload) {
     renderRecepientOptions();
     renderTagMessages();
     setTagMessagingDetails(payload.tagUuid);
+    unsendComment(payload);
+    getTheseTagMessages(payload.tagMessages);
+    timedoutComment(payload.tagMessages);
 }
 function handleSetModelsView() {
     const modelsCardViewBtn = document.getElementById('at-models-card-view-btn');

package/lib/tag.d.ts

@@ -28,7 +28,7 @@ declare function attachTagMedia(payload: {
     sdk: MpSdk;
     tag: MpSdk.Tag.TagData;
     attachments: string[];
-}): Promise<void>;
+}): Promise<string[]>;
 declare function detachTagMedia(payload: {
     sdk: MpSdk;
     tag: ITag;

package/lib/tag.js

@@ -136,10 +136,12 @@ function attachTagMedia(payload) {
         payload.tag.attachments = [];
         for (let i in payload.attachments) {
             const [attachmentId] = yield payload.sdk.Tag.registerAttachment(payload.attachments[i]);
+            log.info("media attachmentId ", attachmentId);
             payload.tag.attachments.push(attachmentId);
         }
         yield payload.sdk.Tag.attach(payload.tag.id, ...payload.tag.attachments);
         log.info('__@ Attach successfully');
+        return payload.tag.attachments;
     });
 }
 function detachTagMedia(payload) {

package/lib/types.d.ts

@@ -730,7 +730,8 @@ export declare enum SPACE_EVENTS {
     CUSTOM_SWEEP_OFFSETX_UPDATED = "CUSTOM_SWEEP_OFFSETX_UPDATED",
     CUSTOM_SWEEP_OFFSETY_UPDATED = "CUSTOM_SWEEP_OFFSETY_UPDATED",
     CUSTOM_MAP_SETTINGS_UPDATED = "CUSTOM_MAP_SETTINGS_UPDATED",
-    SPACE_METADATA_RETRIEVED = "SPACE_METADATA_RETRIEVED"
+    SPACE_METADATA_RETRIEVED = "SPACE_METADATA_RETRIEVED",
+    TAG_MESSAGE_UNSEND = "TAG_MESSAGE_UNSEND"
 }
 export declare const enum TAG_COLOR {
     MAROON = "MAROON",

package/lib/types.js

@@ -107,6 +107,7 @@ export var SPACE_EVENTS;
     SPACE_EVENTS["CUSTOM_SWEEP_OFFSETY_UPDATED"] = "CUSTOM_SWEEP_OFFSETY_UPDATED";
     SPACE_EVENTS["CUSTOM_MAP_SETTINGS_UPDATED"] = "CUSTOM_MAP_SETTINGS_UPDATED";
     SPACE_EVENTS["SPACE_METADATA_RETRIEVED"] = "SPACE_METADATA_RETRIEVED";
+    SPACE_EVENTS["TAG_MESSAGE_UNSEND"] = "TAG_MESSAGE_UNSEND";
 })(SPACE_EVENTS || (SPACE_EVENTS = {}));
 export var MEETING_SIDEBAR;
 (function (MEETING_SIDEBAR) {

package/package.json

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

package/static/atwinui.css

@@ -1801,3 +1801,7 @@
 .at_default_coordinate_system {
     margin-top: 15px;
 }
+
+.at_comment_unsend_container{
+    cursor: pointer;
+}