peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-21 05:45:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

save

Browse Source
This commit is contained in:
tiago.kayaya
2021-12-08 20:27:05 +01:00
parent f7add4dfa5
commit 89c3db663b
4 changed files with 44 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/chat/group-messages/group-messages.page.html
+4 -2
View File
@@ -57,7 +57,7 @@
<ion-label>A conversa original mantêm-se como chat individual</ion-label> <ion-label>A conversa original mantêm-se como chat individual</ion-label>
</div> </div>
<div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last" [class.messages-list-item-wrapper-active]="msg._id == selectedMsgId"> <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last" [class.messages-list-item-wrapper-active]="msg._id == selectedMsgId">
<div *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru'" (press)="handlePress(msg._id)" class='message-container incoming-{{msg.u.username!=loggedUser.me.username}}' (click)="openPreview(msg)"> <div *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru'" (press)="handlePress(msg._id)" class='message-container incoming-{{msg.u.username!=loggedUser.me.username}}'>
<div class="title"> <div class="title">
<ion-label>{{msg.u.name}}</ion-label> <ion-label>{{msg.u.name}}</ion-label>
<span class="time">{{showDateDuration(msg._updatedAt)}}</span> <span class="time">{{showDateDuration(msg._updatedAt)}}</span>
@@ -66,7 +66,9 @@
<ion-label>{{msg.msg}}</ion-label> <ion-label>{{msg.msg}}</ion-label>
<div *ngIf="msg.attachments" class="message-attachments"> <div *ngIf="msg.attachments" class="message-attachments">
<div *ngFor="let file of msg.attachments"> <div *ngFor="let file of msg.attachments">
<img *ngIf="file.image_url" src="{{file.image_url}}" alt="image" > <div (click)="openPreview(msg)">
<img *ngIf="file.image_url" src="{{file.image_url}}" alt="image" >
</div>
<div> <div>
<div> <div>
<div class="file"> <div class="file">
src/app/pages/chat/group-messages/group-messages.page.ts
+15 -14
View File
@@ -21,6 +21,7 @@ import { EventPerson } from 'src/app/models/eventperson.model';
import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page'; import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
import { ThemeService } from 'src/app/services/theme.service' import { ThemeService } from 'src/app/services/theme.service'
import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page'; import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
@Component({ @Component({
selector: 'app-group-messages', selector: 'app-group-messages',
@@ -29,7 +30,7 @@ import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.
}) })
export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy { export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
showLoader: boolean; showLoader: boolean;
isGroupCreated:boolean; isGroupCreated:boolean;
@@ -593,7 +594,7 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
}; };
zoomActive = false; zoomActive = false;
zoomScale = 1; zoomScale = 1;
sliderZoomOpts = { sliderZoomOpts = {
allowSlidePrev: false, allowSlidePrev: false,
allowSlideNext: false, allowSlideNext: false,
@@ -601,40 +602,40 @@ sliderZoomOpts = {
maxRatio: 5 maxRatio: 5
}, },
on: { on: {
zoomChange: (scale, imageEl, slideEl) => { zoomChange: (scale, imageEl, slideEl) => {
this.zoomActive = true; this.zoomActive = true;
this.zoomScale = scale/5; this.zoomScale = scale/5;
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
} }
} }
} }
async touchEnd(zoomslides: IonSlides, card) { async touchEnd(zoomslides: IonSlides, card) {
// Zoom back to normal // Zoom back to normal
const slider = await zoomslides.getSwiper(); const slider = await zoomslides.getSwiper();
const zoom = slider.zoom; const zoom = slider.zoom;
zoom.out(); zoom.out();
// Card back to normal // Card back to normal
card.el.style['z-index'] = 9; card.el.style['z-index'] = 9;
this.zoomActive = false; this.zoomActive = false;
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
} }
touchStart(card) { touchStart(card) {
// Make card appear above backdrop // Make card appear above backdrop
card.el.style['z-index'] = 11; card.el.style['z-index'] = 11;
} }
async openPreview(img) { async openPreview(msg) {
const modal = await this.modalController.create({ const modal = await this.modalController.create({
component: PreviewCameraPage, component: ViewMediaPage,
cssClass: 'transparent-modal', cssClass: 'modal modal-desktop',
componentProps: { componentProps: {
image: img.attachments[0].image_url, image: msg.attachments[0].image_url,
username: img.u.name, username: msg.u.name,
_updatedAt: img._updatedAt _updatedAt: msg._updatedAt,
} }
}); });
modal.present(); modal.present();
src/app/shared/chat/group-messages/group-messages.page.html
+4 -2
View File
@@ -44,7 +44,7 @@
<ion-label>A conversa original mantêm-se como chat individual</ion-label> <ion-label>A conversa original mantêm-se como chat individual</ion-label>
</div> </div>
<div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last" (click)="openPreview(msg)"> <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" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru'" > <div class="message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru'" >
<div class="message-item-options d-flex justify-content-end"> <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> <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon>
@@ -60,7 +60,9 @@
<ion-label>{{msg.msg}}</ion-label> <ion-label>{{msg.msg}}</ion-label>
<div *ngIf="msg.attachments" class="message-attachments"> <div *ngIf="msg.attachments" class="message-attachments">
<div *ngFor="let file of msg.attachments"> <div *ngFor="let file of msg.attachments">
<img *ngIf="file.image_url" src="{{file.image_url}}" alt="image"> <div (click)="openPreview(msg)">
<img *ngIf="file.image_url" src="{{file.image_url}}" alt="image">
</div>
<div> <div>
<div> <div>
<div class="file"> <div class="file">
src/app/shared/chat/group-messages/group-messages.page.ts
+21 -20
View File
@@ -20,6 +20,7 @@ import { FileService } from 'src/app/services/functions/file.service';
import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page'; import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
import { ThemeService } from 'src/app/services/theme.service' import { ThemeService } from 'src/app/services/theme.service'
import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page'; import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
/* /*
import * as pdfjsLib from 'pdfjs-dist'; import * as pdfjsLib from 'pdfjs-dist';
@@ -769,7 +770,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
} }
} }
sliderOpts = { sliderOpts = {
zoom: false, zoom: false,
slidesPerView: 1.5, slidesPerView: 1.5,
@@ -778,7 +779,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
}; };
zoomActive = false; zoomActive = false;
zoomScale = 1; zoomScale = 1;
sliderZoomOpts = { sliderZoomOpts = {
allowSlidePrev: false, allowSlidePrev: false,
allowSlideNext: false, allowSlideNext: false,
@@ -786,44 +787,44 @@ sliderZoomOpts = {
maxRatio: 5 maxRatio: 5
}, },
on: { on: {
zoomChange: (scale, imageEl, slideEl) => { zoomChange: (scale, imageEl, slideEl) => {
this.zoomActive = true; this.zoomActive = true;
this.zoomScale = scale/5; this.zoomScale = scale/5;
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
} }
} }
} }
async touchEnd(zoomslides: IonSlides, card) { async touchEnd(zoomslides: IonSlides, card) {
// Zoom back to normal // Zoom back to normal
const slider = await zoomslides.getSwiper(); const slider = await zoomslides.getSwiper();
const zoom = slider.zoom; const zoom = slider.zoom;
zoom.out(); zoom.out();
// Card back to normal // Card back to normal
card.el.style['z-index'] = 9; card.el.style['z-index'] = 9;
this.zoomActive = false; this.zoomActive = false;
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
} }
touchStart(card) { touchStart(card) {
// Make card appear above backdrop // Make card appear above backdrop
card.el.style['z-index'] = 11; card.el.style['z-index'] = 11;
} }
async openPreview(img) { async openPreview(msg) {
const modal = await this.modalController.create({ const modal = await this.modalController.create({
component: PreviewCameraPage, component: ViewMediaPage,
cssClass: 'transparent-modal', cssClass: 'modal modal-desktop',
componentProps: { componentProps: {
image: img.attachments[0].image_url, image: msg.attachments[0].image_url,
username: img.u.username, username: msg.u.name,
_updatedAt: img._updatedAt _updatedAt: msg._updatedAt,
} }
}); });
modal.present(); modal.present();
} }
} }