Add storage to web chat

src/app/pages/chat/chat.page.ts

@@ -31,6 +31,7 @@ import { TimeService } from 'src/app/services/functions/time.service';
 import { ThemeService } from 'src/app/services/theme.service'
 import { DataService } from 'src/app/services/data.service';
 import { SqliteService } from 'src/app/services/sqlite.service';
+import { StorageService } from 'src/app/services/storage.service';
 
 
 
@@ -122,7 +123,8 @@ export class ChatPage implements OnInit {
     private dataService: DataService,
     private router: Router,
     private sqlservice: SqliteService,
-    private platform: Platform
+    private platform: Platform,
+    private storageservice: StorageService
 
   ) {
     this.loggedUserChat = authService.ValidatedUserChat['data'];
@@ -402,18 +404,36 @@ export class ChatPage implements OnInit {
 
   getDirectMessagesDB() {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      this.storageservice.get("rooms").then((rooms) =>{
+        
+        this.userDirectMessages = rooms.sort((a, b) => {
+          var dateA = new Date(a._updatedAt).getTime();
+          var dateB = new Date(b._updatedAt).getTime();
+          return dateB - dateA;
+        });
+        console.log('DIRECTMESSAGE FROM DB', this.userDirectMessages);
+
+        console.log('ROOMS FROM DB', rooms)
+      })
+
+      this.storageservice.get('chatusers').then((users) => {
+        this.dmUsers = users.filter(data => data.username != this.loggedUserChat.me.username);
+      })
     } else {
       this.sqlservice.getAllChatRoom().then((rooms: any) => {
+        console.log('ROOMS FROM DB', rooms)
         let roomsArray = [];
         rooms.forEach(element => {
           let roomListDB = {
             _id: element.Id,
-            uids: JSON.parse(element.Uids),
+            uids: this.isJson(element.Uids),
-            usernames: JSON.parse(element.Usernames),
+            usernames: this.isJson(element.Usernames),
-            lastMessage: JSON.parse(element.LastMessage),
+            lastMessage: this.isJson(element.LastMessage),
             _updatedAt: element.UpdatedAt
           }
+          if(element.customFields == "undefined") {
             roomsArray.push(roomListDB)
+          }
         });
 
         this.userDirectMessages = roomsArray.sort((a, b) => {
@@ -448,6 +468,22 @@ export class ChatPage implements OnInit {
 
   transformDataRoomList(data) {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      let roomsArray = [];
+      data.forEach(element => {
+        let roomList = {
+          _id: element._id,
+          uids: element.uids,
+          usernames: element.usernames,
+          lastMessage: element.lastMessage,
+          _updatedAt: element._updatedAt
+        }
+
+        console.log(' Web TRANSFORM ROOM LIST', roomList)
+        roomsArray.push(roomList)
+      });
+
+      this.storageservice.store('rooms', roomsArray);
+
     } else {
       data.forEach(element => {
         let roomList = {
@@ -466,6 +502,18 @@ export class ChatPage implements OnInit {
 
   transformDataUserList(users) {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      let usersArray = [];
+      users.forEach(element => {
+        console.log('TRANSFORM USER CHAT 1', element)
+        let chatusers = {
+          _id: element._id,
+          name: element.name,
+          username: element.username
+        }
+        console.log('TRANSFORM USER CHAT 2', chatusers)
+        usersArray.push(chatusers);
+      });
+      this.storageservice.store('chatusers',usersArray);
     } else {
       users.forEach(element => {
         console.log('TRANSFORM USER CHAT 1', element)
@@ -492,13 +540,13 @@ export class ChatPage implements OnInit {
       console.log('Chat list', res);
 
       if (res != 200) {
-        if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+       /*  if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
           this.userDirectMessages = res.ims.sort((a, b) => {
           var dateA = new Date(a._updatedAt).getTime();
           var dateB = new Date(b._updatedAt).getTime();
           return dateB - dateA;
         });
-        } 
+        }  */
         //console.log(res.ims);
         
         //console.log(this.userDirectMessages);
@@ -540,28 +588,136 @@ export class ChatPage implements OnInit {
       console.log('chatusers', res);
       this.transformDataUserList(res['users'])
 
-      if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      /* if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
         this.dmUsers = res['users'].filter(data => data.username != this.loggedUserChat.me.username);
       console.log(this.dmUsers);
-      }
+      } */
 
     });
   }
 
+  getGroupsDB() {
+    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      this.storageservice.get("grouprooms").then((rooms) =>{
+
+
+        this.allGroups = rooms.sort((a, b) => {
+          var dateA = new Date(a._updatedAt).getTime();
+          var dateB = new Date(b._updatedAt).getTime();
+          return dateB - dateA;
+        });
+
+        console.log('GROUPS FROM DB',  this.allGroups)
+      })
+
+      this.storageservice.get('chatusers').then((users) => {
+        this.dmUsers = users.filter(data => data.username != this.loggedUserChat.me.username);
+      })
+    } else {
+      this.sqlservice.getAllChatRoom().then((rooms: any) => {
+        
+        let roomsArray = [];
+        rooms.forEach(element => {
+          let fddf = this.isJson(element.LastMessage);
+          let roomListDB = {
+            _id: element.Id,
+            customFields: this.isJson(element.customFields),
+            name: element.name,
+            lastMessage: this.isJson(element.LastMessage),
+            _updatedAt: element.UpdatedAt
+          }
+          if(element.customFields != "undefined") {
+            roomsArray.push(roomListDB)
+          }
+        });
+
+        this.allGroups = roomsArray.sort((a, b) => {
+          var dateA = new Date(a._updatedAt).getTime();
+          var dateB = new Date(b._updatedAt).getTime();
+          return dateB - dateA;
+        });
+        console.log('Group FROM DB', this.allGroups);
+
+      })
+
+    /*   this.sqlservice.getAllChatUsers().then((userslist: any) => {
+        console.log('USERS FOM DB 1', userslist)
+        let chatusersArray = [];
+        userslist.forEach(element => {
+          console.log('USERS FOM DB 2', element)
+          let userListDB = {
+            _id: element.Id,
+            name: element.Name,
+            username: element.Username
+          }
+
+          chatusersArray.push(userListDB);
+        });
+
+        this.dmUsers = chatusersArray.filter(data => data.username != this.loggedUserChat.me.username);
+
+      }) */
+    }
+
+  }
+
+  transformGroups(data) {
+    if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
+      let groupsArray = [];
+      data.forEach(element => {
+        let roomList = {
+          _id: element._id,
+          uids: element.uids,
+          usernames: element.usernames,
+          name: element.name,
+          customFields: element.customFields,
+          lastMessage: element.lastMessage,
+          _updatedAt: element._updatedAt
+        }
+
+        console.log(' Web TRANSFORM ROOM LIST', roomList)
+        groupsArray.push(roomList)
+      });
+
+      this.storageservice.store('grouprooms', groupsArray);
+
+    } else {
+      data.forEach(element => {
+        let roomList = {
+          id: element._id,
+          uids: element.uids,
+          usernames: element.usernames,
+          customFields: element.customFields,
+          name: element.name,
+          lastMessage: element.lastMessage,
+          updatedat: element._updatedAt
+        }
+
+        console.log('TRANSFORM ROOM LIST', roomList)
+        this.sqlservice.addChatListRoom(roomList);
+      });
+    }
+
+  }
+
   async getGroups(event?) {
     this.result = this.chatService.getAllPrivateGroups().subscribe(async (res: any) => {
       //console.log(res);
       if (res.groups != 200) {
 
+        this.transformGroups(res.groups);
+        this.getGroupsDB();
+
         this.privateGroups = res.groups;
+        console.log('Chat list group' , res);
         /* this.result = this.chatService.getAllUserChannels().subscribe((res:any)=>{
           this.publicGroups = res.channels; */
         //let all = this.privateGroups.concat(this.publicGroups);
-        this.allGroups = this.privateGroups.sort((a, b) => {
+        /* this.allGroups = this.privateGroups.sort((a, b) => {
           var dateA = new Date(a._updatedAt).getTime();
           var dateB = new Date(b._updatedAt).getTime();
           return dateB - dateA;
-        });
+        }); */
         //console.log(this.allGroups);
         /* }); */
         if (this.route.url != "/home/chat") {
@@ -584,6 +740,15 @@ export class ChatPage implements OnInit {
     });
   }
 
+  isJson(str) {
+    try {
+      JSON.parse(str);
+    } catch (e) {
+      return str;
+    }
+    return JSON.parse(str);
+  }
+
   async selectContact() {
     const modal = await this.modalController.create({
       component: ContactsPage,

src/app/pages/chat/messages/messages.page.html

@@ -59,9 +59,10 @@
         <div>
           <ion-label>{{msg.msg}}</ion-label>
           <div *ngIf="msg.attachments" class="message-attachments">
+            <img *ngIf="msg.image_url" src="{{msg.image_url}}" alt="image">
             <div *ngFor="let file of msg.attachments let i = index">
               <div (click)="openPreview(msg)">
-                <img *ngIf="file.image_url" src="{{file.image_url}}" alt="image">
+                <img *ngIf="msg.image_url" src="{{downloadfile}}" alt="image">
               </div>
               <div>
                 <div>

src/app/pages/chat/messages/messages.page.ts

@@ -27,6 +27,7 @@ import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.
 import { SqliteService } from 'src/app/services/sqlite.service';
 import { elementAt } from 'rxjs-compat/operator/elementAt';
 import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
+import { HttpEventType } from '@angular/common/http';
 
 const IMAGE_DIR = 'stored-images';
 
@@ -76,6 +77,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
   duration = 0;
   @ViewChild('recordbtn', { read: ElementRef }) recordBtn: ElementRef;
   myAudio: any;
+  downloadfile: any;
 
   constructor(
     public popoverController: PopoverController,
@@ -551,6 +553,40 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     });
   }
 
+  /* 
+        this.fileService.downloadFile(element.file.guid).subscribe(async (event) => {
+          var name = element.file.guid;
+          if (event.type === HttpEventType.DownloadProgress) {
+            
+          } else if (event.type === HttpEventType.Response) {
+            var base64 = btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '')
+            );
+
+            console.log('TRY ARRAY BUFFER NAME', name);
+            console.log('TRY ARRAY BUFFER', base64);
+
+            await Filesystem.writeFile({
+              path: `${IMAGE_DIR}/${name}`,
+              data: base64,
+              directory: Directory.Data
+            }).then((foo) => {
+
+              console.log('LSKE FS FILE SAVED', foo)
+
+            }).catch((error) => {
+              console.log('error LAKE FS FILE', error)
+            });
+
+          
+
+          const readFile = await Filesystem.readFile({
+            path: `${IMAGE_DIR}/${name}`,
+            directory: Directory.Data,
+          }); 
+          
+          
+        });*/
+
   getRoomMessageDB(roomId) {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
     } else {
@@ -597,6 +633,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
     } else {
       res.forEach(element => {
+
         let chatmsg = {
           _id: element._id,
           attachments: element.attachments,
@@ -607,10 +644,16 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
           rid: element.rid,
           ts: element.ts,
           u: element.u,
-          _updatedAt: element._updatedAt
+          _updatedAt: element._updatedAt,
+          /* image_url: {
+            name: name,
+            path: `${IMAGE_DIR}/${name}`,
+            data: `data:image/jpeg;base64,${readFile.data}`,
+          }, */
         }
 
         this.sqlservice.addChatMSG(chatmsg)
+
       });
     }
 

src/app/services/functions/file.service.ts

@@ -12,7 +12,7 @@ import { ToastService } from '../toast.service';
 import { Camera,  CameraResultType, CameraSource, Photo} from '@capacitor/camera';
 import { Filesystem, Directory } from '@capacitor/filesystem';
 import { environment } from 'src/environments/environment';
-import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
+import { HttpClient, HttpEventType, HttpHeaders, HttpParams } from '@angular/common/http';
 
 const IMAGE_DIR = 'stored-images';
 
@@ -39,6 +39,8 @@ export class FileService {
   idroom: any;
 
   headers: HttpHeaders;
+  downloadProgess = 0;
+  downloadFilename: any;
 
   constructor(
     private fileLoaderService: FileLoaderService,
@@ -57,7 +59,7 @@ export class FileService {
     alert('OIEE')
 
     //const geturl = environment.apiURL + 'Tasks/DelegateTask';
-    const geturl = environment.apiURL + 'lakefs/UploadFiles';
+    const geturl = environment.apiURL + 'ObjectServer/UploadFiles';
 
     let options = {
       headers: this.headers
@@ -79,6 +81,28 @@ export class FileService {
     return this.http.get<any>(`${geturl}`, options);
   }
 
+   downloadFile(guid:any) {
+
+    let downloadUrl = 'https://equilibrium.dyndns.info/GabineteDigital.Services/V5/api/objectserver/streamfiles?path='+guid;
+    var name = new Date().getTime();
+   return this.http.get(downloadUrl, {
+      responseType: "arraybuffer",
+      reportProgress: true, observe: 'events'
+    })
+
+  }
+
+  _arrayBufferToBase64( buffer ) {
+    var binary = '';
+    var bytes = new Uint8Array( buffer );
+    var len = bytes.byteLength;
+    for (var i = 0; i < len; i++) {
+        binary += String.fromCharCode( bytes[ i ] );
+    }
+    return window.btoa( binary );
+}
+
+
   async takePicture() {
     const capturedImage = await Camera.getPhoto({
       quality: 90,
@@ -378,6 +402,7 @@ export class FileService {
           "file":{
             "type": "application/img",
             "guid": guid.path,
+            "image_url": ""
           }
         }
       }

src/app/services/sqlite.service.ts

@@ -140,7 +140,9 @@ export class SqliteService {
               Uids Text,
               Usernames Text,
               LastMessage Text,
-              UpdatedAt varchar(255)
+              UpdatedAt varchar(255),
+              customFields Text,
+              name varchar(255)
             )`, [])
               .then((res) => {
                 console.log("Sucess chat list room Table created: ", res)
@@ -170,7 +172,8 @@ export class SqliteService {
                 Rid varchar(255),
                 Ts varchar(255),
                 U Text,
-                UpdatedAt varchar(255)
+                UpdatedAt varchar(255),
+                image_url Text
               )`, [])
                 .then((res) => {
                   console.log("Sucess chat msg Table created: ", res)
@@ -248,8 +251,8 @@ export class SqliteService {
   public addChatListRoom(data) {
     console.log('INSIDE DB CHAT LIST ROOM',data,)
     this.dbInstance.executeSql(`
-      INSERT OR REPLACE INTO ${this.chatlistroom} (Id,Uids,Usernames,LastMessage,UpdatedAt) 
+      INSERT OR REPLACE INTO ${this.chatlistroom} (Id,Uids,Usernames,LastMessage,UpdatedAt,customFields,name) 
-      VALUES ('${data.id}','${JSON.stringify(data.uids)}','${JSON.stringify(data.usernames)}','${JSON.stringify(data.lastMessage)}','${data.updatedat}')`, [])
+      VALUES ('${data.id}','${JSON.stringify(data.uids)}','${JSON.stringify(data.usernames)}','${JSON.stringify(data.lastMessage)}','${data.updatedat}','${JSON.stringify(data.customFields)}','${data.name}')`, [])
       .then(() => {
         console.log("chat room add with Success");
 
@@ -276,8 +279,8 @@ export class SqliteService {
   public addChatMSG(data) {
     console.log('INSIDE DB CHAT MSG',data,)
     this.dbInstance.executeSql(`
-      INSERT OR REPLACE INTO ${this.chatmsg} (Id,Attachments,Channels,File,Mentions,Msg,Rid, Ts ,U, UpdatedAt) 
+      INSERT OR REPLACE INTO ${this.chatmsg} (Id,Attachments,Channels,File,Mentions,Msg,Rid, Ts ,U, UpdatedAt,image_url) 
-      VALUES ('${data._id}','${JSON.stringify(data.attachments)}','${JSON.stringify(data.channels)}','${JSON.stringify(data.file)}','${JSON.stringify(data.mentions)}','${data.msg}','${data.rid}','${data.ts}','${JSON.stringify(data.u)}','${data._updatedAt}')`, [])
+      VALUES ('${data._id}','${JSON.stringify(data.attachments)}','${JSON.stringify(data.channels)}','${JSON.stringify(data.file)}','${JSON.stringify(data.mentions)}','${data.msg}','${data.rid}','${data.ts}','${JSON.stringify(data.u)}','${data._updatedAt}','${JSON.stringify(data.image_url)}')`, [])
       .then(() => {
         console.log("chat msg add with Success");
 

src/app/shared/chat/messages/messages.page.html

@@ -37,7 +37,7 @@
     </ion-refresher-content>
   </ion-refresher>
   <div class="messages" #scrollMe>
-    <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of chatMessageStore.message[roomId]; let last = last">
+    <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last">
       <div class='message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45'>
         <div class="message-item-options d-flex justify-content-end">
           <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon>
@@ -53,9 +53,10 @@
           <ion-label>{{msg.msg}}</ion-label>
           <div *ngIf="msg.attachments" class="message-attachments">
             <div *ngFor="let file of msg.attachments">
+            
               <div (click)="openPreview(msg)">
                 <!-- <img *ngIf="file.image_url" src="{{file.image_url}}" alt="image" (click)="imageSize(file.image_url)"> -->
-                <img *ngIf="file.image_url" src="{{file.image_url}}" alt="image">
+                <img src="{{msg.image_url}}" alt="image">
               </div>
                 <div>
                   <div class="file">

src/app/shared/chat/messages/messages.page.ts

@@ -1,4 +1,4 @@
-import { AfterViewChecked, AfterViewInit, Component, ElementRef,ChangeDetectorRef, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
+import { AfterViewChecked, AfterViewInit, Component, ElementRef, ChangeDetectorRef, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
 import { AnimationController, GestureController, IonSlides, ModalController, PopoverController } from '@ionic/angular';
 import { AlertService } from 'src/app/services/alert.service';
 import { AuthService } from 'src/app/services/auth.service';
@@ -13,12 +13,16 @@ import { ChatMessageStore } from 'src/app/store/chat/chat-message.service';
 import { ChatUserStorage } from 'src/app/store/chat/chat-user.service';
 import { TimeService } from 'src/app/services/functions/time.service';
 import { FileService } from 'src/app/services/functions/file.service';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { HttpClient, HttpEventType, HttpHeaders } from '@angular/common/http';
 import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
 import { ThemeService } from 'src/app/services/theme.service'
 import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
 import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
+import { SqliteService } from 'src/app/services/sqlite.service';
+import { StorageService } from 'src/app/services/storage.service';
+import { Directory, Filesystem } from '@capacitor/filesystem';
 
+const IMAGE_DIR = 'stored-images';
 @Component({
   selector: 'app-messages',
   templateUrl: './messages.page.html',
@@ -33,24 +37,25 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
   loggedUser: any;
 
   message = '';
-  messages:any;
+  messages: any;
-  dm:any;
+  dm: any;
-  userPresence='';
+  userPresence = '';
-  dmUsers:any;
+  dmUsers: any;
   checktimeOut: boolean;
-  members:any;
+  members: any;
+  downloadProgess = 0;
 
-  @Input() roomId:string;
+  @Input() roomId: string;
-  @Input() showMessages:string;
+  @Input() showMessages: string;
 
-  @Output() openNewEventPage:EventEmitter<any> = new EventEmitter<any>();
+  @Output() openNewEventPage: EventEmitter<any> = new EventEmitter<any>();
-  @Output() getDirectMessages:EventEmitter<any> = new EventEmitter<any>();
+  @Output() getDirectMessages: EventEmitter<any> = new EventEmitter<any>();
 
 
   chatMessageStore = ChatMessageStore
   chatUserStorage = ChatUserStorage
 
-  scrollingOnce:boolean = true;
+  scrollingOnce: boolean = true;
   private scrollChangeCallback: () => void;
   currentPosition: any;
   startPosition: number;
@@ -58,6 +63,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
   scrollToBottomBtn = false;
   longPressActive = false;
   frameUrl: any;
+  downloadFile: any;
 
   constructor(
     public popoverController: PopoverController,
@@ -72,9 +78,11 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     private timeService: TimeService,
     private fileService: FileService,
     private gestureController: GestureController,
-    private http:HttpClient,
+    private http: HttpClient,
     public ThemeService: ThemeService,
-    private changeDetectorRef: ChangeDetectorRef
+    private changeDetectorRef: ChangeDetectorRef,
+    private sqliteservice: SqliteService,
+    private storageservice: StorageService
   ) {
     this.loggedUser = authService.ValidatedUserChat['data'];
 
@@ -99,11 +107,11 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     this.setStatus('online');
   }
 
-  onPressingMessage(){
+  onPressingMessage() {
     const gesture = this.gestureController.create({
       el: this.messageContainer.nativeElement,
       gestureName: 'long-press',
-      onStart: ev =>{
+      onStart: ev => {
         this.longPressActive = true;
         console.log('Pressing');
       },
@@ -114,7 +122,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     });
   }
 
-  setStatus(status:string){
+  setStatus(status: string) {
     let body = {
       message: '',
       status: status,
@@ -124,36 +132,36 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     })
   }
 
-  notImplemented(){
+  notImplemented() {
     this.alertService.presentAlert('Funcionalidade em desenvolvimento');
   }
 
-  load = ()=>{
+  load = () => {
     this.checktimeOut = true;
     this.serverLongPull();
     this.getChatMembers();
   }
 
 
-  doRefresh(ev:any){
+  doRefresh(ev: any) {
     this.load();
     ev.target.complete();
   }
 
   scrollToBottom(): void {
     try {
-      if(this.scrollingOnce){
+      if (this.scrollingOnce) {
         this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
         //this.scrollingOnce = false;
       }
-    } catch(err) { }
+    } catch (err) { }
   }
 
   scrollToBottomClicked(): void {
     try {
       this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
       //this.scrollingOnce = false;
-    } catch(err) { }
+    } catch (err) { }
   }
 
   ngAfterViewInit() {
@@ -173,10 +181,10 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
       //alert('UP');
       this.scrollingOnce = false;
     }
-    if((containerHeight - 100) > scroll){
+    if ((containerHeight - 100) > scroll) {
       this.scrollToBottomBtn = true;
     }
-    else{
+    else {
       this.scrollToBottomBtn = false;
     }
     this.currentPosition = scroll;
@@ -188,7 +196,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     window.removeEventListener('scroll', this.scrollChangeCallback, true);
   }
 
-  openBookMeetingComponent(){
+  openBookMeetingComponent() {
     let data = {
       roomId: this.roomId,
       members: this.members
@@ -196,7 +204,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     this.openNewEventPage.emit(data);
   }
 
-  showDateDuration(start:any){
+  showDateDuration(start: any) {
     return this.timeService.showDateDuration(start);
   }
 
@@ -211,13 +219,13 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
       }
     }
 
-    this.chatService.sendMessage(body).subscribe(res=> {
+    this.chatService.sendMessage(body).subscribe(res => {
       this.scrollingOnce = true;
     });
     this.message = "";
   }
 
-  deleteMessage(msgId:string){
+  deleteMessage(msgId: string) {
     let body = {
       "roomId": this.roomId,
       "msgId": msgId,
@@ -229,13 +237,58 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     }); */
   }
 
-  loadMessages(){
+
+  getMessageDB() {
+    this.storageservice.get('chatmsg').then((msg) => {
+      let msgArray =[];
+      msgArray = msg;
+      msgArray.filter(data => data._id != this.roomId);
+      this.messages = msgArray.reverse();
+      console.log("MSG CHAT WEB", this.messages)
+    })
+
+  }
+
+  transformData(res) {
+    let mgsArray = [];
+    res.forEach(async element => {
+
+      let chatmsg = {
+        _id: element._id,
+        attachments: element.attachments,
+        channels: element.channels,
+        file: element.file,
+        mentions: element.mentions,
+        msg: element.msg,
+        rid: element.rid,
+        ts: element.ts,
+        u: element.u,
+        _updatedAt: element._updatedAt,
+        /* image_url: {
+          name: element.file.guid,
+          path: `${IMAGE_DIR}/${element.file.guid}`,
+          data: `data:image/jpeg;base64,${readFile.data}`,
+        }, */
+      }
+
+      mgsArray.push(chatmsg)
+      
+    });
+
+    this.storageservice.store('chatmsg',mgsArray);
+    
+  }
+
+  loadMessages() {
     //this.showLoader = true;
     const roomId = this.roomId
     this.chatService.getRoomMessages(this.roomId).subscribe(res => {
       console.log(res);
-      this.messages = res['messages'].reverse();
+      this.transformData(res['messages']);
-      this.chatMessageStore.add(roomId, this.messages)
+      this.getMessageDB();
+      //this.getFileFromLakeFS();
+      /* this.messages = res['messages'].reverse();
+      this.chatMessageStore.add(roomId, this.messages) */
 
       console.log(this.messages);
       //this.serverLongPull(res)
@@ -246,18 +299,83 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     })
   }
 
-  async viewDocument(msg:any, url?:string){
+  async viewDocument(msg: any, url?: string) {
-    if(msg.file.type == "application/img"){
+    console.log('FILE TYPE',msg.file.type)
-      let response:any = await this.fileService.getFile(msg.file.guid).toPromise();
+    this.downloadFile = "";
-      console.log(response);
+    if (msg.file.type == "application/img") {
+      this.fileService.downloadFile(msg.file.guid).subscribe(async (event) => {
+      console.log('FILE TYPE 22',msg.file.guid)
+      var name = msg.file.guid;
+      
+      if (event.type === HttpEventType.DownloadProgress) {
+        //this.downloadProgess = Math.round((100 * event.loaded) / event.total);
+        console.log('FILE TYPE 33',msg.file.type)
+      } else if (event.type === HttpEventType.Response) {
+        this.downloadFile = 'data:image/jpeg;base64,' + btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''));
+        console.log('FILE TYPE 44',this.downloadFile)
+        
+        console.log('TRY ARRAY BUFFER NAME', name);
+        console.log('TRY ARRAY BUFFER', this.downloadFile);
+
+        await Filesystem.writeFile({
+          path: `${IMAGE_DIR}/${name}`,
+          data: this.downloadFile,
+          directory: Directory.Data
+        }).then((foo) => {
+          console.log('SAVED FILE WEB', foo )
+        }).catch((error) =>{
+          console.log('SAVED FILE WEB error ', error )
+        });
+
+        const readFile = await Filesystem.readdir({
+          path: `${IMAGE_DIR}/${name}`,
+          directory: Directory.Data,
+        }).then((foo) => {
+          console.log('GET FILE WEB', foo )
+        });
+
+        this.storageservice.get('chatmsg').then((msg) => {
+          let msgArray =[];
+          msgArray = msg;
+          msgArray.filter(data => data._id != this.roomId);
+          this.messages = msgArray.reverse();
+          console.log("MSG CHAT WEB", this.messages)
+
+          let newmgsArray = [];
+          msgArray.forEach(async element => {
+            console.log('GET FILE TRANSFORM',element.file.guid )
+            if(element.file.guid == msg.file.guid) {
+              let chatmsg = {
+                _id: element._id,
+                attachments: element.attachments,
+                channels: element.channels,
+                file: element.file,
+                mentions: element.mentions,
+                msg: element.msg,
+                rid: element.rid,
+                ts: element.ts,
+                u: element.u,
+                _updatedAt: element._updatedAt,
+                image_url: this.downloadFile
+              }
+              newmgsArray.push(chatmsg)
+            }
+          });
+      
+          this.storageservice.store('chatmsg',newmgsArray);
+        })
+      }
+
+      this.getMessageDB();
+    });
 
       //this.openPreview(msg);
 
     }
-    else if(msg.file.type == "application/webtrix") {
+    else if (msg.file.type == "application/webtrix") {
       this.openViewDocumentModal(msg.file);
     }
-     else{
+    else {
       let fullUrl;
       fullUrl = "https://www.tabularium.pt" + url;
       //fullUrl = "http://www.africau.edu/images/default/sample.pdf";
@@ -269,7 +387,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
   }
 
 
-  async openViewDocumentModal(file:any){
+  async openViewDocumentModal(file: any) {
     let task = {
       serialNumber: '',
       taskStartDate: '',
@@ -291,7 +409,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
       "ApplicationId": file.ApplicationId,
       "CreateDate": "",
       "Data": null,
-        "Description":"",
+      "Description": "",
       "Link": null,
       "SourceId": file.DocId,
       "SourceName": file.Assunto,
@@ -322,7 +440,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     console.log(this.roomId);
 
     //this.showLoader = true;
-    this.chatService.getMembers(this.roomId).subscribe(res=> {
+    this.chatService.getMembers(this.roomId).subscribe(res => {
       this.members = res['members'];
       this.dmUsers = res['members'].filter(data => data.username != this.loggedUser.me.username)
       console.log(res);
@@ -344,7 +462,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     return await popover.present();
   }
 
-  async addContacts(){
+  async addContacts() {
     const modal = await this.modalController.create({
       component: ContactsPage,
       componentProps: {},
@@ -357,12 +475,12 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     modal.onDidDismiss();
   }
 
-  openSendMessageOptions(ev?:any){
+  openSendMessageOptions(ev?: any) {
-    if(window.innerWidth < 701){
+    if (window.innerWidth < 701) {
       console.log('mobile');
       this.openChatOptions(ev);
     }
-    else{
+    else {
       console.log('desktop');
       this._openChatOptions();
     }
@@ -431,23 +549,23 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
 
 
 
-  takePicture(){
+  takePicture() {
     const roomId = this.roomId
     this.fileService.addCameraPictureToChat(roomId);
   }
-  addImage(){
+  addImage() {
     const roomId = this.roomId;
     this.fileService.addPictureToChat(roomId);
     //this.fileService.loadPicture();
     //this.fileService.addPictureToChat(roomId);
   }
-  addFile(){
+  addFile() {
     this.fileService.addDocumentToChat(this.roomId);
   }
-  addFileWebtrix(){
+  addFileWebtrix() {
     this.fileService.addDocGestaoDocumentalToChat(this.roomId);
   }
-  bookMeeting(){
+  bookMeeting() {
     let data = {
       roomId: this.roomId,
       members: this.members
@@ -493,9 +611,9 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
       }
     });
     await modal.present();
-    modal.onDidDismiss().then((res)=>{
+    modal.onDidDismiss().then((res) => {
       console.log(res['data']);
-      if(res['data'] == 'meeting'){
+      if (res['data'] == 'meeting') {
         //this.closeAllDesktopComponents.emit();
         let data = {
           roomId: this.roomId,
@@ -503,19 +621,19 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
         }
         this.openNewEventPage.emit(data);
       }
-      else if(res['data'] == 'take-picture'){
+      else if (res['data'] == 'take-picture') {
         this.fileService.addCameraPictureToChat(this.roomId);
         //this.loadPicture();
       }
-      else if(res['data'] == 'add-picture'){
+      else if (res['data'] == 'add-picture') {
         this.fileService.addPictureToChat(this.roomId);
         //this.loadPicture();
       }
-      else if(res['data'] == 'add-document'){
+      else if (res['data'] == 'add-document') {
         this.fileService.addDocumentToChat(this.roomId);
         //this.loadDocument();
       }
-      else if(res['data'] == 'documentoGestaoDocumental'){
+      else if (res['data'] == 'documentoGestaoDocumental') {
 
         this.fileService.addDocGestaoDocumentalToChat(this.roomId);
         this.showLoader = false;
@@ -543,11 +661,11 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
 
         //console.log(this.messages);
         // Reconnect in one second
-      if(this.route.url != "/home/chat"){
+        if (this.route.url != "/home/chat") {
           console.log("Timer message stop")
         }
-      else{
+        else {
-        if(document.querySelector('app-messages')){
+          if (document.querySelector('app-messages')) {
             await new Promise(resolve => setTimeout(resolve, 5000));
             await this.serverLongPull();
             this.getDirectMessages.emit();
@@ -560,21 +678,21 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
       //this.loadMessages()
       await this.serverLongPull();
     } */
-  }, (error)=>{
+    }, (error) => {
       console.log(error);
       this.serverLongPull();
 
     });
-  }sliderOpts = {
+  } sliderOpts = {
     zoom: false,
     slidesPerView: 1.5,
     spaceBetween: 20,
     centeredSlides: true
   };
   zoomActive = false;
-zoomScale = 1;
+  zoomScale = 1;
 
-sliderZoomOpts = {
+  sliderZoomOpts = {
     allowSlidePrev: false,
     allowSlideNext: false,
     zoom: {
@@ -583,13 +701,13 @@ sliderZoomOpts = {
     on: {
       zoomChange: (scale, imageEl, slideEl) => {
         this.zoomActive = true;
-      this.zoomScale = scale/5;
+        this.zoomScale = scale / 5;
         this.changeDetectorRef.detectChanges();
       }
     }
-}
+  }
 
-async touchEnd(zoomslides: IonSlides, card) {
+  async touchEnd(zoomslides: IonSlides, card) {
     // Zoom back to normal
     const slider = await zoomslides.getSwiper();
     const zoom = slider.zoom;
@@ -600,12 +718,12 @@ async touchEnd(zoomslides: IonSlides, card) {
 
     this.zoomActive = false;
     this.changeDetectorRef.detectChanges();
-}
+  }
 
-touchStart(card) {
+  touchStart(card) {
     // Make card appear above backdrop
     card.el.style['z-index'] = 11;
-}
+  }
 
   async openPreview(msg) {
     const modal = await this.modalController.create({

src/app/shared/popover/opts-expediente/opts-expediente.page.html

@@ -28,13 +28,12 @@
     </div>
     <div *ngIf="task && p.userRole(['PR'])" class="d-flex width-100">
       <div class="flex-grow-1">
-        <button (click)="openExpedientActionsModal('0', fulltask)" class="btn-cancel" shape="round" >Efetuar Despacho</button>
         <button (click)="openExpedientActionsModal('0', fulltask)" class="btn-cancel" shape="round" >Efetuar Despacho</button>
         <button (click)="distartExpedientModal('descartar')" class="btn-cancel" shape="round" >Descartar</button>
         <div class="solid"></div>
         <button (click)="openExpedientActionsModal('1',fulltask)" class="btn-cancel" shape="round" >Solicitar Parecer</button>
         <button (click)="openBookMeetingModal()" class="btn-cancel" shape="round" >Marcar Reunião</button>
-        <button (click)="sendExpedienteToPending()" *ngIf="task.Status != 'Pending'" class="btn-cancel" shape="round" >Enviar para Pendentes11</button>
+        <button (click)="sendExpedienteToPending()" *ngIf="task.Status != 'Pending'" class="btn-cancel" shape="round" >Enviar para Pendentes</button>
         <div hidden class="solid"></div>
         <button hidden class="btn-cancel" shape="round" >Delegar</button>
         <button (click)="openNewGroupPage()" class="btn-cancel" shape="round" >Iniciar Conversa</button>

src/environments/environment.ts

@@ -4,8 +4,9 @@
 
 export const environment = {
   production: false,
-  apiURL: 'https://equilibrium.dyndns.info/GabineteDigital.Services/V5/api/',
+  //apiURL: 'https://tabularium.dyndns.info/GabineteDigital.Services/V5/api/',
-  // apiURL: 'http://gpr-dev-01.gabinetedigital.local/GabineteDigital.Services/V4/api/',
+  //apiURL: 'https://equilibrium.dyndns.info/GabineteDigital.Services/V5/api/',
+   apiURL: 'http://gpr-dev-01.gabinetedigital.local/GabineteDigital.Services/V5/api/',
   apiChatUrl: 'https://www.tabularium.pt/api/v1/',
   /* apiChatUrl: 'http://chat.gabinetedigital.local:3000/api/v1/', */
   domain: 'gabinetedigital.local', //gabinetedigital.local