@chat21/chat21-ionic 2.0.13 → 3.0.5-9.2

package/src/chat21-core/providers/native/native-upload-service.ts

@@ -0,0 +1,85 @@
+import { UploadService } from '../abstract/upload.service';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+import { UploadModel } from '../../models/upload';
+import { AppStorageService } from '../abstract/app-storage.service';
+import { LoggerService } from '../abstract/logger.service';
+import { LoggerInstance } from '../logger/loggerInstance';
+
+// @Injectable({ providedIn: 'root' })
+@Injectable()
+export class NativeUploadService extends UploadService {
+
+
+
+    BSStateUpload: BehaviorSubject<any>;
+
+    // private persistence: string;
+    SERVER_BASE_URL: string;
+
+    public token: any;
+    public tiledeskToken: any;
+
+    private URL_TILEDESK_IMAGES: string;
+    private URL_TILEDESK_FILE: string;
+    private logger: LoggerService = LoggerInstance.getInstance()
+
+    constructor(
+        public http: HttpClient,
+        public appStorage: AppStorageService
+    ) {
+        super();
+    }
+
+
+    initialize(): void {
+        this.logger.info(' [NATIVE UPLOAD] initialize')
+        this.URL_TILEDESK_FILE = this.getBaseUrl() + 'files'
+        this.URL_TILEDESK_IMAGES = this.getBaseUrl() + 'images'
+        this.tiledeskToken = this.appStorage.getItem('tiledeskToken')
+    }
+
+
+    upload(userId: string, upload: UploadModel): Promise<any>  {
+        this.logger.log('[NATIVE UPLOAD] - upload new image/file ... upload', upload)
+        const headers = new HttpHeaders({
+            Authorization: this.tiledeskToken,
+            //'Content-Type': 'multipart/form-data',
+        });
+        const requestOptions = { headers: headers };
+        const formData = new FormData();
+        formData.append('file', upload.file);
+
+        const that = this;
+        if ((upload.file.type.startsWith('image') && (!upload.file.type.includes('svg')))) {
+            this.logger.log('[NATIVE UPLOAD] - upload new image')
+            //USE IMAGE API
+            const url = this.URL_TILEDESK_IMAGES + '/users'
+            return new Promise((resolve, reject) => {
+                that.http.post(url, formData, requestOptions).subscribe(data => {
+                    const downloadURL = this.URL_TILEDESK_IMAGES + '?path=' + data['filename'];
+                    resolve(downloadURL)
+                    // that.BSStateUpload.next({upload: upload});
+                }, (error) => {
+                    reject(error)
+                });
+            });
+        } else {
+            this.logger.log('[NATIVE UPLOAD] - upload new file')
+            //USE FILE API
+            const url = this.URL_TILEDESK_FILE + '/users'
+            return new Promise((resolve, reject) => {
+                that.http.post(url, formData, requestOptions).subscribe(data => {
+                    const downloadURL = this.URL_TILEDESK_FILE + '?path=' + encodeURI(data['filename']);
+                    resolve(downloadURL)
+                    // that.BSStateUpload.next({upload: upload});
+                }, (error) => {
+                    this.logger.error('[NATIVE UPLOAD] - ERROR upload new file ', error)
+                    reject(error)
+                });
+            });
+        }
+        
+    }
+}

package/src/chat21-core/providers/tiledesk/tiledesk-auth.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { TiledeskAuthService } from './tiledesk-auth.service';
+
+describe('TiledeskAuthService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: TiledeskAuthService = TestBed.get(TiledeskAuthService);
+    expect(service).toBeTruthy();
+  });
+});

package/src/chat21-core/providers/tiledesk/tiledesk-auth.service.ts

@@ -0,0 +1,211 @@
+import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { UserModel } from 'src/chat21-core/models/user';
+import { avatarPlaceholder, getColorBck } from 'src/chat21-core/utils/utils-user';
+import { AppStorageService } from '../abstract/app-storage.service';
+import { LoggerInstance } from '../logger/loggerInstance';
+// import { BehaviorSubject } from 'rxjs';
+// import { EventsService } from 'src/app/services/events-service';
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TiledeskAuthService {
+
+  // public isOnline$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(null);
+  // private persistence: string;
+  public SERVER_BASE_URL: string;
+
+  // private
+  private URL_TILEDESK_SIGNIN: string;
+  private URL_TILEDESK_SIGNIN_ANONYMOUSLY: string;
+  private URL_TILEDESK_SIGNIN_WITH_CUSTOM_TOKEN: string;
+
+  private tiledeskToken: string;
+  private currentUser: UserModel;
+  private logger: LoggerService = LoggerInstance.getInstance()
+
+  constructor(
+    public http: HttpClient,
+    public appStorage: AppStorageService,
+    // private events: EventsService,
+  ) { }
+
+
+  initialize(serverBaseUrl: string) {
+    this.logger.log('[TILEDESK-AUTH-SERV] - initialize serverBaseUrl', serverBaseUrl);
+    this.SERVER_BASE_URL = serverBaseUrl;
+    this.URL_TILEDESK_SIGNIN = this.SERVER_BASE_URL + 'auth/signin';
+    this.URL_TILEDESK_SIGNIN_ANONYMOUSLY = this.SERVER_BASE_URL + 'auth/signinAnonymously'
+    this.URL_TILEDESK_SIGNIN_WITH_CUSTOM_TOKEN = this.SERVER_BASE_URL + 'auth/signinWithCustomToken';
+  }
+
+
+  /**
+   * @param email
+   * @param password
+   */
+  signInWithEmailAndPassword(email: string, password: string): Promise<string> {
+    this.logger.log('[TILEDESK-AUTH-SERV] - signInWithEmailAndPassword', email, password);
+    const httpHeaders = new HttpHeaders();
+
+    httpHeaders.append('Accept', 'application/json');
+    httpHeaders.append('Content-Type', 'application/json');
+    const requestOptions = { headers: httpHeaders };
+    const postData = {
+      email: email,
+      password: password
+    };
+    const that = this;
+    return new Promise((resolve, reject) => {
+      this.http.post(this.URL_TILEDESK_SIGNIN, postData, requestOptions).subscribe((data) => {
+        if (data['success'] && data['token']) {
+          that.tiledeskToken = data['token'];
+          that.createCompleteUser(data['user']);
+          // that.appStorage.setItem('tiledeskToken', that.tiledeskToken);
+          this.checkAndSetInStorageTiledeskToken(that.tiledeskToken)
+          resolve(that.tiledeskToken)
+        }
+      }, (error) => {
+        reject(error)
+      });
+    });
+  }
+
+
+  /**
+   * @param projectID
+   */
+  signInAnonymously(projectID: string): Promise<any> {
+    this.logger.debug('[TILEDESK-AUTH] - signInAnonymously - projectID', projectID);
+    const httpHeaders = new HttpHeaders();
+
+    httpHeaders.append('Accept', 'application/json');
+    httpHeaders.append('Content-Type', 'application/json');
+    const requestOptions = { headers: httpHeaders };
+    const postData = {
+      id_project: projectID
+    };
+    const that = this;
+    return new Promise((resolve, reject) => {
+      this.http.post(this.URL_TILEDESK_SIGNIN_ANONYMOUSLY, postData, requestOptions).subscribe((data) => {
+        if (data['success'] && data['token']) {
+          that.tiledeskToken = data['token'];
+          that.createCompleteUser(data['user']);
+          // that.appStorage.setItem('tiledeskToken', that.tiledeskToken);
+          this.checkAndSetInStorageTiledeskToken(that.tiledeskToken)
+          resolve(that.tiledeskToken)
+        }
+      }, (error) => {
+        reject(error)
+      });
+    })
+
+  }
+
+  /**
+   * @param tiledeskToken
+   */
+  signInWithCustomToken(tiledeskToken: string): Promise<any> {
+    const headers = new HttpHeaders({
+      'Content-type': 'application/json',
+      Authorization: tiledeskToken
+    });
+    const requestOptions = { headers: headers };
+    const that = this;
+    return new Promise((resolve, reject) => {
+      this.http.post(this.URL_TILEDESK_SIGNIN_WITH_CUSTOM_TOKEN, null, requestOptions).subscribe((data) => {
+        if (data['success'] && data['token']) {
+          that.tiledeskToken = data['token'];
+          that.createCompleteUser(data['user']);
+
+          // that.appStorage.setItem('tiledeskToken', that.tiledeskToken); // salvarlo esternamente nell'app.component
+          this.checkAndSetInStorageTiledeskToken(that.tiledeskToken)
+          resolve(this.currentUser)
+        }
+      }, (error) => {
+        reject(error)
+      });
+    });
+  }
+
+  logOut() {
+    this.logger.log('[TILEDESK-AUTH] - LOGOUT')
+    this.appStorage.removeItem('tiledeskToken')
+    this.appStorage.removeItem('currentUser')
+
+    this.appStorage.removeItem('currentUser')
+    this.setCurrentUser(null);
+    // this.isOnline$.next(false) 
+    const stored_project = localStorage.getItem('last_project')
+    if (stored_project) {
+      localStorage.removeItem('last_project')
+    }
+    const stored_contacts = localStorage.getItem('contacts')
+    if (stored_contacts) {
+      localStorage.removeItem('contacts')
+    }
+  }
+
+
+  /**
+   * createCompleteUser
+   * @param user
+   */
+  private createCompleteUser(user: any) {
+    const member = new UserModel(user._id);
+    try {
+      const uid = user._id;
+      const firstname = user.firstname ? user.firstname : '';
+      const lastname = user.lastname ? user.lastname : '';
+      const email = user.email ? user.email : '';
+      const fullname = (firstname + ' ' + lastname).trim();
+      const avatar = avatarPlaceholder(fullname);
+      const color = getColorBck(fullname);
+
+      member.uid = uid;
+      member.email = email;
+      member.firstname = firstname;
+      member.lastname = lastname;
+      member.fullname = fullname;
+      member.avatar = avatar;
+      member.color = color;
+      this.currentUser = member;
+      this.logger.log('[TILEDESK-AUTH] - createCompleteUser member ', member);
+      this.appStorage.setItem('currentUser', JSON.stringify(this.currentUser));
+      // this.isOnline$.next(true) 
+    } catch (err) {
+      this.logger.error('[TILEDESK-AUTH]- createCompleteUser ERR ', err)
+    }
+  }
+
+
+  private checkAndSetInStorageTiledeskToken(tiledeskToken) {
+    this.logger.log('[TILEDESK-AUTH] - checkAndSetInStorageTiledeskToken tiledeskToken from request', tiledeskToken)
+    const storedTiledeskToken = this.appStorage.getItem('tiledeskToken');
+    this.logger.log('[TILEDESK-AUTH] - checkAndSetInStorageTiledeskToken storedTiledeskToken ', storedTiledeskToken)
+    if (!storedTiledeskToken) {
+      this.logger.log('[TILEDESK-AUTH] - checkAndSetInStorageTiledeskToken TOKEN DOES NOT EXIST - RUN SET ')
+      this.appStorage.setItem('tiledeskToken', tiledeskToken);
+    } else if (storedTiledeskToken && storedTiledeskToken !== tiledeskToken) {
+      this.logger.log('[TILEDESK-AUTH] - checkAndSetInStorageTiledeskToken STORED-TOKEN EXIST BUT IS != FROM TOKEN - RUN SET ')
+      this.appStorage.setItem('tiledeskToken', tiledeskToken);
+    } else if (storedTiledeskToken && storedTiledeskToken === tiledeskToken) {
+      this.logger.log('[TILEDESK-AUTH] - checkAndSetInStorageTiledeskToken STORED-TOKEN EXIST AND IS = TO TOKEN ')
+    }
+  }
+
+
+  getCurrentUser(): UserModel {
+    return this.currentUser;
+  }
+  setCurrentUser(user: UserModel) {
+    this.currentUser = user;
+  }
+  getTiledeskToken(): string {
+    return this.tiledeskToken;
+  }
+
+}

package/src/chat21-core/utils/constants.ts

@@ -0,0 +1,109 @@
+// TIMES
+
+// export const SERVICE_WORKER_DEV = '/chat/';
+// export const SERVICE_WORKER_PROD = './chat/';
+
+// CHAT ENGINE
+export const CHAT_ENGINE_MQTT = 'mqtt';
+export const CHAT_ENGINE_FIREBASE = 'firebase';
+export const UPLOAD_ENGINE_NATIVE = 'native';
+export const PUSH_ENGINE_MQTT = 'mqtt';
+export const PUSH_ENGINE_FIREBASE = 'firebase';
+
+
+// AUTH
+export const AUTH_STATE_OFFLINE = 'offline';
+export const AUTH_STATE_ONLINE = 'online'
+
+
+// MESSAGES STATUS
+export const MSG_STATUS_FAILED = -100;
+export const MSG_STATUS_SENDING = 0;
+export const MSG_STATUS_SENT = 100;
+export const MSG_STATUS_SENT_SERVER = 150;
+export const MSG_STATUS_RECEIVED = 200;
+export const MSG_STATUS_RETURN_RECEIPT = 250;
+export const MSG_STATUS_SEEN = 300;
+
+// constans messages detail
+export const MIN_HEIGHT_TEXTAREA = 24;
+export const MAX_HEIGHT_TEXTAREA = 180;
+
+// pagine
+export const PARENT_PAGE_USERS = 'users ';
+export const PARENT_PAGE_DETAIL_CONVERSATION = 'dettaglio-conversazione ';
+
+// css
+export const BCK_COLOR_CONVERSATION_SELECTED = '#EEEEEE ';
+export const BCK_COLOR_CONVERSATION_UNSELECTED = '#FFFFFF ';
+
+export const TYPE_SUPPORT_GROUP = 'support-group';
+export const CHANNEL_TYPE_GROUP = 'group';
+
+// TYPES MESSAGES
+export const TYPE_MSG_TEXT = 'text';
+export const TYPE_MSG_IMAGE = 'image';
+export const MAX_WIDTH_IMAGES = 300;
+export const TYPE_DIRECT = 'direct';
+export const TYPE_GROUP = 'group';
+export const SYSTEM = 'system';
+export const URL_NO_IMAGE = ''; // assets/img/no_image.png';
+export const LABEL_NOICON = 'NOICON';
+export const CLIENT_BROWSER = 'browser';
+export const TYPE_POPUP_LIST_CONVERSATIONS = 'LIST_CONVERSATIONS';
+export const TYPE_POPUP_DETAIL_MESSAGE = 'DETAIL_MESSAGE';
+export const MESSAGE_TYPE_INFO = 'INFO';
+export const MESSAGE_TYPE_MINE = 'MINE';
+export const MESSAGE_TYPE_OTHERS = 'OTHERS';
+export const MESSAGE_TYPE_DATE = 'DATE';
+
+export const CHAT_REOPENED = 'CHAT_REOPENED';
+export const CHAT_CLOSED = 'CHAT_CLOSED';
+export const MEMBER_JOINED_GROUP = 'MEMBER_JOINED_GROUP';
+
+// URLS
+// export const URL_SOUND = 'assets/sounds/pling.mp3';
+export const URL_SOUND_LIST_CONVERSATION = '/assets/sounds/pling.mp3';
+export const URL_SOUND_CONVERSATION_DETAIL = '/assets/sounds/justsaying.mp3';
+// export const CHAT_SEND_BY_EMAIL_LINK =
+// 'mailto:?subject=Transcript Chat Conversation&body=Salve,%0D%0A%0D%0Adi
+// seguito potrà scaricare il transcript della conversazione intercorsa con il nostro servizio di
+// Supporto:%0D%0A%0D%0Ahttps://api.tiledesk.com/v1/public/requests/ ';
+// export const URL_VIDEO_CHAT = 'https://videochat.tiledesk.com/add-user-group.html';
+// export const URL_TICKET_CHAT = 'https://chat21sdk.atlassian.net/secure/CreateIssue!default.jspa';
+// export const FIREBASESTORAGE_BASE_URL_IMAGE = 'https://firebasestorage.googleapis.com/v0/b/chat-v2-dev.appspot.com/o/';
+// export const BASE_URL_HOSTNAME = 'support.tiledesk.com';
+// export const DASHBOARD_URL = 'https://support.tiledesk.com/dashboard/';
+// export const URL_PROJECT_ID = 'https://support.tiledesk.com/dashboard/#/project/ ';
+
+
+// 'https://videochat.tiledesk.com/videochat/videochat.html';
+// 'https://www.chat21.org/videochat/';
+// 'https://support.chat21.org/videochat/videochat.php';
+
+// PARAMETERS
+export const PLATFORM_MOBILE = 'mobile';
+export const PLATFORM_DESKTOP = 'desktop';
+
+// STORAGE
+export const STORAGE_PREFIX = 'tiledesk_widget_';
+
+// links
+export const FIREBASESTORAGE_BASE_URL_IMAGE = 'https://firebasestorage.googleapis.com/v0/b/' //+ 'chat-v2-dev.appspot.com/o/';
+export const IMG_PROFILE_BOT = '/assets/images/avatar_bot_tiledesk.svg';
+export const IMG_PROFILE_DEFAULT = '/assets/images/avatar_male_tiledesk.svg';
+
+//LOG LEVEL
+// export enum LogLevel {
+//     Error = 0,
+//     Warn = 1,
+//     Info = 2,
+//     Debug = 3
+// }
+
+export const LogLevel = {
+    'ERROR': 0,
+    'WARN': 1,
+    'INFO': 2,
+    'DEBUG': 3
+}

package/src/chat21-core/utils/user-typing/user-typing.component.html

@@ -0,0 +1,6 @@
+<div class="tile-typing-now" [class.active]="isTyping">
+  <span *ngIf="nameUserTypingNow">
+    {{nameUserTypingNow}}
+  </span>
+  {{ translationMap?.get('LABEL_IS_WRITING') }}
+</div>

package/src/chat21-core/utils/user-typing/user-typing.component.scss

@@ -0,0 +1,62 @@
+.tile-typing-now {
+    font-size: 12px;
+    background-color: #fff;
+    display: none;
+    &.active {
+        display: block;
+    }
+}
+
+/* BEGIN LOADING */
+/*http://tobiasahlin.com/spinkit/*/
+#tile-spinner {
+    position: relative;
+    left: 0;
+    top: 0;
+    margin: 0;
+    &.active {
+        display: inline-block;
+        width: 30px;
+    }
+}
+#tile-spinner > div {
+    width: 6px;
+    height: 6px;
+    background-color: var(--basic-blue);
+}
+.spinner {
+    margin: 100px auto 0;
+    width: 70px;
+    text-align: center;
+}
+.spinner > div {
+    width: 18px;
+    height: 18px;
+    background-color: #333;
+    border-radius: 100%;
+    display: inline-block;
+    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+}
+.spinner .bounce1 {
+    -webkit-animation-delay: -0.32s;
+    animation-delay: -0.32s;
+}
+.spinner .bounce2 {
+    -webkit-animation-delay: -0.16s;
+    animation-delay: -0.16s;
+}
+@-webkit-keyframes sk-bouncedelay {
+    0%, 80%, 100% { -webkit-transform: scale(0) }
+    40% { -webkit-transform: scale(1.0) }
+}
+@keyframes sk-bouncedelay {
+    0%, 80%, 100% { 
+    -webkit-transform: scale(0);
+    transform: scale(0);
+    } 40% { 
+        -webkit-transform: scale(1.0);
+        transform: scale(1.0);
+    }
+}
+/* END LOADING */

package/src/chat21-core/utils/user-typing/user-typing.component.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { UserTypingComponent } from './user-typing.component';
+
+describe('UserTypingComponent', () => {
+  let component: UserTypingComponent;
+  let fixture: ComponentFixture<UserTypingComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ UserTypingComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(UserTypingComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/chat21-core/utils/user-typing/user-typing.component.ts

@@ -0,0 +1,114 @@
+import { Component, OnInit, OnDestroy, Input } from '@angular/core';
+
+// services
+import { TypingService } from '../../providers/abstract/typing.service';
+
+// Logger
+import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
+import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
+
+@Component({
+  selector: 'app-user-typing',
+  templateUrl: './user-typing.component.html',
+  styleUrls: ['./user-typing.component.scss'],
+})
+export class UserTypingComponent implements OnInit, OnDestroy {
+
+  @Input() idConversation: string;
+  @Input() idCurrentUser: string;
+  @Input() isDirect: boolean;
+  @Input() translationMap: Map<string, string>;
+  @Input() color: string;
+  @Input() membersConversation: [string];
+
+  public status = '';
+  public isTyping = false;
+  public nameUserTypingNow: string;
+
+  private setTimeoutWritingMessages: any;
+  private subscriptions = [];
+
+  private logger: LoggerService = LoggerInstance.getInstance();
+
+  constructor(
+    public typingService: TypingService
+  ) { }
+
+  /** */
+  ngOnInit() {
+    this.logger.log('[USER-TYPING-COMPONENT] - ngOnInit');
+    this.initialize();
+  }
+
+  /** */
+  ngOnDestroy() {
+    this.logger.log('UserTypingComponent - ngOnDestroy');
+    // this.unsubescribeAll();
+  }
+
+  /** */
+  initialize() {
+    this.status = ''; // this.translationMap.get('LABEL_AVAILABLE');
+    this.logger.log('this.translationMap', this.translationMap);
+    this.logger.log('this.status', this.status);
+    this.setSubscriptions();
+    this.typingService.isTyping(this.idConversation, this.idCurrentUser, this.isDirect);
+  }
+
+  /** */
+  private setSubscriptions() {
+    const that = this;
+    const conversationSelected = this.subscriptions.find(item => item.key === this.idConversation);
+    if (!conversationSelected) {
+      const subscribeBSIsTyping =  this.typingService.BSIsTyping.subscribe((data: any) => {
+        this.logger.log('***** BSIsTyping *****', data);
+        if (data) {
+          const isTypingUid = data.uid;
+          if (this.idConversation === isTypingUid) {
+            that.subscribeTypings(data);
+          }
+        }
+      });
+      const subscribe = {key: this.idConversation, value: subscribeBSIsTyping };
+      this.subscriptions.push(subscribe);
+    }
+  }
+
+  /** */
+  subscribeTypings(data: any) {
+    const that = this;
+    try {
+      const key = data.uidUserTypingNow;
+      this.nameUserTypingNow = null;
+      if (data.nameUserTypingNow) {
+        this.nameUserTypingNow = data.nameUserTypingNow;
+      }
+      this.logger.log('subscribeTypings data:', data);
+      const userTyping = this.membersConversation.includes(key);
+      if ( !userTyping ) {
+        this.isTyping = true;
+        this.logger.log('child_changed key', key);
+        this.logger.log('child_changed name', this.nameUserTypingNow);
+        clearTimeout(this.setTimeoutWritingMessages);
+        this.setTimeoutWritingMessages = setTimeout(() => {
+            that.isTyping = false;
+        }, 2000);
+      }
+    } catch (error) {
+      this.logger.log('error: ', error);
+    }
+  }
+
+
+  /** */
+  private unsubescribeAll() {
+    this.logger.log('UserTypingComponent unsubescribeAll: ', this.subscriptions);
+    this.subscriptions.forEach((subscription: any) => {
+      this.logger.log('unsubescribe: ', subscription);
+      subscription.unsubescribe();
+    });
+    this.subscriptions = [];
+  }
+
+
+}