@chat21/chat21-ionic 3.0.5-9.1 → 3.0.6-2.2

package/src/app/app.component.ts

@@ -1,4 +1,4 @@
-import { URL_SOUND_LIST_CONVERSATION } from './../chat21-core/utils/constants';
+import { tranlatedLanguage, URL_SOUND_LIST_CONVERSATION } from './../chat21-core/utils/constants';
 import { ArchivedConversationsHandlerService } from 'src/chat21-core/providers/abstract/archivedconversations-handler.service';
 import { AppStorageService } from 'src/chat21-core/providers/abstract/app-storage.service';
 
@@ -58,6 +58,7 @@ import * as PACKAGE from 'package.json';
 import { filter } from 'rxjs/operators'
 import { WebSocketJs } from './services/websocket/websocket-js';
 import { Location } from '@angular/common'
+
 // import { filter } from 'rxjs/operators';
 
 @Component({
@@ -77,7 +78,7 @@ export class AppComponent implements OnInit {
   public sidebarPage: any;
   public notificationsEnabled: boolean;
   public zone: NgZone;
-  private platformIs: string;
+  public platformIs: string;
   private doitResize: any;
   private timeModalLogin: any;
   public tenant: string;
@@ -98,7 +99,9 @@ export class AppComponent implements OnInit {
   public missingConnectionToast: any
   public executedInitializeAppByWatchConnection: boolean = false;
   private version: string;
-  public browserRefresh: boolean = false;
+  IS_ONLINE: boolean;
+  IS_ON_MOBILE_DEVICE: boolean;
+  SUPPORT_MODE: boolean;
   // private isOnline: boolean = false;
 
   wsService: WebSocketJs;
@@ -145,32 +148,21 @@ export class AppComponent implements OnInit {
 
     this.saveInStorageNumberOfOpenedChatTab();
     this.listenChatAlreadyOpenWithoutParamsInMobileMode()
-
+    this.isOnMobileDevice()
     // this.listenToUrlChanges();
     // this.getPageState();
+  }
 
-    // location.subscribe((val) => {
-
-    //   console.log('location subscribe val', val)
-    //   if (val.type == "hashchange") {
-    //     const convId = getParameterByName('convId')
-    //     console.log('[APP-COMP] ngOnInit convId get with getParameterByName  ', convId)
-    //     const requesterFullaname = getParameterByName('requester_fullaname')
-    //     console.log('[APP-COMP] ngOnInit convId get with getParameterByName  ', requesterFullaname);
-
-    //     this.navigateToDetail(convId, requesterFullaname)
+  isOnMobileDevice() {
+    this.IS_ON_MOBILE_DEVICE = false;
+    if (/Android|iPhone/i.test(window.navigator.userAgent)) {
+      this.IS_ON_MOBILE_DEVICE = true;
+    }
+    this.logger.log('[APP-COMP] IS_ON_MOBILE_DEVICE', this.IS_ON_MOBILE_DEVICE)
+    return this.IS_ON_MOBILE_DEVICE;
+  }
 
-    //     this.events.publish('convid:haschanged', convId);
-    //   }
-    // });
 
-    router.events.subscribe((event) => {
-      if (event instanceof NavigationStart) {
-        this.browserRefresh = !router.navigated;
-        // console.log('browserRefresh ', this.browserRefresh)
-      }
-    });
-  }
 
   listenChatAlreadyOpenWithoutParamsInMobileMode() {
     this.events.subscribe('noparams:mobile', (isAlreadyOpenInMobileMode) => {
@@ -276,7 +268,7 @@ export class AppComponent implements OnInit {
 
 
   saveInStorageNumberOfOpenedChatTab() {
-    this.logger.log('Calling saveInStorageChatOpenedTab!');
+    // this.logger.log('Calling saveInStorageChatOpenedTab!');
 
     // https://jsfiddle.net/jjjs5wd3/3/å
     if (+localStorage.tabCount > 0) {
@@ -306,6 +298,14 @@ export class AppComponent implements OnInit {
    */
   ngOnInit() {
     const appconfig = this.appConfigProvider.getConfig();
+    this.logger.log('[APP-COMP] ngOnInit  appconfig', appconfig)
+    if (appconfig && appconfig.supportMode &&  (appconfig.supportMode === true || appconfig.supportMode === 'true' )) {
+      this.SUPPORT_MODE = true;
+      this.logger.log('[APP-COMP] appconfig > SUPPORT_MODE', this.SUPPORT_MODE)
+    } else {
+      this.SUPPORT_MODE = false;
+      this.logger.log('[APP-COMP] appconfig > SUPPORT_MODE', this.SUPPORT_MODE)
+    }
     this.persistence = appconfig.authPersistence;
     this.appStorageService.initialize(environment.storage_prefix, this.persistence, '')
     // this.logger.log('[APP-COMP] HELLO ngOnInit !!!!!!!')
@@ -436,9 +436,9 @@ export class AppComponent implements OnInit {
     // this.logger.log('[APP-COMP] - X - initializeApp !!! CALLED-BY: ', calledby);
     // console.log('[APP-COMP] appconfig platform is cordova: ', this.platform.is('cordova'))
 
-    // if (!this.platform.is('cordova')) {
-    this.splashScreen.show();
-    // }
+    if (!this.platform.is('desktop')) {
+      this.splashScreen.show();
+    }
     this.tabTitle = document.title;
 
     this.getRouteParamsAndSetLoggerConfig();
@@ -463,11 +463,11 @@ export class AppComponent implements OnInit {
       // console.log("Check platform");
       this.getPlatformName();
 
-      this.setLanguage();
+      // this.setLanguage();
 
-      // if (this.splashScreen) {
-      this.splashScreen.hide();
-      // }
+      if (this.splashScreen) {
+        this.splashScreen.hide();
+      }
       this.statusBar.styleDefault();
       this.navService.init(this.sidebarNav, this.detailNav);
       // this.persistence = appconfig.authPersistence;
@@ -541,19 +541,53 @@ export class AppComponent implements OnInit {
   }
 
   /** */
-  setLanguage() {
-    this.translate.setDefaultLang('en');
-    this.translate.use('en');
-    this.logger.debug('[APP-COMP] navigator.language: ', navigator.language);
-    let language;
-    if (navigator.language.indexOf('-') !== -1) {
-      language = navigator.language.substring(0, navigator.language.indexOf('-'));
-    } else if (navigator.language.indexOf('_') !== -1) {
-      language = navigator.language.substring(0, navigator.language.indexOf('_'));
-    } else {
-      language = navigator.language;
+  setLanguage(currentUser) {
+    // const currentUser = JSON.parse(this.appStorageService.getItem('currentUser'));
+    this.logger.log('[APP-COMP] - setLanguage current_user uid: ', currentUser);
+
+    let currentUserId = ''
+    if (currentUser) {
+      currentUserId = currentUser.uid;
+      this.logger.log('[APP-COMP] - setLanguage current_user uid: ', currentUserId);
     }
-    this.translate.use(language);
+    // this.translate.setDefaultLang('en');
+    //   this.translate.use('en');
+
+    const browserLang = this.translate.getBrowserLang();
+    this.logger.log('[APP-COMP] browserLang: ', browserLang);
+    const stored_preferred_lang = localStorage.getItem(currentUserId + '_lang');
+    this.logger.log('[APP-COMP] stored_preferred_lang: ', stored_preferred_lang);
+
+    let chat_lang = ''
+    if (browserLang && !stored_preferred_lang) {
+      chat_lang = browserLang
+    } else if (browserLang && stored_preferred_lang) {
+      chat_lang = stored_preferred_lang
+    }
+  
+    this.logger.log('[APP-COMP] - chat_lang', chat_lang)
+  
+    if (tranlatedLanguage.includes(chat_lang)) {
+      this.logger.log('[APP-COMP] tranlatedLanguage includes',chat_lang , ': ', tranlatedLanguage.includes(chat_lang)) 
+      this.translate.setDefaultLang(chat_lang)
+      this.translate.use(chat_lang);
+    }
+    else {
+      this.logger.log('[APP-COMP] tranlatedLanguage includes',chat_lang , ': ', tranlatedLanguage.includes(chat_lang)) 
+      this.translate.setDefaultLang('en');
+      this.translate.use('en');
+    }
+
+    // this.logger.debug('[APP-COMP] navigator.language: ', navigator.language);
+    // let language;
+    // if (navigator.language.indexOf('-') !== -1) {
+    //   language = navigator.language.substring(0, navigator.language.indexOf('-'));
+    // } else if (navigator.language.indexOf('_') !== -1) {
+    //   language = navigator.language.substring(0, navigator.language.indexOf('_'));
+    // } else {
+    //   language = navigator.language;
+    // }
+    // this.translate.use(language);
   }
 
 
@@ -644,7 +678,7 @@ export class AppComponent implements OnInit {
       })
     } else {
       this.logger.warn('[APP-COMP] >>> I AM NOT LOGGED IN <<<')
-
+      this.IS_ONLINE = false;
       // clearTimeout(this.timeModalLogin);
       // this.timeModalLogin = setTimeout(() => {
       if (!this.hadBeenCalledOpenModal) {
@@ -690,6 +724,7 @@ export class AppComponent implements OnInit {
 
       this.logger.log('[APP-COMP] checkPlatformIsMobile', checkPlatformIsMobile());
       this.platformIs = PLATFORM_MOBILE;
+      this.logger.log('[APP-COMP] this.platformIs', this.platformIs);
       const IDConv = this.route.snapshot.firstChild.paramMap.get('IDConv');
 
       // console.log('[APP-COMP]  platformIs', this.platformIs);
@@ -703,7 +738,7 @@ export class AppComponent implements OnInit {
       this.chatManager.startApp();
       this.logger.log('[APP-COMP] checkPlatformIsMobile', checkPlatformIsMobile());
       this.platformIs = PLATFORM_DESKTOP;
-      // console.log('[APP-COMP]  platformIs', this.platformIs);
+      this.logger.log('[APP-COMP]  platformIs', this.platformIs);
       // console.log('[APP-COMP] PLATFORM', PLATFORM_DESKTOP, 'route.snapshot',  this.route.snapshot);
       this.logger.log('[APP-COMP] PLATFORM_DESKTOP ', this.navService);
 
@@ -719,8 +754,8 @@ export class AppComponent implements OnInit {
       if (IDConv && FullNameConv) {
         pageUrl += IDConv + '/' + FullNameConv + '/' + Convtype
       }
-
-      this.router.navigateByUrl(pageUrl);
+      // replace(/\(/g, '%28').replace(/\)/g, '%29') -> used for the encoder of any round brackets
+      this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29'));
 
 
       // const DASHBOARD_URL = this.appConfigProvider.getConfig().DASHBOARD_URL;
@@ -822,15 +857,19 @@ export class AppComponent implements OnInit {
       .pipe(filter((state) => state !== null))
       .subscribe((state: any) => {
         this.logger.log('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged  state', state);
-     
+
         if (state && state === AUTH_STATE_ONLINE) {
           // const user = this.tiledeskAuthService.getCurrentUser();
           // if (this.isOnline === false) {
           // if (AUTH_STATE_ONLINE) {
+          this.IS_ONLINE = true;
+          // console.log('[APP-COMP] IS_ONLINE', this.IS_ONLINE)
           this.goOnLine();
           // }
         } else if (state === AUTH_STATE_OFFLINE) {
           // this.checkTokenAndGoOffline() //se c'è un tiledeskToken salvato, allora aspetta, altrimenti vai offline
+          this.IS_ONLINE = false;
+          // console.log('[APP-COMP] IS_ONLINE', this.IS_ONLINE)
           this.goOffLine()
         }
       }, error => {
@@ -868,12 +907,12 @@ export class AppComponent implements OnInit {
   }
 
   /**
- * goOnLine:
- * 1 - nascondo splashscreen
- * 2 - recupero il tiledeskToken e lo salvo in chat manager
- * 3 - carico in d
- * @param user
- */
+  * goOnLine:
+  * 1 - nascondo splashscreen
+  * 2 - recupero il tiledeskToken e lo salvo in chat manager
+  * 3 - carico in d
+  * @param user
+  */
   goOnLine = () => {
     this.logger.log('[APP-COMP]- GO-ONLINE ');
     // this.isOnline = true;
@@ -881,15 +920,14 @@ export class AppComponent implements OnInit {
     // clearTimeout(this.timeModalLogin);
     const tiledeskToken = this.tiledeskAuthService.getTiledeskToken();
 
-    const supportmode = this.appConfigProvider.getConfig().supportMode;
-    this.logger.log('[APP-COMP] - GO-ONLINE - supportmode ', supportmode);
-    if (supportmode === true) {
-
-      this.connetWebsocket(tiledeskToken)
-
-    }
+    // const supportmode = this.appConfigProvider.getConfig().supportMode;
+    // this.logger.log('[APP-COMP] - GO-ONLINE - supportmode ', supportmode);
+    // if (supportmode === true) {
+    //   this.connetWebsocket() // moved in the comp project-item
+    // }
     this.events.publish('go:online', true);
     const currentUser = this.tiledeskAuthService.getCurrentUser();
+    this.setLanguage(currentUser);
     // this.logger.printDebug('APP-COMP - goOnLine****', currentUser);
     this.logger.log('[APP-COMP] - GO-ONLINE - currentUser ', currentUser);
     this.chatManager.setTiledeskToken(tiledeskToken);
@@ -921,17 +959,7 @@ export class AppComponent implements OnInit {
     }
   }
 
-  connetWebsocket(tiledeskToken) {
-    const appconfig = this.appConfigProvider.getConfig();
-    this.logger.log('connetWebsocket appconfig wsUrl ', appconfig.wsUrl)
-    const WS_URL = appconfig.wsUrl + '?token=' + tiledeskToken
-    this.webSocketJs.init(
-      WS_URL,
-      undefined,
-      undefined,
-      undefined
-    );
-  }
+
 
 
   goOffLine = () => {
@@ -939,7 +967,7 @@ export class AppComponent implements OnInit {
     const supportmode = this.appConfigProvider.getConfig().supportMode;
     this.logger.log('[APP-COMP] - GO-OFFINE - supportmode ', supportmode);
     if (supportmode === true) {
-        this.webSocketClose()
+      this.webSocketClose()
     }
     // this.isOnline = false;
     // this.conversationsHandlerService.conversations = [];
@@ -979,6 +1007,7 @@ export class AppComponent implements OnInit {
     let platformIsNow = PLATFORM_DESKTOP;
     if (checkPlatformIsMobile()) {
       platformIsNow = PLATFORM_MOBILE;
+      this.logger.log('onResize platformIsNow ', platformIsNow) 
     }
     if (!this.platformIs || this.platformIs === '') {
       this.platformIs = platformIsNow;
@@ -1120,7 +1149,7 @@ export class AppComponent implements OnInit {
   }
 
   private initConversationsHandler(userId: string) {
-    const keys = ['YOU'];
+    const keys = ['YOU', 'INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU'];
     const translationMap = this.translateService.translateLanguage(keys);
 
     this.logger.log('[APP-COMP] initConversationsHandler ------------->', userId, this.tenant);

package/src/app/app.module.ts

@@ -82,7 +82,9 @@ import { ConversationListPageModule } from './pages/conversations-list/conversat
 import { ConversationDetailPageModule } from './pages/conversation-detail/conversation-detail.module';
 import { LoginPageModule } from './pages/authentication/login/login.module';
 import { LoaderPreviewPageModule } from './pages/loader-preview/loader-preview.module';
-
+import { CreateTicketPageModule } from './pages/create-ticket/create-ticket.module';
+import { CreateRequesterPageModule } from './pages/create-requester/create-requester.module';
+import { CreateCannedResponsePageModule } from './pages/create-canned-response/create-canned-response.module';
 // UTILS
 import { ScrollbarThemeModule } from './utils/scrollbar-theme.directive';
 import { SharedModule } from 'src/app/shared/shared.module';
@@ -90,12 +92,15 @@ import { ConversationInfoModule } from 'src/app/components/conversation-info/con
 
 
 // Directives
-import { TooltipModule } from 'ng2-tooltip-directive';
+// import { HtmlEntitiesEncodePipe } from './directives/html-entities-encode.pipe';
+// import { MarkedPipe } from './directives/marked.pipe';
+
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
 import { Network } from '@ionic-native/network/ngx';
 import { ConnectionService } from 'ng-connection-service';
 import { WebSocketJs } from './services/websocket/websocket-js';
 import { UnassignedConversationsPageModule } from './pages/unassigned-conversations/unassigned-conversations.module';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 // FACTORIES
 export function createTranslateLoader(http: HttpClient) {
@@ -114,7 +119,7 @@ export function authenticationFactory(http: HttpClient, appConfig: AppConfigProv
 
     auth.setBaseUrl(appConfig.getConfig().apiUrl);
 
-    if (config.pushEngine = PUSH_ENGINE_MQTT) {
+    if (config.pushEngine === PUSH_ENGINE_MQTT) {
       // FOR PUSH NOTIFICATIONS INIT FIREBASE APP
       FirebaseInitService.initFirebase(config.firebaseConfig);
     }
@@ -245,12 +250,13 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
 
 @NgModule({
   declarations: [
-    AppComponent,
+    AppComponent
   ],
   entryComponents: [
   ],
   imports: [
     BrowserModule,
+    BrowserAnimationsModule,
     FormsModule,
     ReactiveFormsModule,
     IonicModule.forRoot(),
@@ -279,7 +285,10 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
     SharedModule,
     ConversationInfoModule,
     NgxLinkifyjsModule.forRoot(),
-    LoaderPreviewPageModule
+    LoaderPreviewPageModule,
+    CreateTicketPageModule,
+    CreateRequesterPageModule,
+    CreateCannedResponsePageModule
   ],
   bootstrap: [AppComponent],
 

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

@@ -54,12 +54,23 @@
 <!-- ----------------------------------------------------------- -->
 
 <div class="conversation-wpr" style="height: 100%;">
-  <div *ngFor="let message of messages; let i = index">
+  <div *ngFor="let message of messages; let i = index; let first = first; trackBy: trackByFn">
+
+    <ng-container *ngIf="first || (messages[i - 1].timestamp | date:'d') !== (message.timestamp | date:'d')">
+      <div class="long-date-divider-wpr">
+        <div class="long-date-divider-border-b"></div>
+        <div class="long-date-divider">
+          <!-- {{message.timestamp | date: 'longDate' : 'it'}} -->
+          {{message.timestamp | amDateFormat:'LL'}}
+
+        </div>
+        <div class="long-date-divider-border-b"></div>
+      </div>
+    </ng-container>
 
     <div class="align-center" class="ion-text-center" *ngIf="messageType(MESSAGE_TYPE_INFO, message)"
       class="msg_info_container">
-      <chat-info-message class="messages" 
-        [message]="message">
+      <chat-info-message class="messages" [message]="message">
       </chat-info-message>
     </div>
 
@@ -67,13 +78,15 @@
     <div role="messaggio" *ngIf="messageType(MESSAGE_TYPE_MINE, message)" class="msg_container base_sent">
 
       <!--backgroundColor non viene ancora usato -->
-      <chat-bubble-message  [ngClass]="{'has-metadata': (isImage(message) || isFrame(message))}"
-        class="messages msg_sent" id="message_msg_sent"
-        [ngClass]="{'button-in-msg' : message.metadata && message.metadata.button}" [message]="message"
-        [textColor]="'col-msg-sent'" 
-        (onBeforeMessageRender)="returnOnBeforeMessageRender($event)"
-        (onAfterMessageRender)="returnOnAfterMessageRender($event)" 
-        (onImageRendered)="onImageRenderedFN($event)">
+      
+      <chat-bubble-message style="position: relative;"
+        [ngClass]="{'has-metadata': (isImage(message) || isFrame(message))}" class="messages msg_sent"
+        id="message_msg_sent" [ngClass]="{'button-in-msg' : message.metadata && message.metadata.button}"
+        [message]="message" [textColor]="'col-msg-sent'" (onBeforeMessageRender)="returnOnBeforeMessageRender($event)"
+        (onAfterMessageRender)="returnOnAfterMessageRender($event)" (onImageRendered)="onImageRenderedFN($event)"
+        [addAsCannedResponseTooltipText]="addAsCannedResponseTooltipText" [areVisibleCAR]="areVisibleCAR"
+        [support_mode]="support_mode"
+        [class.emoticon]="message?.emoticon">
       </chat-bubble-message>
 
       <!-- icon status message -->
@@ -98,32 +111,30 @@
       </chat-avatar-image> -->
 
       <!--backgroundColor non viene ancora usato -->
-      
-      <chat-bubble-message [ngClass]="{'has-metadata': (isImage(message) || isFrame(message))}" class="messages msg_receive" id="message_msg_receive"
-        [message]="message" 
-        [textColor]="'black'"
+
+      <chat-bubble-message style="position: relative;"
+        [ngClass]="{'has-metadata': (isImage(message) || isFrame(message))}" class="messages msg_receive"
+        id="message_msg_receive" [message]="message" [textColor]="'black'"
         (onBeforeMessageRender)="returnOnBeforeMessageRender($event)"
-        (onAfterMessageRender)="returnOnAfterMessageRender($event)" 
-        (onImageRendered)="onImageRenderedFN($event)">
+        (onAfterMessageRender)="returnOnAfterMessageRender($event)" (onImageRendered)="onImageRenderedFN($event)"
+        [addAsCannedResponseTooltipText]="addAsCannedResponseTooltipText" [areVisibleCAR]="areVisibleCAR"
+        [support_mode]="support_mode"
+        [class.emoticon]="message?.emoticon">
       </chat-bubble-message>
     </div>
 
     <!-- message type:: button &&  -->
-    <div *ngIf="message?.attributes && message?.attributes?.attachment " class="slide-in-left" > 
-      <chat-message-attachment 
-          style="height: 100%; display: block;"
-          [message]="message"
-          [isLastMessage] = "isLastMessage(message?.uid)"
-          [stylesMap]="stylesMap"
-          (onAttachmentButtonClicked)="returnOnAttachmentButtonClicked($event)">
+    <div *ngIf="message?.attributes && message?.attributes?.attachment " class="slide-in-left">
+      <chat-message-attachment style="height: 100%; display: block;" [message]="message"
+        [isLastMessage]="isLastMessage(message?.uid)" [stylesMap]="stylesMap"
+        (onAttachmentButtonClicked)="returnOnAttachmentButtonClicked($event)">
       </chat-message-attachment>
     </div>
   </div>
   <!-- (fileType === 'file' && uploadProgress !== 100)  -->
 
   <!-- uploadProgress -> {{ uploadProgress }} -->
-  <div *ngIf="uploadProgress !== 100" class="msg_container base_sent"
-    style="margin-right: 20px;">
+  <div *ngIf="uploadProgress !== 100" class="msg_container base_sent" style="margin-right: 20px;">
     <div class="messages msg_sent">
       <div class="spinner">
         <div class="bounce1"></div>