peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-18 20:47:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

save

Browse Source
This commit is contained in:
tiago.kayaya
2022-03-04 18:46:56 +01:00
parent 0c9d5275a6
commit 9fcd6f67c5
8 changed files with 60 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/chat/messages/messages.page.html
+22 -26
View File
@@ -174,49 +174,45 @@
está a escrever ...
</div>
<ion-list>
<span (click)="playFile(lastAudioRecorded)">{{lastAudioRecorded}}</span>
<ion-button *ngIf="lastAudioRecorded" slot="end" (click)="deleteRecording(lastAudioRecorded)" fill="clear" color="danger">
<ion-icon name="trash-outline" slot="icon-only"></ion-icon>
</ion-button>
<!-- <ion-item *ngFor="let audio of storedFileNames" (click)="playFile(audio)">
{{audio}}
<ion-button slot="end" (click)="deleteRecording(audio)" fill="clear" color="danger">
<ion-icon name="trash-outline" slot="icon-only"></ion-icon>
</ion-button>
</ion-item> -->
</ion-list>
<!-- <audio controls>
<source src="https://www.tabularium.pt/file-upload/5g6DkyMC4MHcuaDyp/Audio%20record.mp3" type="audio/mpeg">
</audio> -->
<button hidden (click)="startRecording()">Start Recording</button>
<button hidden (click)="stopRecording()">Stop Recording</button>
<div class="width-100">
<span *ngIf="!lastAudioRecorded">{{durationDisplay}}</span>
<span *ngIf="lastAudioRecorded" (click)="playFile(lastAudioRecorded)">{{lastAudioRecorded}}</span>
</div>
<div class="container width-100 d-flex">
<div>
<button *ngIf="!lastAudioRecorded" class="btn-no-color" (click)="openChatOptions()">
<button *ngIf="!recording && !lastAudioRecorded && allowTyping" class="btn-no-color" (click)="openChatOptions()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-options" src="assets/images/icons-add.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-options" src="assets/images/theme/gov/icons-add.svg"></ion-icon>
</button>
<button *ngIf="lastAudioRecorded" class="btn-no-color" (click)="deleteRecording(lastAudioRecorded)">
<button *ngIf="recording || lastAudioRecorded || !allowTyping" class="btn-no-color" (click)="deleteRecording(lastAudioRecorded)">
<fa-icon icon="trash" class="word-icon"></fa-icon>
</button>
</div>
<div class="width-70">
<ion-item *ngIf="!lastAudioRecorded" class="ion-no-padding ion-no-margin type-message" lines="none">
<ion-textarea autocomplete="on" autocorrect="on" spellcheck="true" *ngIf="!recording" clearOnEdit="true" placeholder="Escrever uma mensagem" auto-grow class="message-input" rows="1" [(ngModel)]="wsChatMethodsService.getDmRoom(roomId).message" (ionChange)="wsChatMethodsService.getDmRoom(roomId).sendTyping()"></ion-textarea>
<ion-textarea autocomplete="on" spellcheck="true" *ngIf="recording" clearOnEdit="true" placeholder="Escrever uma mensagem" auto-grow class="message-input" rows="1" [(ngModel)]="durationDisplay"></ion-textarea>
<button #recordbtn class="btn-no-color">
<div class="d-flex align-items-center justify-center width-70">
<div *ngIf="!recording && !lastAudioRecorded" class="type-message">
<ion-textarea *ngIf="allowTyping" autocomplete="on" autocorrect="on" spellcheck="true" clearOnEdit="true" placeholder="Escrever uma mensagem" auto-grow class="message-input" rows="1" [(ngModel)]="wsChatMethodsService.getDmRoom(roomId).message" (ionChange)="wsChatMethodsService.getDmRoom(roomId).sendTyping()"></ion-textarea>
<!-- <ion-textarea hidden autocomplete="on" spellcheck="true" *ngIf="recording" clearOnEdit="true" placeholder="Escrever uma mensagem" auto-grow class="message-input" rows="1" [(ngModel)]="durationDisplay"></ion-textarea> -->
<!-- <button #recordbtn class="btn-no-color">
<ion-icon slot="end" src="assets/icon/icons-chat-mic.svg"></ion-icon>
</button>
</ion-item>
</button> -->
</div>
<button *ngIf="recording" (click)="stopRecording()" class="btn-no-color">
<ion-icon name="stop-circle-outline" color="danger"></ion-icon>
</button>
</div>
<div>
<button *ngIf="wsChatMethodsService.getDmRoom(roomId).message" class="btn-no-color" (click)="sendMessage()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
<button #recordbtn *ngIf="!wsChatMethodsService.getDmRoom(roomId).message && !lastAudioRecorded" (click)="startRecording()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/default/icons-chat-record-audio.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-record-audio.svg"></ion-icon>
</button>
<button *ngIf="!wsChatMethodsService.getDmRoom(roomId).message && !lastAudioRecorded" class="btn-no-color">
<button *ngIf="wsChatMethodsService.getDmRoom(roomId).message" class="btn-no-color" (click)="sendMessage()">
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
<ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
</button>
src/app/pages/chat/messages/messages.page.scss
+3 -2
View File
@@ -228,7 +228,7 @@
justify-content: center;
justify-content: space-evenly;
align-items: center;
border: 1px solid red;
}
.chat-icon-options{
@@ -251,6 +251,7 @@
padding-left: 15px;
align-items: center;
overflow: auto;
border: 1px solid red;
ion-textarea{
margin: 0 !important;
@@ -319,4 +320,4 @@ display: block;
.typing ngx-letters-avatar {
padding-right: 5px;
}
}
src/app/pages/chat/messages/messages.page.ts
+12 -5
View File
@@ -83,6 +83,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
LoadedDocument: any = null;
recording = false;
allowTyping = true;
storedFileNames = [];
lastAudioRecorded = '';
durationDisplay = '';
@@ -162,14 +163,14 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
onStart: ev => {
Haptics.impact({ style: ImpactStyle.Light })
this.startRecording();
this.calculateDuration();
//this.calculateDuration();
},
onEnd: ev => {
Haptics.impact({ style: ImpactStyle.Light })
this.stopRecording();
setTimeout(() => {
/* setTimeout(() => {
this.loadFiles();
}, 500);
}, 500); */
}
}, true);
longpress.enable();
@@ -210,9 +211,11 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
}
this.recording = true;
VoiceRecorder.startRecording();
this.calculateDuration();
}
stopRecording() {
this.allowTyping = false;
console.log('Stop');
if (!this.recording) {
return;
@@ -232,6 +235,9 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
})
}
})
setTimeout(() => {
this.loadFiles();
}, 500);
}
async deleteRecording(fileName){
@@ -239,6 +245,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
directory: Directory.Data,
path: fileName
});
this.allowTyping = true;
this.lastAudioRecorded = '';
this.loadFiles();
}
@@ -421,11 +428,11 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
this.wsChatMethodsService.getDmRoom(roomId).send({
file: {
"type": "audio/aac",
"guid": '',
/* "guid": '', */
},
attachments: [{
"title": fileName ,
"title_link": audioRef,
"title_link": base64Response.url,
"title_link_download": true,
"type": "file"
}],
src/app/services/auth.service.ts
+2
View File
@@ -167,6 +167,8 @@ export class AuthService {
message.file.guid = guid.path
await this.storage.set(guid.path, message.file.image_url).then(() => {
console.log('add picture to chat IMAGE SAVED')
console.log(message.attachments);
message.getFileFromDb()
});
src/app/services/chat/ws-chat.service.ts
+1 -1
View File
@@ -703,7 +703,7 @@ updateRoomEventss(roomId, collection:string, funx: Function, ) {
this.wsMsgQueue[requestId] = {message, requestId, loginRequired}
} else {
let messageStr = JSON.stringify(message)
// console.log('messageStr', messageStr)
console.log('messageStr', messageStr)
this.socket.send(messageStr)
}
src/assets/icon/theme/default/icons-chat-record-audio.svg
+8
View File
@@ -0,0 +1,8 @@
<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.5 45C34.9264 45 45 34.9264 45 22.5C45 10.0736 34.9264 0 22.5 0C10.0736 0 0 10.0736 0 22.5C0 34.9264 10.0736 45 22.5 45Z" fill="#42B9FE"/>
<path d="M27.7273 12.7273C27.7273 9.56419 25.1631 7 22 7C18.8369 7 16.2727 9.56419 16.2727 12.7273V20.9091C16.2727 24.0722 18.8369 26.6364 22 26.6364C25.1631 26.6364 27.7273 24.0722 27.7273 20.9091V12.7273Z" stroke="white" stroke-width="2"/>
<path d="M26.0909 11.9091H24.4545C23.5508 11.9091 22.8182 12.6417 22.8182 13.5455C22.8182 14.4492 23.5508 15.1818 24.4545 15.1818H26.0909C26.9946 15.1818 27.7273 14.4492 27.7273 13.5455C27.7273 12.6417 26.9946 11.9091 26.0909 11.9091Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.1818 29.9091H22.8182V36.4545H21.1818V29.9091Z" fill="white"/>
<path d="M26.9091 36.4545H17.0909C16.639 36.4545 16.2727 36.8209 16.2727 37.2727C16.2727 37.7246 16.639 38.0909 17.0909 38.0909H26.9091C27.3609 38.0909 27.7273 37.7246 27.7273 37.2727C27.7273 36.8209 27.3609 36.4545 26.9091 36.4545Z" fill="white"/>
<path d="M31 19.2727C31 25.3731 28.7778 29.9091 22 29.9091C15.2222 29.9091 13 25.3731 13 19.2727" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

src/assets/icon/theme/gov/icons-chat-record-audio.svg
+8
View File
@@ -0,0 +1,8 @@
<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.5 45C34.9264 45 45 34.9264 45 22.5C45 10.0736 34.9264 0 22.5 0C10.0736 0 0 10.0736 0 22.5C0 34.9264 10.0736 45 22.5 45Z" fill="#FFB81C"/>
<path d="M27.7273 12.7273C27.7273 9.56419 25.1631 7 22 7C18.8369 7 16.2727 9.56419 16.2727 12.7273V20.9091C16.2727 24.0722 18.8369 26.6364 22 26.6364C25.1631 26.6364 27.7273 24.0722 27.7273 20.9091V12.7273Z" stroke="white" stroke-width="2"/>
<path d="M26.0909 11.9091H24.4545C23.5508 11.9091 22.8182 12.6417 22.8182 13.5455C22.8182 14.4492 23.5508 15.1818 24.4545 15.1818H26.0909C26.9946 15.1818 27.7273 14.4492 27.7273 13.5455C27.7273 12.6417 26.9946 11.9091 26.0909 11.9091Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.1818 29.9091H22.8182V36.4545H21.1818V29.9091Z" fill="white"/>
<path d="M26.9091 36.4546H17.0909C16.639 36.4546 16.2727 36.8209 16.2727 37.2727C16.2727 37.7246 16.639 38.0909 17.0909 38.0909H26.9091C27.3609 38.0909 27.7273 37.7246 27.7273 37.2727C27.7273 36.8209 27.3609 36.4546 26.9091 36.4546Z" fill="white"/>
<path d="M31 19.2727C31 25.3731 28.7778 29.9091 22 29.9091C15.2222 29.9091 13 25.3731 13 19.2727" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

src/assets/images/theme/gov/icons-chat-record-audio.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.5 45C34.9264 45 45 34.9264 45 22.5C45 10.0736 34.9264 0 22.5 0C10.0736 0 0 10.0736 0 22.5C0 34.9264 10.0736 45 22.5 45Z" fill="#FFB81C"/>
<path d="M22.25 26.5C24.7358 26.5 26.75 24.4858 26.75 22V14.5C26.75 12.0142 24.7358 10 22.25 10C19.7642 10 17.75 12.0142 17.75 14.5V22C17.75 24.4844 19.7234 26.5 22.25 26.5ZM29.375 19C28.7516 19 28.25 19.5016 28.25 20.0828V22C28.25 25.4373 25.3452 28.2063 21.8609 27.9859C18.7634 27.7905 16.25 24.8645 16.25 21.7609V20.0828C16.25 19.5016 15.7461 19 15.125 19C14.5039 19 14 19.5016 14 20.0828V21.5898C14 25.7927 16.9986 29.5398 21.125 30.107V31.75H19.25C18.3973 31.75 17.7106 32.4616 17.7519 33.3236C17.7702 33.7094 18.1156 34 18.5 34H26C26.3854 34 26.7298 33.7086 26.7481 33.3236C26.7875 32.4625 26.1031 31.75 25.25 31.75H23.375V30.167C27.3922 29.6172 30.5 26.1672 30.5 22V20.0828C30.5 19.5016 29.9984 19 29.375 19Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 986 B