+ in group!
diff --git a/src/app/pages/chat/group-messages/group-messages.page.scss b/src/app/pages/chat/group-messages/group-messages.page.scss
index f0d364001..c08d1b385 100644
--- a/src/app/pages/chat/group-messages/group-messages.page.scss
+++ b/src/app/pages/chat/group-messages/group-messages.page.scss
@@ -278,3 +278,36 @@
}
}
+.preview-slides {
+ margin-top: 20%;
+ background: #e6e6e6;
+
+ img {
+ padding-top: 20px;
+ padding-bottom: 20px;
+ }
+}
+
+.transparent-modal {
+ .modal-wrapper {
+ --background: rgba(44, 39, 45, 0.2);
+ }
+}
+
+
+.image-slide,
+.image-card {
+ overflow: visible;
+}
+
+.image-card {
+ z-index: 9;
+}
+
+.backdrop {
+ height: 200%;
+ width: 100%;
+ background: black;
+ position: absolute;
+ z-index: 10;
+}
\ No newline at end of file
diff --git a/src/app/pages/chat/group-messages/group-messages.page.ts b/src/app/pages/chat/group-messages/group-messages.page.ts
index b89e7e8b1..4723e3af3 100644
--- a/src/app/pages/chat/group-messages/group-messages.page.ts
+++ b/src/app/pages/chat/group-messages/group-messages.page.ts
@@ -1,5 +1,5 @@
-import { Component, ElementRef, OnInit, ViewChild, AfterViewChecked, AfterViewInit, OnDestroy, } from '@angular/core';
-import { ActionSheetController, MenuController, ModalController, NavParams, PopoverController } from '@ionic/angular';
+import { Component, ElementRef, OnInit, ViewChild, AfterViewChecked, AfterViewInit, OnDestroy, ChangeDetectorRef, } from '@angular/core';
+import { ActionSheetController, IonSlides, MenuController, ModalController, NavParams, PopoverController } from '@ionic/angular';
import { AlertService } from 'src/app/services/alert.service';
import { AuthService } from 'src/app/services/auth.service';
import { ChatService } from 'src/app/services/chat.service';
@@ -20,6 +20,7 @@ import { NewEventPage } from '../../agenda/new-event/new-event.page';
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';
@Component({
selector: 'app-group-messages',
@@ -27,6 +28,8 @@ import { ThemeService } from 'src/app/services/theme.service'
styleUrls: ['./group-messages.page.scss'],
})
export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
+
+
showLoader: boolean;
isGroupCreated:boolean;
loggedUser: any;
@@ -75,7 +78,8 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
private fileToBase64Service: FileToBase64Service,
private fileService: FileService,
private toastService: ToastService,
- public ThemeService: ThemeService
+ public ThemeService: ThemeService,
+ private changeDetectorRef: ChangeDetectorRef
) {
this.loggedUserChat = authService.ValidatedUserChat['data'];
this.isGroupCreated = true;
@@ -580,4 +584,59 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
});
}
+ sliderOpts = {
+ zoom: false,
+ slidesPerView: 1.5,
+ spaceBetween: 20,
+ centeredSlides: true
+ };
+ zoomActive = false;
+zoomScale = 1;
+
+sliderZoomOpts = {
+ allowSlidePrev: false,
+ allowSlideNext: false,
+ zoom: {
+ maxRatio: 5
+ },
+ on: {
+ zoomChange: (scale, imageEl, slideEl) => {
+ this.zoomActive = true;
+ this.zoomScale = scale/5;
+ 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();
+ }
+}
+
diff --git a/src/app/pages/chat/messages/messages.page.html b/src/app/pages/chat/messages/messages.page.html
index d97245b37..c58a2984a 100644
--- a/src/app/pages/chat/messages/messages.page.html
+++ b/src/app/pages/chat/messages/messages.page.html
@@ -50,8 +50,8 @@
-->
-
+ [class.messages-list-item-wrapper-active]="msg._id == selectedMsgId" >
+
{{msg.u.name}}
{{showDateDuration(msg._updatedAt)}}
@@ -138,6 +138,7 @@
-->
+ aqui
+ in message!
diff --git a/src/app/pages/chat/messages/messages.page.ts b/src/app/pages/chat/messages/messages.page.ts
index 7d14e8fcd..48f1a3ce0 100644
--- a/src/app/pages/chat/messages/messages.page.ts
+++ b/src/app/pages/chat/messages/messages.page.ts
@@ -1,6 +1,6 @@
-import { AfterViewChecked, AfterViewInit, Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';
+import { AfterViewChecked, AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router'
-import { GestureController, Gesture, ModalController, NavParams, PopoverController } from '@ionic/angular';
+import { GestureController, Gesture, ModalController, NavParams, PopoverController, IonSlides } from '@ionic/angular';
import { map } from 'rxjs/operators';
import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
import { EventPerson } from 'src/app/models/eventperson.model';
@@ -23,6 +23,7 @@ import { ThemeService } from 'src/app/services/theme.service'
import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';
import { VoiceRecorder, VoiceRecorderPlugin, RecordingData, GenericResponse, CurrentRecordingStatus } from 'capacitor-voice-recorder';
import { Haptics, ImpactStyle } from '@capacitor/haptics';
+import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
@Component({
selector: 'app-messages',
@@ -83,7 +84,8 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
private fileService: FileService,
private gestureController: GestureController,
private processes: ProcessesService,
- public ThemeService: ThemeService
+ public ThemeService: ThemeService,
+ private changeDetectorRef: ChangeDetectorRef
) {
this.loggedUser = authService.ValidatedUserChat['data'];
this.roomId = this.navParams.get('roomId');
@@ -583,4 +585,62 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
});
}
+
+ sliderOpts = {
+ zoom: false,
+ slidesPerView: 1.5,
+ spaceBetween: 20,
+ centeredSlides: true
+ };
+ zoomActive = false;
+zoomScale = 1;
+
+sliderZoomOpts = {
+ allowSlidePrev: false,
+ allowSlideNext: false,
+ zoom: {
+ maxRatio: 5
+ },
+ on: {
+ zoomChange: (scale, imageEl, slideEl) => {
+ this.zoomActive = true;
+ this.zoomScale = scale/5;
+ 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(msg) {
+ const modal = await this.modalController.create({
+ component: PreviewCameraPage,
+ cssClass: 'transparent-modal',
+ componentProps: {
+ image: msg.attachments[0].image_url,
+ username: msg.u.username,
+ _updatedAt: msg._updatedAt
+ }
+ });
+ modal.present();
+ }
+}
+
+
+
diff --git a/src/app/pages/publications/new-publication/new-publication.page.html b/src/app/pages/publications/new-publication/new-publication.page.html
index 12d8f8f4a..849117875 100644
--- a/src/app/pages/publications/new-publication/new-publication.page.html
+++ b/src/app/pages/publications/new-publication/new-publication.page.html
@@ -29,7 +29,7 @@
-
+
@@ -58,7 +58,7 @@
-
+
@@ -79,7 +79,7 @@
Anexar Fotografia
-
+
diff --git a/src/app/pages/publications/new-publication/new-publication.page.ts b/src/app/pages/publications/new-publication/new-publication.page.ts
index 5eb6b7c7d..ecb65e0df 100644
--- a/src/app/pages/publications/new-publication/new-publication.page.ts
+++ b/src/app/pages/publications/new-publication/new-publication.page.ts
@@ -1,5 +1,5 @@
-import { Component, OnInit } from '@angular/core';
-import { ModalController, NavParams, Platform, LoadingController } from '@ionic/angular';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { ModalController, NavParams, Platform, LoadingController, IonSlides } from '@ionic/angular';
/* import {Plugins, CameraResultType, CameraSource} from '@capacitor/core'; */
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
@@ -19,6 +19,7 @@ import { ThemeService } from 'src/app/services/theme.service';
import { Camera, CameraResultType, CameraSource, Photo } from '@capacitor/camera';
import { Filesystem, Directory } from '@capacitor/filesystem';
+import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
const IMAGE_DIR = 'stored-images';
@@ -35,6 +36,9 @@ interface LocalFile {
export class NewPublicationPage implements OnInit {
images: LocalFile[] = [];
+ files: Set
;
+ photos: any[] = [];
+
// date picker
public date: any;
public disabled = false;
@@ -70,7 +74,7 @@ export class NewPublicationPage implements OnInit {
capturedImage: any = '';
capturedImageTitle: any;
- public photos: any[] = [];
+ // public photos: any[] = [];
constructor(
private modalController: ModalController,
@@ -83,6 +87,7 @@ export class NewPublicationPage implements OnInit {
public ThemeService: ThemeService,
private platform: Platform,
private loadingCtrl: LoadingController,
+ private changeDetectorRef: ChangeDetectorRef
) {
this.publicationType = this.navParams.get('publicationType');
@@ -98,6 +103,7 @@ export class NewPublicationPage implements OnInit {
directory: Directory.Data,
recursive: true
});
+ this.loadPicture()
// this.takePicture();
}
@@ -116,7 +122,7 @@ export class NewPublicationPage implements OnInit {
}
- convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
+ convertBlobToBase64s = (blob: Blob) => new Promise((resolve, reject) => {
const reader = new FileReader;
reader.onerror = reject;
reader.onload = () => {
@@ -143,7 +149,7 @@ export class NewPublicationPage implements OnInit {
webviewPath: capturedImage.webPath
});
- this.capturedImage = await this.convertBlobToBase64(blob);
+ this.capturedImage = await this.convertBlobToBase64s(blob);
this.capturedImageTitle = new Date().getTime() + '.jpeg';
}
@@ -388,18 +394,18 @@ private async savePicture(photo: Photo) {
console.log(this.pub, 'pub')
}
}
+// async openGallery() {
+// const modal = await this.modalController.create({
+// component: GalleryPage,
+// componentProps:{
+// },
+// cssClass: 'new-publication',
+// backdropDismiss: false
+// });
+// await modal.present();
+// modal.onDidDismiss();
+// }
- /* async openGallery() {
- const modal = await this.modalController.create({
- component: GalleryPage,
- componentProps:{
- },
- cssClass: 'new-publication',
- backdropDismiss: false
- });
- await modal.present();
- modal.onDidDismiss();
- } */
/* async takePicture(){
const image = await Plugins.Camera.getPhoto({
@@ -511,4 +517,121 @@ private async savePicture(photo: Photo) {
this.capturedImage = this.images[0].data
//}
}
+
+ sliderOpts = {
+ zoom: false,
+ slidesPerView: 1.5,
+ spaceBetween: 20,
+ centeredSlides: true
+ };
+ zoomActive = false;
+zoomScale = 1;
+
+sliderZoomOpts = {
+ allowSlidePrev: false,
+ allowSlideNext: false,
+ zoom: {
+ maxRatio: 5
+ },
+ on: {
+ zoomChange: (scale, imageEl, slideEl) => {
+ this.zoomActive = true;
+ this.zoomScale = scale/5;
+ 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(photo) {
+ const modal = await this.modalController.create({
+ component: PreviewCameraPage,
+ cssClass: 'transparent-modal',
+ componentProps: {
+ image: photo.attachments[0].image_url,
+ username: photo.u.username,
+ _updatedAt: photo._updatedAt
+ }
+ });
+ modal.present();
+ }
+
+ async takePictures() {
+ const capturedImage = await Camera.getPhoto({
+ quality: 90,
+ // allowEditing: true,
+ resultType: CameraResultType.Uri,
+ source: CameraSource.Camera
+
+ });
+ const response = await fetch(capturedImage.webPath!);
+ const blob = await response.blob();
+
+ this.photos.unshift({
+ filepath: "soon...",
+ webviewPath: capturedImage.webPath
+ });
+
+ this.capturedImage = await this.convertBlobToBase64(blob);
+ this.capturedImageTitle = new Date().getTime() + '.jpeg';
+
+ let data = {
+ image:this.capturedImage,
+ name: this.capturedImageTitle
+ }
+
+ return data;
+ alert(data)
+ }
+
+ convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
+ const reader = new FileReader;
+ reader.onerror = reject;
+ reader.onload = () => {
+ resolve(reader.result);
+ };
+ reader.readAsDataURL(blob);
+ });
+
+ loadPicture() {
+ const input = this.fileLoaderService.createInput({
+ accept: ['image/apng', 'image/jpeg', 'image/png']
+ })
+
+ input.onchange = async () => {
+ const file = this.fileLoaderService.getFirstFile(input)
+
+ console.log(file);
+
+ const imageData = await this.fileToBase64Service.convert(file)
+ this.capturedImage = imageData;
+ this.capturedImageTitle = file.name;
+
+ let data = {
+ image:this.capturedImage,
+ name: this.capturedImageTitle
+ }
+
+ return data;
+
+ console.log(data)
+ };
+ }
}