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();
//   }

async getIconGallery(){

    const modal = await this.modalController.create({
      component: GroupIconsPage ,
      animated: true,
      cssClass: 'transparentblack-modal',
            });
    modal.present();
  }

  openChat(){

    
  }
}