@chat21/chat21-web-widget 5.0.51 → 5.0.52-rc.3

package/dist/test.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Widget Test Page</title>
-    <script type="application/javascript"> 
+    <script type="application/javascript" async> 
       // Handler for .ready() called.
       window.tiledeskSettings = 
       {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chat21/chat21-web-widget",
   "author": "Tiledesk SRL",
-  "version": "5.0.51",
+  "version": "5.0.52-rc.3",
   "license": "MIT License",
   "homepage": "https://www.tiledesk.com",
   "repository": {

package/src/app/component/conversation-detail/conversation/conversation.component.html

@@ -21,6 +21,7 @@
         [stylesMap]="stylesMap"
         [translationMap]="translationMapHeader"
         [widgetTitle]="g?.project?.widgetTitle"
+        [build_version]="g?.singleConversation? g?.BUILD_VERSION: null"
         [windowContext]="g?.windowContext"
         [isMenuShow]="isMenuShow"
         [isTypings]="isTypings"

package/src/app/component/conversation-detail/conversation-header/conversation-header.component.html

@@ -139,6 +139,18 @@
         <span class="label-menu-item">{{ translationMap?.get('LOGOUT') }}</span>
     </div>
 
+    <!-- BUILD VERSION -->
+    <div class="c21-button build_version_menu" *ngIf="build_version">
+        <!-- <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" class="icon-menu">
+          <path d="M0 0h24v24H0z" fill="none"/>
+          <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/>
+          <title id="altIconTitle">{{g.LOGOUT}}</title>
+        </svg> -->
+        <span class="label-menu-item">{{build_version}}</span>
+    </div>
+
+
+
   <!-- ICON EDIT PROFILE -->
   <!-- <div class="c21-header-button c21-right" *ngIf="messages && messages.length > 1">
       <svg role="img" aria-labelledby="altIconTitle" [ngStyle]="{'fill': g.themeForegroundColor }" xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24">

package/src/app/component/conversation-detail/conversation-header/conversation-header.component.scss

@@ -130,5 +130,16 @@
         stroke: $icon-fill-color;
     }
 
+    .build_version_menu {
+        color: $gray;
+        justify-content: center;
+        font-size: 0.8em;
+    }
+    
+    .build_version_menu:hover {
+        cursor: default;
+        background-color: unset;
+    }
+
     
 }

package/src/app/component/conversation-detail/conversation-header/conversation-header.component.ts

@@ -31,6 +31,7 @@ export class ConversationHeaderComponent implements OnInit, OnChanges {
   @Input() stylesMap: Map<string, string>
   @Input() translationMap: Map< string, string>;
   @Input() widgetTitle: string;
+  @Input() build_version: string;
   @Output() onBack = new EventEmitter();
   @Output() onCloseWidget = new EventEmitter();
   @Output() onSoundChange = new EventEmitter();

package/src/assets/twp/chatbot-panel.html

@@ -108,6 +108,7 @@
             background-position: inherit;
             background-attachment: fixed;
             background-size: cover;
+            opacity: 0.4;
         }
 
         .row {
@@ -261,6 +262,7 @@
             calloutTimer: 1,
             singleConversation: true,
             restartConversation: true,
+            isLogEnabled: true,
             hideCloseConversationOptionMenu: true
             // autostart: false
 
@@ -418,29 +420,6 @@
         // console.log('tiledesk_projectid: ', tiledesk_projectid);
         // console.log('project_name: ', project_name);
 
-        window.onload = function() {
-            document.getElementById("project_id").innerHTML = '"' + tiledesk_projectid + '"';
-            // document.getElementById("project_name").innerHTML = project_name;
-            
-            if(role !== 'agent'){
-                document.getElementById("testPageButton").style.display = 'block'
-            }
-        }
-
-        // window.tileDeskAsyncInit = function() {
-        //     window.tiledesk.on('onLoadParams', function(event_data) {
-        //         // console.log('onLoadParams: ')
-        //         window.tiledesk.open();
-        //     });
-
-        //     window.tiledesk.on('onInit', function(event_data) {
-        //         setTimeout(() => {
-        //             document.getElementById("preloader").style.display = "none";
-        //         }, 1000);
-                
-        //     });
-        // };
-
         function getQueryVariable(variable)     {
             var query = window.location.search.substring(1);
             var vars = query.split("&");

package/src/assets/twp/index-dev.html

@@ -460,11 +460,11 @@
                 document.getElementById('events').scrollTop = document.getElementById('events').scrollHeight
             }, 1000);
             //open widget after 3s if is closed
-            setTimeout(() => {
-                if(event_data && event_data.detail && event_data.detail.global && !event_data.detail.global.isOpen){
-                    window.Tiledesk('open')
-                }
-            }, 3000);
+            // setTimeout(() => {
+            //     if(event_data && event_data.detail && event_data.detail.global && !event_data.detail.global.isOpen){
+            //         window.Tiledesk('open')
+            //     }
+            // }, 3000);
         });
         
         window.Tiledesk('onAuthStateChanged', function(event_data) {

package/src/chat21-core/providers/mqtt/mqtt-archivedconversations-handler.ts

@@ -186,7 +186,6 @@ export class MQTTArchivedConversationsHandler extends ArchivedConversationsHandl
             this.setClosingConversation(conversation.conversation_with, false);
             this.logger.debug('[MQTTArchivedConversationsHandler] conversations:', conversation.uid, this.archivedConversations);
             const index = this.searchIndexInArrayForConversationWith(this.archivedConversations, conversation.conversation_with);
-            console.log("NUOVA CONVER;.uid2" + conversation.uid)
             if (index > -1) {
                 this.logger.debug('[MQTTArchivedConversationsHandler] TROVATO')
                 this.archivedConversations.splice(index, 1, conversation);

package/src/chat21-core/providers/mqtt/mqtt-conversation-handler.ts

@@ -101,12 +101,19 @@ export class MQTTConversationHandler extends ConversationHandlerService {
         }
         this.chat21Service.chatClient.lastMessages(this.conversationWith, (err, messages) => {
             if (!err) {
+                this.logger.log('[MQTTConversationHandlerSERVICE] message lastMessages:', messages);
                 messages.forEach(message => {
                     // this.addedMessage(msg);
                     const msg: MessageModel = message;        
                     msg.uid = message.message_id;
-                    if (msg.attributes && msg.attributes.commands) {
-                        // this.logger.debug('[MQTTConversationHandlerSERVICE] splitted message::::', msg)
+
+                    //escape command message is already is in list checking by parendUid 
+                    if(this.messages.filter(message => message.attributes['parentUid'] === msg.uid).length > 0){
+                        return;
+                    }
+
+                    if (msg.attributes && msg.attributes.commands ) {
+                        this.logger.debug('[MQTTConversationHandlerSERVICE] splitted message::::', this.messages)
                         this.addCommandMessage(msg)
                     } else {
                         // this.logger.debug('[MQTTConversationHandlerSERVICE] NOT splitted message::::', msg)
@@ -117,11 +124,16 @@ export class MQTTConversationHandler extends ConversationHandlerService {
         });
         const handler_message_added = this.chat21Service.chatClient.onMessageAddedInConversation(
             this.conversationWith, (message, topic) => {
-                this.logger.log('[MQTTConversationHandlerSERVICE] message added:', message, 'on topic:', topic);
+                this.logger.log('[MQTTConversationHandlerSERVICE] message added:', message, 'on topic:', topic, this.messages);
                 // this.addedMessage(msg);
                 const msg: MessageModel = message;        
                 msg.uid = message.message_id;
 
+                //escape command message is already is in list checking by parendUid 
+                if(this.messages.filter(message => message.attributes['parentUid'] === msg.uid).length > 0){
+                    return;
+                }
+                
                 if (msg.attributes && msg.attributes.commands) {
                     this.logger.debug('[MQTTConversationHandlerSERVICE] splitted message::::', msg)
                     this.addCommandMessage(msg)
@@ -133,7 +145,7 @@ export class MQTTConversationHandler extends ConversationHandlerService {
         const handler_message_updated = this.chat21Service.chatClient.onMessageUpdatedInConversation(
             this.conversationWith,  (message, topic) => {
             this.logger.log('[MQTTConversationHandlerSERVICE] message updated:', message, 'on topic:', topic);
-            this.updatedMessageStatus(message);
+            this.changed(message);
         });
     }
 
@@ -225,7 +237,6 @@ export class MQTTConversationHandler extends ConversationHandlerService {
     /** */
     private addedMessage(messageSnapshot: MessageModel) {
         const msg = this.messageGenerate(messageSnapshot);
-        
         let isInfoMessage = messageType(MESSAGE_TYPE_INFO, msg)
         if(isInfoMessage){
             this.messageInfo.next(msg)
@@ -253,7 +264,7 @@ export class MQTTConversationHandler extends ConversationHandlerService {
 
 
     /** */
-    private updatedMessageStatus(patch: any) {
+    private changed(patch: any) {
         if(messageType(MESSAGE_TYPE_INFO, patch) ){
             return;
         }
@@ -400,18 +411,13 @@ export class MQTTConversationHandler extends ConversationHandlerService {
         this.logger.log('[MQTTConversationHandlerSERVICE] updateMessageStatusReceived', msg);
         if (msg['status'] < MSG_STATUS_RECEIVED) {
             this.logger.log('[MQTTConversationHandlerSERVICE] status ', msg['status'], ' < (RECEIVED:200)', MSG_STATUS_RECEIVED);
+            let uid = msg.uid
+            msg.attributes.commands? uid = msg.attributes.parentUid: null 
             if (msg.sender !== this.loggedUser.uid && msg.status < MSG_STATUS_RECEIVED) {
                 this.logger.log('[MQTTConversationHandlerSERVICE] updating message with status received');
-                this.chat21Service.chatClient.updateMessageStatus(msg.message_id, this.conversationWith, MSG_STATUS_RECEIVED, null);
+                this.chat21Service.chatClient.updateMessageStatus(uid, this.conversationWith, MSG_STATUS_RECEIVED, null);
             }
         }
-        // if (msg.status < MSG_STATUS_RECEIVED) {
-        //     if (msg.sender !== this.loggedUser.uid && msg.status < MSG_STATUS_RECEIVED) {
-        //     const urlNodeMessagesUpdate  = this.urlNodeFirebase + '/' + msg.uid;
-        //     this.logger.log('AGGIORNO STATO MESSAGGIO', urlNodeMessagesUpdate);
-        //     firebase.database().ref(urlNodeMessagesUpdate).update({ status: MSG_STATUS_RECEIVED });
-        //     }
-        // }
     }
 
     /**

package/src/chat21-core/providers/mqtt/mqtt-conversations-handler.ts

@@ -192,7 +192,7 @@ export class MQTTConversationsHandler extends ConversationsHandlerService {
 
     getLastConversation(callback: (conv: ConversationModel, error: string) => void): void {
         this.chat21Service.chatClient.lastConversations( false, (err, conversations) => {
-            console.log('Last conversations', conversations, 'err', err);
+            this.logger.debug('[MQTTConversationsHandler] getLastConversation ', conversations, 'err', err);
             if (!err) {
                 if(conversations && conversations.length > 0){
                     callback(conversations[0], null)
@@ -224,7 +224,6 @@ export class MQTTConversationsHandler extends ConversationsHandlerService {
             this.setClosingConversation(conversation.conversation_with, false);
             this.logger.debug('[MQTTConversationsHandler] conversations:', conversation.uid, this.conversations);
             const index = this.searchIndexInArrayForConversationWith(this.conversations, conversation.conversation_with);
-            console.log("NUOVA CONVER;.uid2" + conversation.uid)
             if (index > -1) {
                 this.logger.debug('[MQTTConversationsHandler] TROVATO')
                 this.conversations.splice(index, 1, conversation);

package/src/launch.js

@@ -161,14 +161,73 @@ function loadIframe(tiledeskScriptBaseLocation) {
     }); 
     /**** END EVENST ****/
 
-    // ifrm.srcdoc = srcTileDesk
     iDiv.appendChild(ifrm);
+
+    // buildIframeDOM(ifrm)
+    // ifrm.contentWindow.document.open();
+    // ifrm.document.srcdoc = srcTileDesk;
+    // ifrm.srcdoc = srcTileDesk
     ifrm.contentWindow.document.open();
     ifrm.contentWindow.document.write(srcTileDesk);
     ifrm.contentWindow.document.close();
 
 }
 
+function buildIframeDOM(iframe){
+
+  var meta = document.createElement('meta');
+  meta.setAttribute('charset', 'utf-8')
+  var meta_2 = document.createElement('meta')
+  meta_2.setAttribute('name', 'viewport')
+  meta_2.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0')
+  var title = document.createElement('title')
+  title.title = 'Tilechat Widget'
+  var base = document.createElement('base')
+  base.setAttribute('href', './')
+  var link_1 = document.createElement('link')
+  link_1.setAttribute('rel', 'icon')
+  link_1.setAttribute('type', 'image/x-icon')
+  link_1.setAttribute('href', 'favicon.ico')
+  var link_2 = document.createElement('link')
+  link_2.setAttribute('rel', 'stylesheet')
+  link_2.setAttribute('type', 'text/css')
+  link_2.setAttribute('href', tiledeskScriptBaseLocation + '/assets/styles/tiledesk_v1.scss')
+  link_2.setAttribute('media','all')
+
+  
+  let head = iframe.contentWindow.document.getElementsByTagName('head')[0]
+  head.appendChild(meta)
+  head.appendChild(meta_2)
+  head.appendChild(title)
+  head.appendChild(base)
+  head.appendChild(link_1)
+  head.appendChild(link_2)
+
+  var script_1 = document.createElement('script')
+  script_1.setAttribute('type','text/javascript')
+  script_1.setAttribute('src',tiledeskScriptBaseLocation + '/runtime.js')
+  var script_2 = document.createElement('script')
+  script_2.setAttribute('type','text/javascript')
+  script_2.setAttribute('src',tiledeskScriptBaseLocation + '/polyfills.js')
+  var script_3 = document.createElement('script')
+  script_3.setAttribute('type','text/javascript')
+  script_3.setAttribute('src',tiledeskScriptBaseLocation + '/styles.css')
+  var script_4 = document.createElement('script')
+  script_4.setAttribute('type','text/javascript')
+  script_4.setAttribute('src',tiledeskScriptBaseLocation + '/vendor.js')
+  var script_5 = document.createElement('script')
+  script_5.setAttribute('type','text/javascript')
+  script_5.setAttribute('src',tiledeskScriptBaseLocation + '/main.js')
+
+  let body= iframe.contentWindow.document.getElementsByTagName('body')[0]
+  body.appendChild(document.createElement('chat-root'))
+  body.appendChild(script_1)
+  body.appendChild(script_2)
+  body.appendChild(script_3)
+  body.appendChild(script_4)
+  body.appendChild(script_5)
+}
+
 
 function initAysncEvents() {
   console.log('INIT ASYNC EVENTS')

package/src/test.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Widget Test Page</title>
-    <script type="application/javascript"> 
+    <script type="application/javascript" async> 
       // Handler for .ready() called.
       window.tiledeskSettings = 
       {