import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams ,ModalController} from 'ionic-angular';
import {Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { ImagePicker } from '@ionic-native/image-picker';
import { Storage } from '@ionic/storage';
import {Myservice} from '../../providers/myservice';

@IonicPage()

@Component({
  selector: 'page-request_protocol',
  templateUrl: 'request_protocol.html',
})

export class RequestProtocol {

	private body_shop_form : FormGroup;
	body_parts:any;
	service_id:any;
	user_data:any;
	successs:any;
	lat_lng:any;
	service:any;
	base64Image= [];
	profile_pic= [];
	
	constructor(public navCtrl: NavController, public navParams: NavParams,private transfer: FileTransfer, private file: File, private formBuilder: FormBuilder,private imagePicker: ImagePicker,public storage:Storage, private myservice: Myservice,public modalCtrl: ModalController) {
		this.storage.get('lat_lng').then((lat_lng) => {
			console.log("instorage", lat_lng);
			if(lat_lng){
				this.lat_lng=lat_lng;
			}
		})
		this.service = this.navParams.get('service')
		 console.log(this.service);
		 
		 
		 
		this.storage.get('user_data').then((user_data) => {
				console.log(user_data);
			if(user_data){
				this.user_data= user_data;
			}
		})
		this.body_shop_form = this.formBuilder.group({ 
			message: ['', Validators.required],
		});
	}

	ionViewDidLoad() {
		console.log('ionViewDidLoad DamagephotoPage');
	}

	back(){
		this.navCtrl.pop();
	}
	
	success(){
		this.navCtrl.push('SuccessPage');
	}	
	body_shop(){
	if(this.user_data){	
		console.log(this.base64Image);
		var objs = Object.assign({}, this.body_shop_form.value, {'work_name':this.body_parts,'service_id':this.service_id, 'user_id':this.user_data.id, 'lat':this.lat_lng.lat, 'lon':this.lat_lng.lng});
		console.log(objs);
		if(this.base64Image){
			this.save_body_shop(objs);
		}
		}
		else{
		
		
		let modal = this.modalCtrl.create('Loginbook');
		modal.onDidDismiss(data => {
			 console.log(data);
			if(data.user_data.id) {
				this.user_data = data.user_data;
				var objs = Object.assign({}, this.body_shop_form.value, {'work_name':this.body_parts,'service_id':this.service_id, 'user_id':data.user_data.id, 'lat':this.lat_lng.lat, 'lon':this.lat_lng.lng});
		console.log(objs);
		if(this.base64Image){
			this.save_body_shop(objs);
		}
			}
		});
		modal.present();
		}
	}
	
	save_body_shop(vals){
		console.log(this.base64Image.length);
		if(this.base64Image.length > 0){
		this.myservice.show_loader();
			this.myservice.load_post(vals,'save_body_shop').subscribe(data => {
			this.myservice.hide_loader();
			if(data.status == 'success'){
				this.load_post_multifile(this.base64Image, {'value' :data.data }, "save_pool_img");
			}else{
				this.myservice.show_alert("Error",data.message);
			}
		});
		}else
		this.myservice.show_alert("Warning","Please upload atleast one image");
		 
		
	}
	
	 
	
	uploadPicture(pic){
	   console.log(pic);
	   var options ={	maximumImagesCount:1,
						width:400,
						height: 400,
						quality: 100
					}
		this.imagePicker.getPictures(options).then((results) => {
		 console.log(results.length);
		 console.log(results[0]);
			 
				if(results){
					this.base64Image[pic]= results[0];
					this.profile_pic[pic] = results[0];
				}
			
		}, (err) => { }); 
		console.log(this.base64Image);
	}
	
		   load_post_multifile(imageURI, post_data, fn_name) {
		 	this.myservice.show_loader();
			var i;
			
		for (i = 1; i < imageURI.length; i++) {
		if(imageURI[i]!=undefined){
			console.log("imageURI" ,imageURI[i]);
			let ft = this.transfer.create();
			let filename = imageURI[i].substr(imageURI[i].lastIndexOf('/')+1);
			let options = {
				fileKey: 'file',
				fileName: filename,
				mimeType: 'image/jpeg',
				chunkedMode: false,
				headers: {
					'Content-Type' : undefined
				},
				params: post_data
			};  
			ft.upload(imageURI[i], this.myservice.webservice_url+fn_name, options, false)
			.then((result: any) => {
				this.myservice.hide_loader();
				 	console.log('result ' + i, result);
					 this.successs=true;
					console.log('imageURIlength ',imageURI.length);
					console.log('i ',i);
					
						 
			}).catch((error: any) => {
				this.myservice.hide_loader();
				this.successs=false;
				this.myservice.show_alert("Error!", 'No garages found');
			});
		}
		}
		console.log(this.successs);
		if(i == imageURI.length)
						this.navCtrl.push('SuccessPage',{'page':'car_details'});
		 
	}

}
