mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Merge branch 'developer' of bitbucket.org:equilibriumito/gabinete-digital into developer
This commit is contained in:
Peter Maquiran
@@ -203,6 +203,14 @@ const routes = [
|
||||
{
|
||||
path: 'event-details-documents-options',
|
||||
loadChildren: () => import('./shared/popover/event-details-documents-options/event-details-documents-options.module').then( m => m.EventDetailsDocumentsOptionsPageModule)
|
||||
},
|
||||
{
|
||||
path: 'preview-camera',
|
||||
loadChildren: () => import('./modals/preview-camera/preview-camera.module').then( m => m.PreviewCameraPageModule)
|
||||
},
|
||||
{
|
||||
path: 'group-icons',
|
||||
loadChildren: () => import('./modals/group-icons/group-icons.module').then( m => m.GroupIconsPageModule)
|
||||
},
|
||||
|
||||
|
||||
|
||||
@@ -36,6 +36,7 @@ import {MAT_DATE_FORMATS, MAT_DATE_LOCALE} from '@angular/material/core';
|
||||
import { NgxMatDateFormats, NGX_MAT_DATE_FORMATS } from '@angular-material-components/datetime-picker';
|
||||
import { Network } from '@ionic-native/network/ngx';
|
||||
import { File } from '@ionic-native/file/ngx';
|
||||
import { ImageCropperModule } from 'ngx-image-cropper';
|
||||
|
||||
|
||||
import {
|
||||
@@ -65,6 +66,7 @@ import { Media } from '@ionic-native/media/ngx';
|
||||
import { StreamingMedia } from '@ionic-native/streaming-media/ngx';
|
||||
import { PhotoViewer } from '@ionic-native/photo-viewer/ngx';
|
||||
|
||||
|
||||
/* import { FCM } from '@ionic-native/fcm/ngx';
|
||||
import { FirebaseX } from '@ionic-native/firebase-x/ngx'; */
|
||||
//import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx';
|
||||
@@ -102,6 +104,8 @@ import { FirebaseX } from '@ionic-native/firebase-x/ngx'; */
|
||||
//
|
||||
PdfViewerModule,
|
||||
HammerModule,
|
||||
|
||||
|
||||
],
|
||||
providers: [
|
||||
{ provide: MAT_DATE_LOCALE, useValue: 'pt' },
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { GroupIconsPage } from './group-icons.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: GroupIconsPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class GroupIconsPageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { GroupIconsPageRoutingModule } from './group-icons-routing.module';
|
||||
|
||||
import { GroupIconsPage } from './group-icons.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
GroupIconsPageRoutingModule
|
||||
],
|
||||
declarations: [GroupIconsPage]
|
||||
})
|
||||
export class GroupIconsPageModule {}
|
||||
@@ -0,0 +1,31 @@
|
||||
<ion-card >
|
||||
<ion-card-content >
|
||||
<ion-row>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="removerIcone()" fill="clear" color="light">
|
||||
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
|
||||
<ion-icon class="redla" name="trash-outline"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="openGaleria()" fill="clear" color="light">
|
||||
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
|
||||
<ion-icon class="redla" name="flower-outline"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="OpenCamera()" fill="clear" color="light">
|
||||
|
||||
<ion-icon class="redla" name="camera-outline"></ion-icon>
|
||||
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="pesquizarWeb()" fill="clear" color="light">
|
||||
<ion-icon class="redla" name="search-outline"></ion-icon>
|
||||
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { GroupIconsPage } from './group-icons.page';
|
||||
|
||||
describe('GroupIconsPage', () => {
|
||||
let component: GroupIconsPage;
|
||||
let fixture: ComponentFixture<GroupIconsPage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ GroupIconsPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(GroupIconsPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,38 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { IonSlides, ModalController, NavParams } from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'app-group-icons',
|
||||
templateUrl: './group-icons.page.html',
|
||||
styleUrls: ['./group-icons.page.scss'],
|
||||
})
|
||||
export class GroupIconsPage implements OnInit {
|
||||
|
||||
constructor( private modalController: ModalController,
|
||||
private navParams:NavParams) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
removerIcone(){
|
||||
|
||||
}
|
||||
openGaleria(){
|
||||
|
||||
}
|
||||
OpenCamera(){
|
||||
|
||||
}
|
||||
pesquizarWeb(){
|
||||
|
||||
}
|
||||
|
||||
dismiss() {
|
||||
// using the injected ModalController this page
|
||||
// can "dismiss" itself and optionally pass back data
|
||||
this.modalController.dismiss({
|
||||
'dismissed': true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { PreviewCameraPage } from './preview-camera.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: PreviewCameraPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class PreviewCameraPageRoutingModule {}
|
||||
@@ -0,0 +1,22 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { PreviewCameraPageRoutingModule } from './preview-camera-routing.module';
|
||||
|
||||
import { PreviewCameraPage } from './preview-camera.page';
|
||||
import { ImageCropperModule } from 'ngx-image-cropper';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
ImageCropperModule,
|
||||
PreviewCameraPageRoutingModule
|
||||
],
|
||||
declarations: [PreviewCameraPage]
|
||||
})
|
||||
export class PreviewCameraPageModule {}
|
||||
@@ -0,0 +1,55 @@
|
||||
<ion-card >
|
||||
|
||||
<ion-card-content >
|
||||
<ion-card-header >
|
||||
<ion-toolbar>
|
||||
|
||||
{{username}} <span>{{_updatedAt}}</span>
|
||||
|
||||
|
||||
</ion-toolbar>
|
||||
</ion-card-header>
|
||||
|
||||
<img src="{{image}}" />
|
||||
|
||||
</ion-card-content>
|
||||
<!-- <image-cropper [imageBase64]="myimage"
|
||||
[maintainAspectRatio]="true"
|
||||
[aspectRatio]="4 / 3"
|
||||
outputType = "base64"
|
||||
format="png"
|
||||
[resizeToWidth]="true"
|
||||
(imageCropped)="imageCropped($event)"
|
||||
|
||||
></image-cropper> -->
|
||||
|
||||
<ion-footer>
|
||||
<ion-row>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="zoom(false)" fill="clear" color="light">
|
||||
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
|
||||
<ion-icon class="redla" name="chatbox-outline"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="zoom(false)" fill="clear" color="light">
|
||||
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
|
||||
<ion-icon class="redla" name="call-outline"></ion-icon>
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="close()" fill="clear" color="light">
|
||||
|
||||
<ion-icon class="redla" name="close-circle-outline"></ion-icon>
|
||||
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
<ion-col size="3" class="ion-text-center">
|
||||
<ion-button (click)="zoom(true)" fill="clear" color="light">
|
||||
<ion-icon class="redla" name="alert-circle-outline"></ion-icon>
|
||||
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-footer>
|
||||
</ion-card>
|
||||
@@ -0,0 +1,22 @@
|
||||
|
||||
|
||||
ion-content {
|
||||
--background:black;
|
||||
--color: red;
|
||||
}
|
||||
|
||||
ion-footer {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
ion-slides {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.redla{
|
||||
|
||||
color: rgb(255, 38, 0);
|
||||
// background-color: rgb(255, 72, 0);
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { PreviewCameraPage } from './preview-camera.page';
|
||||
|
||||
describe('PreviewCameraPage', () => {
|
||||
let component: PreviewCameraPage;
|
||||
let fixture: ComponentFixture<PreviewCameraPage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ PreviewCameraPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(PreviewCameraPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,72 @@
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { IonSlides, ModalController, NavParams } from '@ionic/angular';
|
||||
import { ImageCroppedEvent } from 'ngx-image-cropper';
|
||||
import { GroupIconsPage } from '../group-icons/group-icons.page';
|
||||
|
||||
@Component({
|
||||
selector: 'app-preview-camera',
|
||||
templateUrl: './preview-camera.page.html',
|
||||
styleUrls: ['./preview-camera.page.scss'],
|
||||
})
|
||||
export class PreviewCameraPage implements OnInit {
|
||||
|
||||
constructor( private modalController: ModalController,
|
||||
private navParams:NavParams) { }
|
||||
|
||||
|
||||
@ViewChild(IonSlides) slides : IonSlides
|
||||
image: any;
|
||||
username: string
|
||||
_updatedAt: string
|
||||
|
||||
|
||||
// myimage: null
|
||||
// croppedImageBase64: any
|
||||
|
||||
// @Input('img') img: any
|
||||
// @Input() username: string;
|
||||
// @Input() date: string;
|
||||
|
||||
slideOpts = {
|
||||
zoom: true
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.image = this.navParams.get('image')
|
||||
this.username = this.navParams.get('username')
|
||||
this._updatedAt = this.navParams.get('_updatedAt')
|
||||
console.log(this.image)
|
||||
// this.image = this.myimage
|
||||
}
|
||||
|
||||
ionViewDidEnter(){
|
||||
this.slides.update()
|
||||
}
|
||||
|
||||
async zoom(zoomIn: boolean){
|
||||
const slider = await this.slides.getSwiper() //is swipper =!
|
||||
const zoom = slider.zoom
|
||||
zoomIn ? zoom.in(): zoom.out()
|
||||
}
|
||||
|
||||
close(){
|
||||
this.modalController.dismiss()
|
||||
}
|
||||
|
||||
// imageCropped(ev: ImageCroppedEvent){
|
||||
// this.croppedImageBase64 = ev.base64
|
||||
// }
|
||||
|
||||
|
||||
// async grupo(){
|
||||
// const modal = await this.modalController.create({
|
||||
// component: GroupIconsPage,
|
||||
// cssClass: 'transparent-modal',
|
||||
// });
|
||||
// modal.present();
|
||||
// }
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -29,6 +29,7 @@ import { HeaderPageModule } from 'src/app/shared/header/header.module';
|
||||
import { NewEventPageModule } from 'src/app/shared/agenda/new-event/new-event.module';
|
||||
import { AttendeeModalPageModule } from 'src/app/shared/event/attendee-modal/attendee-modal.module';
|
||||
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
import { ImageCropperModule } from 'ngx-image-cropper';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -48,6 +49,7 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
GroupContactsPageModule,
|
||||
EmptyChatPageModule,
|
||||
NewEventPageModule,
|
||||
ImageCropperModule,
|
||||
AttendeeModalPageModule,
|
||||
],
|
||||
declarations: [
|
||||
|
||||
@@ -125,6 +125,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</ion-item-sliding>
|
||||
am i here?!
|
||||
</ion-list>
|
||||
</div>
|
||||
<!-- <button (click)="sendMsg()" style="height: 41px;">Send message</button> -->
|
||||
|
||||
@@ -13,6 +13,8 @@ import { ChatPopoverPageModule } from 'src/app/shared/popover/chat-popover/chat-
|
||||
import { BtnModalDismissPageModule } from 'src/app/shared/btn-modal-dismiss/btn-modal-dismiss.module';
|
||||
|
||||
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
import { ImageCropperModule } from 'ngx-image-cropper';
|
||||
import { AngularCropperjsModule } from 'angular-cropperjs';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -24,6 +26,9 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
GroupMessagesPageRoutingModule,
|
||||
ChatPopoverPageModule,
|
||||
BtnModalDismissPageModule,
|
||||
ImageCropperModule,
|
||||
AngularCropperjsModule
|
||||
|
||||
],
|
||||
declarations: [GroupMessagesPage]
|
||||
})
|
||||
|
||||
@@ -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}}'>
|
||||
<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 class="title">
|
||||
<ion-label>{{msg.u.name}}</ion-label>
|
||||
<span class="time">{{showDateDuration(msg._updatedAt)}}</span>
|
||||
@@ -66,8 +66,11 @@
|
||||
<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">
|
||||
<img *ngIf="file.image_url" src="{{file.image_url}}" alt="image" >
|
||||
|
||||
|
||||
<div>
|
||||
|
||||
<div>
|
||||
<div class="file">
|
||||
<!-- <canvas id="pdf_canvas"></canvas> -->
|
||||
@@ -90,7 +93,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{last ? scrollToBottom() : ''}}
|
||||
</div>
|
||||
@@ -152,4 +157,5 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
in group!
|
||||
</ion-footer>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
@@ -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,9 @@ 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 +79,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 +585,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();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -50,8 +50,8 @@
|
||||
</ion-refresher> -->
|
||||
<div (click)="handleClick()" class="messages" #scrollMe>
|
||||
<div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of chatMessageStore.message[roomId]; let last = last"
|
||||
[class.messages-list-item-wrapper-active]="msg._id == selectedMsgId">
|
||||
<div (press)="handlePress(msg._id)" class='message-container incoming-{{msg.u.username!=loggedUser.me.username}}'>
|
||||
[class.messages-list-item-wrapper-active]="msg._id == selectedMsgId" >
|
||||
<div (press)="handlePress(msg._id)" class='message-container incoming-{{msg.u.username!=loggedUser.me.username}}' (click)="openPreview(msg)">
|
||||
<div class="title">
|
||||
<ion-label>{{msg.u.name}}</ion-label>
|
||||
<span class="time">{{showDateDuration(msg._updatedAt)}}</span>
|
||||
@@ -138,6 +138,7 @@
|
||||
<button (click)="stopRecording()">Stop Recording</button> -->
|
||||
<div class="container width-100 d-flex">
|
||||
<div>
|
||||
aqui
|
||||
<button 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>
|
||||
@@ -163,4 +164,5 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
in message!
|
||||
</ion-footer>
|
||||
|
||||
@@ -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();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
|
||||
|
||||
<ion-content>
|
||||
<div class="content-container d-flex flex-column">
|
||||
<div class="title-content width-100">
|
||||
@@ -23,12 +22,19 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="capturedImage != '' " class="ion-item-container-no-border">
|
||||
<ion-label class="attached-title">Fotografia Anexada </ion-label>
|
||||
|
||||
<ion-item lines="none">
|
||||
<ion-thumbnail slot="start">
|
||||
<ion-img [(ngModel)]="capturedImage" name="image" ngDefaultControl [src]="capturedImage"></ion-img>
|
||||
|
||||
<ion-img [(ngModel)]="capturedImage" name="image" ngDefaultControl [src]="photo" (click)="openPreview(photo)" ></ion-img>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<img src="" #imageElement/>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-thumbnail>
|
||||
<ion-label>
|
||||
<p>{{capturedImageTitle}}</p>
|
||||
@@ -68,7 +74,7 @@
|
||||
</ion-label>
|
||||
</div>
|
||||
|
||||
<div class="ion-item-container-no-border">
|
||||
<!-- <div class="ion-item-container-no-border">
|
||||
<ion-label (click)="selectImage()" class="cursor-pointer">
|
||||
<div class="attach-icon">
|
||||
<ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-add-photos.svg"></ion-icon>
|
||||
@@ -77,15 +83,14 @@
|
||||
<div class="attach-document cursor-pointer">
|
||||
<ion-label>Anexar Fotografia</ion-label>
|
||||
</div>
|
||||
</ion-label>
|
||||
</div>
|
||||
</ion-label>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
|
||||
|
||||
<ion-footer class="ion-no-border">
|
||||
<ion-toolbar class="footer-toolbar">
|
||||
<ion-buttons slot="start">
|
||||
|
||||
@@ -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,9 @@ 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';
|
||||
import {Photos} from '../new-publication/photos'
|
||||
import {Storage} from '@capacitor/storage'
|
||||
|
||||
const IMAGE_DIR = 'stored-images';
|
||||
|
||||
@@ -35,6 +38,9 @@ interface LocalFile {
|
||||
export class NewPublicationPage implements OnInit {
|
||||
images: LocalFile[] = [];
|
||||
|
||||
files: Set<File>;
|
||||
|
||||
|
||||
// date picker
|
||||
public date: any;
|
||||
public disabled = false;
|
||||
@@ -70,7 +76,7 @@ export class NewPublicationPage implements OnInit {
|
||||
|
||||
capturedImage: any = '';
|
||||
capturedImageTitle: any;
|
||||
public photos: any[] = [];
|
||||
// public photos: any[] = [];
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
@@ -81,16 +87,19 @@ export class NewPublicationPage implements OnInit {
|
||||
private fileLoaderService: FileLoaderService,
|
||||
private fileToBase64Service: FileToBase64Service,
|
||||
public ThemeService: ThemeService,
|
||||
private platform: Platform,
|
||||
|
||||
private loadingCtrl: LoadingController,
|
||||
private changeDetectorRef: ChangeDetectorRef,
|
||||
platform: Platform
|
||||
) {
|
||||
|
||||
this.publicationType = this.navParams.get('publicationType');
|
||||
this.folderId = this.navParams.get('folderId');
|
||||
this.publicationTitle = 'Nova Publicação';
|
||||
this.platform = platform;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
ngOnInit() {
|
||||
this.setTitle();
|
||||
console.log(this.folderId);
|
||||
Filesystem.mkdir({
|
||||
@@ -98,54 +107,56 @@ export class NewPublicationPage implements OnInit {
|
||||
directory: Directory.Data,
|
||||
recursive: true
|
||||
});
|
||||
// await this.loadSaved();
|
||||
// this.loadPicture()
|
||||
|
||||
// this.takePicture();
|
||||
}
|
||||
|
||||
async takePicture() {
|
||||
const image = await Camera.getPhoto({
|
||||
quality: 90,
|
||||
allowEditing: false,
|
||||
resultType: CameraResultType.Uri,
|
||||
source: CameraSource.Camera // Camera, Photos or Prompt!
|
||||
});
|
||||
// async takePicture() {
|
||||
// const image = await Camera.getPhoto({
|
||||
// quality: 90,
|
||||
// allowEditing: false,
|
||||
// resultType: CameraResultType.Uri,
|
||||
// source: CameraSource.Camera // Camera, Photos or Prompt!
|
||||
// });
|
||||
|
||||
if (image) {
|
||||
this.saveImage(image)
|
||||
}
|
||||
// if (image) {
|
||||
// this.saveImage(image)
|
||||
// }
|
||||
|
||||
}
|
||||
// }
|
||||
|
||||
convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
|
||||
const reader = new FileReader;
|
||||
reader.onerror = reject;
|
||||
reader.onload = () => {
|
||||
resolve(reader.result);
|
||||
};
|
||||
reader.readAsDataURL(blob);
|
||||
});
|
||||
// convertBlobToBase64s = (blob: Blob) => new Promise((resolve, reject) => {
|
||||
// const reader = new FileReader;
|
||||
// reader.onerror = reject;
|
||||
// reader.onload = () => {
|
||||
// resolve(reader.result);
|
||||
// };
|
||||
// reader.readAsDataURL(blob);
|
||||
// });
|
||||
|
||||
|
||||
async laodPicture() {
|
||||
const capturedImage = await Camera.getPhoto({
|
||||
resultType: CameraResultType.Uri,
|
||||
source: CameraSource.Photos,
|
||||
quality: 90,
|
||||
width: 1080,
|
||||
height: 720,
|
||||
});
|
||||
// async laodPicture() {
|
||||
// const capturedImage = await Camera.getPhoto({
|
||||
// resultType: CameraResultType.Uri,
|
||||
// source: CameraSource.Photos,
|
||||
// quality: 90,
|
||||
// width: 1080,
|
||||
// height: 720,
|
||||
// });
|
||||
|
||||
const response = await fetch(capturedImage.webPath!);
|
||||
const blob = await response.blob();
|
||||
// const response = await fetch(capturedImage.webPath!);
|
||||
// const blob = await response.blob();
|
||||
|
||||
this.photos.unshift({
|
||||
filepath: "soon...",
|
||||
webviewPath: capturedImage.webPath
|
||||
});
|
||||
// this.photos.unshift({
|
||||
// filepath: "soon...",
|
||||
// webviewPath: capturedImage.webPath
|
||||
// });
|
||||
|
||||
this.capturedImage = await this.convertBlobToBase64(blob);
|
||||
this.capturedImageTitle = new Date().getTime() + '.jpeg';
|
||||
}
|
||||
// this.capturedImage = await this.convertBlobToBase64s(blob);
|
||||
// this.capturedImageTitle = new Date().getTime() + '.jpeg';
|
||||
// }
|
||||
|
||||
/* laodPicture() {
|
||||
const input = this.fileLoaderService.createInput({
|
||||
@@ -155,11 +166,46 @@ export class NewPublicationPage implements OnInit {
|
||||
input.onchange = async () => {
|
||||
const file = this.fileLoaderService.getFirstFile(input)
|
||||
|
||||
const imageData = await this.fileToBase64Service.convert(file)
|
||||
this.capturedImage = imageData;
|
||||
this.capturedImageTitle = file.name
|
||||
|
||||
console.log(this.capturedImage)
|
||||
// // native devices ionic capacitor
|
||||
// private async readAsBase64(photo: Photo) {
|
||||
// // "hybrid" will detect Cordova or Capacitor
|
||||
// if (this.platform.is('hybrid')) {
|
||||
// // Read the file into base64 format
|
||||
// const file = await Filesystem.readFile({
|
||||
// path: photo.path
|
||||
// });
|
||||
|
||||
// return file.data;
|
||||
// }
|
||||
// else {
|
||||
// // Fetch the photo, read as a blob, then convert to base64 format
|
||||
// const response = await fetch(photo.webPath);
|
||||
// const blob = await response.blob();
|
||||
|
||||
// return await this.convertBlobToBase64(blob) as string;
|
||||
// }
|
||||
// }
|
||||
|
||||
// Save picture to file on device
|
||||
private async savePicture(photo: Photo) {
|
||||
// Convert photo to base64 format, required by Filesystem API to save
|
||||
const base64Data = await this.readAsBase64(photo);
|
||||
|
||||
// Write the file to the data directory
|
||||
const fileName = new Date().getTime() + '.jpeg';
|
||||
const savedFile = await Filesystem.writeFile({
|
||||
path: fileName,
|
||||
data: base64Data,
|
||||
directory: Directory.Data
|
||||
});
|
||||
|
||||
if (this.platform.is('hybrid')) {
|
||||
// Display the new image by rewriting the 'file://' path to HTTP
|
||||
// Details: https://ionicframework.com/docs/building/webview#file-protocol
|
||||
return {
|
||||
filepath: savedFile.uri,
|
||||
webviewPath: Capacitor.convertFileSrc(savedFile.uri),
|
||||
};
|
||||
|
||||
} */
|
||||
@@ -327,6 +373,7 @@ export class NewPublicationPage implements OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
close() {
|
||||
this.modalController.dismiss().then(() => {
|
||||
@@ -352,18 +399,18 @@ export class NewPublicationPage implements OnInit {
|
||||
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({
|
||||
@@ -377,102 +424,253 @@ export class NewPublicationPage implements OnInit {
|
||||
this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));
|
||||
} */
|
||||
|
||||
// async selectImage() {
|
||||
// const image = await Camera.getPhoto({
|
||||
// quality: 90,
|
||||
// allowEditing: false,
|
||||
// resultType: CameraResultType.Uri,
|
||||
// source: CameraSource.Photos // Camera, Photos or Prompt!
|
||||
// });
|
||||
|
||||
// if (image) {
|
||||
// this.saveImage(image)
|
||||
// }
|
||||
// }
|
||||
|
||||
// // Create a new file from a capture image
|
||||
// async saveImage(photo: Photo) {
|
||||
// const base64Data = await this.readAsBase64(photo);
|
||||
|
||||
async selectImage() {
|
||||
const image = await Camera.getPhoto({
|
||||
quality: 90,
|
||||
allowEditing: false,
|
||||
resultType: CameraResultType.Uri,
|
||||
source: CameraSource.Photos // Camera, Photos or Prompt!
|
||||
});
|
||||
// const fileName = new Date().getTime() + '.jpeg';
|
||||
// const savedFile = await Filesystem.writeFile({
|
||||
// path: `${IMAGE_DIR}/${fileName}`,
|
||||
// data: base64Data,
|
||||
// directory: Directory.Data
|
||||
// });
|
||||
|
||||
if (image) {
|
||||
this.saveImage(image)
|
||||
// this.loadFiles();
|
||||
// }
|
||||
|
||||
// private async readAsBase64(photo: Photo) {
|
||||
// if (this.platform.is('hybrid')) {
|
||||
// const file = await Filesystem.readFile({
|
||||
// path: photo.path
|
||||
// });
|
||||
|
||||
// return file.data;
|
||||
// }
|
||||
// else {
|
||||
// // Fetch the photo, read as a blob, then convert to base64 format
|
||||
// const response = await fetch(photo.webPath);
|
||||
// const blob = await response.blob();
|
||||
|
||||
// return await this.convertBlobToBase64(blob) as string;
|
||||
// }
|
||||
// }
|
||||
|
||||
// async loadFiles() {
|
||||
// this.images = [];
|
||||
|
||||
// const loading = await this.loadingCtrl.create({
|
||||
// message: 'Loading data...',
|
||||
// });
|
||||
// await loading.present();
|
||||
|
||||
// Filesystem.readdir({
|
||||
// path: IMAGE_DIR,
|
||||
// directory: Directory.Data,
|
||||
// }).then(result => {
|
||||
// console.log('ALL RESULTS', result.files[0])
|
||||
// let lastphoto = result.files[result.files.length - 1]
|
||||
// this.loadFileData(lastphoto);
|
||||
// },
|
||||
// async (err) => {
|
||||
// console.log('ERROR FILE DOSENT EXIST', err)
|
||||
// // Folder does not yet exists!
|
||||
// await Filesystem.mkdir({
|
||||
// path: IMAGE_DIR,
|
||||
// directory: Directory.Data,
|
||||
// recursive: true
|
||||
// });
|
||||
// }
|
||||
// ).then(_ => {
|
||||
// loading.dismiss();
|
||||
// });
|
||||
// }
|
||||
|
||||
// async loadFileData(fileName: string) {
|
||||
// console.log('ALL PHOTOT FILE', fileName)
|
||||
// // for (let f of fileNames) {
|
||||
// const filePath = `${IMAGE_DIR}/${fileName}`;
|
||||
|
||||
// const readFile = await Filesystem.readFile({
|
||||
// path: filePath,
|
||||
// directory: Directory.Data,
|
||||
// });
|
||||
|
||||
// this.images.push({
|
||||
// name: fileName,
|
||||
// path: filePath,
|
||||
// data: `data:image/jpeg;base64,${readFile.data}`,
|
||||
// });
|
||||
|
||||
// console.log('ALL IMAGE', this.images)
|
||||
|
||||
// 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();
|
||||
}
|
||||
}
|
||||
|
||||
// Create a new file from a capture image
|
||||
async saveImage(photo: Photo) {
|
||||
const base64Data = await this.readAsBase64(photo);
|
||||
|
||||
const fileName = new Date().getTime() + '.jpeg';
|
||||
const savedFile = await Filesystem.writeFile({
|
||||
path: `${IMAGE_DIR}/${fileName}`,
|
||||
data: base64Data,
|
||||
directory: Directory.Data
|
||||
});
|
||||
|
||||
this.loadFiles();
|
||||
}
|
||||
|
||||
private async readAsBase64(photo: Photo) {
|
||||
if (this.platform.is('hybrid')) {
|
||||
const file = await Filesystem.readFile({
|
||||
path: photo.path
|
||||
});
|
||||
|
||||
return file.data;
|
||||
}
|
||||
else {
|
||||
// Fetch the photo, read as a blob, then convert to base64 format
|
||||
const response = await fetch(photo.webPath);
|
||||
const blob = await response.blob();
|
||||
|
||||
return await this.convertBlobToBase64(blob) as string;
|
||||
}
|
||||
}
|
||||
|
||||
async loadFiles() {
|
||||
this.images = [];
|
||||
|
||||
const loading = await this.loadingCtrl.create({
|
||||
message: 'Loading data...',
|
||||
});
|
||||
await loading.present();
|
||||
|
||||
Filesystem.readdir({
|
||||
path: IMAGE_DIR,
|
||||
directory: Directory.Data,
|
||||
}).then(result => {
|
||||
console.log('ALL RESULTS', result.files[0])
|
||||
let lastphoto = result.files[result.files.length - 1]
|
||||
this.loadFileData(lastphoto);
|
||||
},
|
||||
async (err) => {
|
||||
console.log('ERROR FILE DOSENT EXIST', err)
|
||||
// Folder does not yet exists!
|
||||
await Filesystem.mkdir({
|
||||
path: IMAGE_DIR,
|
||||
directory: Directory.Data,
|
||||
recursive: true
|
||||
});
|
||||
}
|
||||
).then(_ => {
|
||||
loading.dismiss();
|
||||
});
|
||||
}
|
||||
|
||||
async loadFileData(fileName: string) {
|
||||
console.log('ALL PHOTOT FILE', fileName)
|
||||
// for (let f of fileNames) {
|
||||
const filePath = `${IMAGE_DIR}/${fileName}`;
|
||||
|
||||
const readFile = await Filesystem.readFile({
|
||||
path: filePath,
|
||||
directory: Directory.Data,
|
||||
});
|
||||
|
||||
this.images.push({
|
||||
name: fileName,
|
||||
path: filePath,
|
||||
data: `data:image/jpeg;base64,${readFile.data}`,
|
||||
});
|
||||
|
||||
console.log('ALL IMAGE', this.images)
|
||||
|
||||
this.capturedImage = this.images[0].data
|
||||
//}
|
||||
}
|
||||
}
|
||||
|
||||
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,
|
||||
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)
|
||||
// };
|
||||
// }
|
||||
public photos: Photos[] = [];
|
||||
private PHOTO_STORAGE: string = "photos";
|
||||
private platform: Platform;
|
||||
|
||||
|
||||
async takePicture() {
|
||||
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';
|
||||
|
||||
}
|
||||
|
||||
convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
|
||||
const reader = new FileReader;
|
||||
reader.onerror = reject;
|
||||
reader.onload = () => {
|
||||
resolve(reader.result);
|
||||
};
|
||||
reader.readAsDataURL(blob);
|
||||
});
|
||||
|
||||
loadPicture() {
|
||||
}}
|
||||
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
export interface Photos {
|
||||
filepath: string;
|
||||
webviewPath: string;
|
||||
}
|
||||
Reference in New Issue
Block a user