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
@@ -57,7 +57,7 @@
<ion-label>A conversa original mantêm-se como chat individual</ion-label>
</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 *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">
<ion-label>{{msg.u.name}}</ion-label>
<span class="time">{{showDateDuration(msg._updatedAt)}}</span>
@@ -66,7 +66,9 @@
<ion-label>{{msg.msg}}</ion-label>
<div *ngIf="msg.attachments" class="message-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 class="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 { 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';
@Component({
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 {
showLoader: boolean;
isGroupCreated:boolean;
@@ -593,7 +594,7 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
};
zoomActive = false;
zoomScale = 1;
sliderZoomOpts = {
allowSlidePrev: false,
allowSlideNext: false,
@@ -601,40 +602,40 @@ sliderZoomOpts = {
maxRatio: 5
},
on: {
zoomChange: (scale, imageEl, slideEl) => {
zoomChange: (scale, imageEl, slideEl) => {
this.zoomActive = true;
this.zoomScale = scale/5;
this.changeDetectorRef.detectChanges();
this.changeDetectorRef.detectChanges();
}
}
}
async touchEnd(zoomslides: IonSlides, card) {
// Zoom back to normal
const slider = await zoomslides.getSwiper();
const zoom = slider.zoom;
zoom.out();
// Card back to normal
card.el.style['z-index'] = 9;
this.zoomActive = false;
this.changeDetectorRef.detectChanges();
}
touchStart(card) {
// Make card appear above backdrop
card.el.style['z-index'] = 11;
}
async openPreview(img) {
async openPreview(msg) {
const modal = await this.modalController.create({
component: PreviewCameraPage,
cssClass: 'transparent-modal',
component: ViewMediaPage,
cssClass: 'modal modal-desktop',
componentProps: {
image: img.attachments[0].image_url,
username: img.u.name,
_updatedAt: img._updatedAt
image: msg.attachments[0].image_url,
username: msg.u.name,
_updatedAt: msg._updatedAt,
}
});
modal.present();
@@ -44,7 +44,7 @@
<ion-label>A conversa original mantêm-se como chat individual</ion-label>
</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-options d-flex justify-content-end">
<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>
<div *ngIf="msg.attachments" class="message-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 class="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 { 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 * as pdfjsLib from 'pdfjs-dist';
@@ -769,7 +770,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
}
}
sliderOpts = {
zoom: false,
slidesPerView: 1.5,
@@ -778,7 +779,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
};
zoomActive = false;
zoomScale = 1;
sliderZoomOpts = {
allowSlidePrev: false,
allowSlideNext: false,
@@ -786,44 +787,44 @@ sliderZoomOpts = {
maxRatio: 5
},
on: {
zoomChange: (scale, imageEl, slideEl) => {
zoomChange: (scale, imageEl, slideEl) => {
this.zoomActive = true;
this.zoomScale = scale/5;
this.changeDetectorRef.detectChanges();
this.changeDetectorRef.detectChanges();
}
}
}
async touchEnd(zoomslides: IonSlides, card) {
// Zoom back to normal
const slider = await zoomslides.getSwiper();
const zoom = slider.zoom;
zoom.out();
// Card back to normal
card.el.style['z-index'] = 9;
this.zoomActive = false;
this.changeDetectorRef.detectChanges();
}
touchStart(card) {
// Make card appear above backdrop
card.el.style['z-index'] = 11;
}
async openPreview(img) {
const modal = await this.modalController.create({
component: PreviewCameraPage,
cssClass: 'transparent-modal',
componentProps: {
image: img.attachments[0].image_url,
username: img.u.username,
_updatedAt: img._updatedAt
}
});
modal.present();
}
async openPreview(msg) {
const modal = await this.modalController.create({
component: ViewMediaPage,
cssClass: 'modal modal-desktop',
componentProps: {
image: msg.attachments[0].image_url,
username: msg.u.name,
_updatedAt: msg._updatedAt,
}
});
modal.present();
}
}