image correction

ng6-seed/src/app/sales-pd/components/components.module.ts

@@ -10,13 +10,15 @@ import { BrowserModule } from '@angular/platform-browser';
 //import { IonicModule } from 'ionic-angular';
 //import { MyApp } from '../../../app/app.component';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { CaptureBtnComponent } from './ques-template/capture-btn/capture-btn.component';
+import { SingleCaptureBtnComponent } from './ques-template/single-capture-btn/single-capture-btn.component';
 //import { SharedModule } from '../../../Shared/shared.module';
 
 
 
 
 @NgModule({
-	declarations: [QuesTemplateComponent],
+	declarations: [QuesTemplateComponent, CaptureBtnComponent, SingleCaptureBtnComponent],
     imports: [MatButtonToggleModule,
         ,
 		BrowserModule,

ng6-seed/src/app/sales-pd/components/ques-template/capture-btn/capture-btn.component.html

@@ -0,0 +1,6 @@
+<button (click)="capture($event)"  mat-button mat-raised-button>Capture 
+  <mat-icon name="camera" *ngIf="!addMoreBtn">camera_alt</mat-icon>
+  <mat-icon name="camera" *ngIf="addMoreBtn">add_a_photo</mat-icon>
+</button>
+<input  type="file" (change)="capturedImage($event)" id="input-file" name="file" accept="image/*" capture="user" style="display: none">
+<!-- document.querySelector('#input-file').click() -->

ng6-seed/src/app/sales-pd/components/ques-template/capture-btn/capture-btn.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CaptureBtnComponent } from './capture-btn.component';
+
+describe('CaptureBtnComponent', () => {
+  let component: CaptureBtnComponent;
+  let fixture: ComponentFixture<CaptureBtnComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CaptureBtnComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CaptureBtnComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ng6-seed/src/app/sales-pd/components/ques-template/capture-btn/capture-btn.component.ts

@@ -0,0 +1,39 @@
+import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
+import { Ng2ImgMaxService } from 'ng2-img-max';
+
+@Component({
+  selector: 'app-capture-btn',
+  templateUrl: './capture-btn.component.html',
+  styleUrls: ['./capture-btn.component.scss']
+})
+export class CaptureBtnComponent implements OnInit {
+
+  @Input() addMoreBtn;
+  @Output() imageDataEmitter = new EventEmitter
+  @Output() singleDataEmitter = new EventEmitter
+  
+  constructor(private ng2ImgMax:Ng2ImgMaxService) { }
+
+  ngOnInit(): void {
+    console.log(this.addMoreBtn)
+  }
+  capturedImage(event){
+    console.log(event);
+    let imageData= event.target.files[0]
+    this.ng2ImgMax.resizeImage(imageData, 450, 650).subscribe(
+      result => {
+        this.imageDataEmitter.emit(result)
+        this.singleDataEmitter.emit(result)
+      },
+      error => {
+        console.log('😢 Oh no!', error);
+      }
+    );
+    
+  }
+  capture(event){
+    event.preventDefault();
+    let element:HTMLElement = document.getElementById('input-file') as HTMLElement
+    element.click();
+  }
+}

ng6-seed/src/app/sales-pd/components/ques-template/ques-template.html

@@ -77,6 +77,9 @@
                               </div>
                               <div fxLayout="row" style="justify-content: center">
                                 <div fxLayout="column">
+                                  <span >
+                                    <app-single-capture-btn class="file-btn"  (singleDataEmitter)="captureImg($event,p_i,parent_ques)"   ></app-single-capture-btn>
+                                </span>
                               <!-- <button mat-raised clear color="optblue" [disabled]="sales_pd_type == '2'" (click)="captureImg(p_i,parent_ques)"><mat-icon style="font-size: 30px" name="md-camera"></mat-icon></button> -->
                                 </div>
                             <!-- IMAGE STATUS ICON FOR INPROGRESS, COMPLETED AND FAILED -->
@@ -362,9 +365,12 @@
                               <!-- {{single_ques.value | json}} -->
                             
                               <div class="add-more-image" *ngIf="g_l">
-                                  <button mat-raised-button color="warn" style="min-width: 65px !important;" [disabled]="sales_pd_type == '2'" (click)="addData(g_i,parent_ques,group_ques.get('questions').value,$event,'camera',single_ques)">
+                                  <!-- <button mat-raised-button color="warn" style="min-width: 65px !important;" [disabled]="sales_pd_type == '2'" (click)="addData(g_i,parent_ques,group_ques.get('questions').value,$event,'camera',single_ques)">
                                       <mat-icon>camera_alt</mat-icon>+
-                                    </button>
+                                    </button> -->
+                                    <span>
+                                      <app-capture-btn class="file-btn"  (imageDataEmitter)="addImage($event,g_i,parent_ques,group_ques.get('questions').value,single_ques)"   ></app-capture-btn>
+                                  </span>
                                   <!-- <button   class="ml-1 mr-1 hover-icon" mat-raised-button clear style="color: #f3432c" [disabled]="sales_pd_type == '2'"  (click)="addData(g_i,parent_ques,group_ques.get('questions').value,$event,'camera',single_ques)"><mat-icon style="font-size:25px">camera_alt</mat-icon>+</button> -->
                                 </div>
                               </div>

ng6-seed/src/app/sales-pd/components/ques-template/ques-template.ts

@@ -23,6 +23,8 @@ import { Router, ActivatedRoute } from '@angular/router';
 import { LoaderService } from 'app/shared/loaderService/loader.service';
 import { SectionListComponent } from 'app/sales-pd/section-list/section-list.component';
 
+import { CameraService } from 'app/sales-pd/providers/camera/camera.service';
+import { ApiServiceService } from 'app/lender-credit-pd/services/apiService/api-service.service';
 // const originFormControlNameNgOnChanges = FormControlName.prototype.ngOnChanges;
 // FormControlName.prototype.ngOnChanges = function () {
 //   const result = originFormControlNameNgOnChanges.apply(this, arguments);
@@ -62,10 +64,20 @@ export class QuesTemplateComponent {
   raw_data_Section: any={status:''};
   @ViewChild('accordion') Accordion: MatAccordion
   @ViewChild('mapanel') matExpansionPanel:MatExpansionPanel
+  @Output() imageDataEmitter = new EventEmitter
+  @Output() singleDataEmitter = new EventEmitter
+  @ViewChild('dummy_img_more') dummyImgMoreRef: ElementRef;
   emittedFormGroup: any = null;
   sales_pd_id: any;
   sales_pd_type: string;
-  constructor(public dialogRef: MatDialogRef<SectionListComponent>,private route: ActivatedRoute,private router: Router,private dialog:MatDialog,private _fb:FormBuilder,private questionService:QuestionServiceService,private SalesPdService:SalesPdService,notifier: NotifierService,private loaderService:LoaderService) {
+  cus_type;
+  current_index: any;
+  tmp_ques:any;
+  imageData: any;
+  records: any;
+  tmp_control: QuestionServiceService;
+ tmp:any =[];
+  constructor( private cameraService: CameraService,public dialogRef: MatDialogRef<SectionListComponent>,private route: ActivatedRoute,private router: Router,private dialog:MatDialog,private _fb:FormBuilder,private questionService:QuestionServiceService,private SalesPdService:SalesPdService,notifier: NotifierService,private loaderService:LoaderService) {
     console.log('Hello QuesTemplateComponent Component');
     this.text = 'Hello World';
     this.notifier = notifier;
@@ -445,7 +457,298 @@ this.proceedonChangeProperty(modified)
       console.log('File is completely uploaded!');
     }
   }
+  getIndex(index,q,data,single_ques) {
+    console.log('curr', index);
+    console.log(q);
+    //   setTimeout(function(){
+    //     console.log(q);
+    // },3000);
+   // console.log(q.controls);
+ this.tmp =[]
+   this.tmp.push(q)
+    console.log(data);
+    data.forEach(element => {
+      console.log(element.question_key);
+    });
+    console.log(this.tmp);
+        console.log(single_ques)
+        this.tmp_control = this.questionService
+        this.tmp_ques = single_ques;
+        this.current_index = index;
+  }
+  addImage(event, index, parent_index, data,single_ques1) {
+    // this.ngxService.start();
+      console.log(this.quesAnsForm)
    
+      console.log(parent_index)
+         console.log(this.tmp_ques)
+             console.log(parent_index['controls'].questions_group)
+    console.log(data)
+    data=data.filter(group_indi=>!group_indi.hasOwnProperty('additional_field') && group_indi.additional_field != 1 )
+    
+     console.log(single_ques1)
+    let single_ques =  this.tmp_ques
+     console.log(single_ques)
+     console.log(event, index);
+     this.imageData = this.quesAnsForm.value.questions
+   
+  console.log(this.quesAnsForm.value.questions)
+    // console.log(this.questions_JSON.questions)
+           console.log(this.imageData);
+     const reader = new FileReader();
+     // let imagePath = event;
+     reader.readAsDataURL(event);
+     reader.onload = (_event) => {
+       // this.imageData = reader.result;
+       this.cameraService.getPosition().then(geoCords => {
+         let geoCoordinates;
+         if (geoCords != 'error') {
+           geoCoordinates = geoCords;
+         } else {
+           geoCoordinates = null;
+         }
+         console.log(geoCords);
+         console.log(this.imageData);
+         console.log(this.current_index);
+         this.cameraService.addWatermarks(reader.result, geoCoordinates).then(watermarked_img => {
+         if (this.current_index != 'last') {
+           if (this.imageData[this.current_index].is_multiple == 1) {
+             console.log('multi');
+             let img_param = {img_url: watermarked_img, is_base64: true, link: geoCoordinates};
+             this.imageData[this.current_index].img_data.push(img_param);
+              console.log(this.imageData)
+            // this.sendImage(this.imageData, this.imageData[this.current_index].img_data.length - 1);
+           } else {
+       this.imageData[this.current_index].img_url = watermarked_img;
+       this.imageData[this.current_index].is_base64 = true;
+       this.imageData[this.current_index].link = geoCoordinates;
+       console.log(this.imageData)
+      // this.sendImage(this.imageData);
+           }
+         } else {
+           this.getImageName().then(result => {
+           console.log(result);
+           this.imageData.push( {
+             img_key: 'common_image',
+             img_name: result,
+             img_url: watermarked_img,
+             fk_form_id: '',
+             is_base64: true,
+             link: geoCoordinates
+         });
+         // let el = document.getElementById('dummy-img-more');
+         // el.scrollIntoView();
+           setTimeout(() => {
+         this.dummyImgMoreRef.nativeElement.scrollIntoView({behavior: 'smooth', block: 'end'});
+       }, 1000);
+          // this.sendImage(this.imageData);
+       });
+         }
+         console.log(watermarked_img);
+         single_ques.controls.answer_value.setValue(watermarked_img)
+         // this.sales_pd_id = Number(this.sales_pd_id)
+         // console.log(this.sales_pd_id)
+ 
+         // if(this.networkDetection.getCurrentNetworkStatus() == ConnectionStatus.online &&  (typeof(this.sales_pd_id) == 'string' ? !this.sales_pd_id.includes('local') : true) ) {
+           single_ques.controls.is_image_status.setValue(true)
+           single_ques.controls.is_loader.setValue(true);
+           single_ques.controls.is_saved.setValue(false);
+           let params={"fk_sales_pd_id":"","img":watermarked_img,"img_name":single_ques.value.question_key}
+           let storage_param=this.questions_JSON
+           let form_structure=this.questions_JSON
+           form_structure.questions=this.quesAnsForm.getRawValue().questions
+           form_structure.is_complete=1
+   
+           
+             // else {
+             //   single_ques.controls.is_image_status.setValue(true)
+             //   single_ques.controls.is_loader.setValue(false);
+             //   single_ques.controls.is_saved.setValue(true);
+             // }
+             this.emittedFormGroup = this.quesAnsForm.getRawValue()
+             // PASSING THE VALUE TO PARENT COMPONENT
+             this.imageUploadCheck.emit(this.emittedFormGroup);
+   
+           this.SalesPdService.saveSalesPDImage(params,form_structure).subscribe(apiresult=>{
+             if(apiresult['dataStatus']){
+               single_ques.controls.is_loader.setValue(false);
+             single_ques.controls.is_saved.setValue(true);
+               this.httpListener(apiresult);
+               form_structure.questions=this.quesAnsForm.getRawValue().questions
+               this.SalesPdService.updateSectionDataLocally(params,form_structure).subscribe(res=>{
+               })
+               storage_param.questions=this.quesAnsForm.getRawValue().questions
+             let key_value = localStorage.getItem('sales_pd_id_PRIMARYKEY')
+           
+               // this.SalesPdService.getData_fromLocal('sales_pd_id_PRIMARYKEY').then(key_value=>{
+                 console.log(key_value)
+                 storage_param.sales_pd_id=key_value
+               // this.salesPDProvider.insertData_Replace('sec'+storage_param.section_id,storage_param)
+               // })
+               console.log("image saved successfully")
+               
+             }else{
+               single_ques.controls.is_loader.setValue(false);
+               single_ques.controls.is_saved.setValue(false);
+                 this.SalesPdService.clear_local_key('sec'+storage_param.section_id)
+                // this.toastProvider.lenderappmessage("Something went wrong");
+             }
+             console.log(this.tmp_ques)
+             // this.tmp[1].controls.questions_group
+             // console.log(parent_index['controls'].questions_group)
+            // let control: any = parent_index['controls'].questions_group as FormArray
+            this.tmp.length
+             let control: any =  this.tmp[0].controls.questions_group
+             parent_index
+           
+             control.push(this._fb.group({ 'questions': this._fb.array([]) }))
+             let sub_childControl: any = control.controls[this.current_index + 1].get('questions') as FormArray
+             console.log(sub_childControl)
+             data.forEach((group_indi,arr_index )=> {
+               delete group_indi.answer_value
+               sub_childControl.push(this.questionService.createValue(group_indi))
+               this.questionService.addAdditionalControl(group_indi, sub_childControl, arr_index)
+             })
+             
+           })
+       //  this.ngxService.stop();
+     }, err => {
+       console.log('dk', err);
+       //this.ngxService.stop();
+     });
+   });
+   };
+ }
+   captureImg(event,parent_index,parent_control){
+     console.log("started")
+  
+     console.log(parent_index)
+  
+     let single_ques =  this.tmp_ques
+      console.log(parent_control)
+      console.log(event);
+      this.imageData = this.quesAnsForm.value.questions
+  
+   console.log(this.quesAnsForm.value.questions)
+     // console.log(this.questions_JSON.questions)
+            console.log(this.imageData);
+      const reader = new FileReader();
+      // let imagePath = event;
+      reader.readAsDataURL(event);
+      reader.onload = (_event) => {
+        // this.imageData = reader.result;
+        this.cameraService.getPosition().then(geoCords => {
+          let geoCoordinates;
+          if (geoCords != 'error') {
+            geoCoordinates = geoCords;
+          } else {
+            geoCoordinates = null;
+          }
+          console.log(geoCords);
+          console.log(this.imageData);
+          console.log(this.current_index);
+          this.current_index = parent_index;
+          console.log(this.current_index);
+          this.cameraService.addWatermarks(reader.result, geoCoordinates).then(watermarked_img => {
+          if (this.current_index != 'last') {
+            if (this.imageData[this.current_index].is_multiple == 1) {
+              console.log('multi');
+              let img_param = {img_url: watermarked_img, is_base64: true, link: geoCoordinates};
+              this.imageData[this.current_index].img_data.push(img_param);
+               console.log(this.imageData)
+             // this.sendImage(this.imageData, this.imageData[this.current_index].img_data.length - 1);
+            } else {
+        this.imageData[this.current_index].img_url = watermarked_img;
+        this.imageData[this.current_index].is_base64 = true;
+        this.imageData[this.current_index].link = geoCoordinates;
+        console.log(this.imageData)
+       // this.sendImage(this.imageData);
+            }
+          } else {
+            this.getImageName().then(result => {
+            console.log(result);
+            this.imageData.push( {
+              img_key: 'common_image',
+              img_name: result,
+              img_url: watermarked_img,
+              fk_form_id: '',
+              is_base64: true,
+              link: geoCoordinates
+          });
+          // let el = document.getElementById('dummy-img-more');
+          // el.scrollIntoView();
+            setTimeout(() => {
+          this.dummyImgMoreRef.nativeElement.scrollIntoView({behavior: 'smooth', block: 'end'});
+        }, 1000);
+           // this.sendImage(this.imageData);
+        });
+          }
+          console.log(watermarked_img);
+          parent_control.controls.answer_value.setValue(watermarked_img)
+         
+         
+         
+         //SENDING SINGLE IMAGE TO API WITH PRIMARY KEY
+         let params={"fk_sales_pd_id":"","img":watermarked_img,"img_name":parent_control.value.question_key}
+         let storage_param=this.questions_JSON
+         const form_structure=this.questions_JSON
+         form_structure.questions=this.quesAnsForm.getRawValue().questions
+         form_structure.is_complete=1
+ 
+         // if(this.networkDetection.getCurrentNetworkStatus() == ConnectionStatus.online && typeof(this.sales_pd_id) != 'string' && (typeof(this.sales_pd_id) == 'string' ? !this.sales_pd_id.includes('local') : true) ) {
+           parent_control.controls.is_image_status.setValue(true)
+         parent_control.controls.is_loader.setValue(true);
+         parent_control.controls.is_saved.setValue(false);
+         // }
+         //   else {
+         //     parent_control.controls.is_image_status.setValue(true)
+         //     parent_control.controls.is_loader.setValue(false);
+         //     parent_control.controls.is_saved.setValue(true);
+         //   }
+         
+         this.emittedFormGroup = this.quesAnsForm.getRawValue()
+         this.imageUploadCheck.emit(this.emittedFormGroup);
+ 
+ 
+         this.SalesPdService.saveSalesPDImage(params,form_structure).subscribe(apiresult=>{
+           if(apiresult['dataStatus']){
+             
+             parent_control.controls.is_loader.setValue(false);
+             parent_control.controls.is_saved.setValue(true);
+              
+             form_structure.questions=this.quesAnsForm.getRawValue().questions
+             // this.httpListener(apiresult);
+             this.SalesPdService.updateSectionDataLocally(params,form_structure).subscribe(res=>{
+               this.sendGeoCordsForSatellite(this.geoCoordinates,form_structure)   
+             })
+             console.log("Result",apiresult['dataStatus'])
+            // this.toastProvider.lenderappmessage(parent_control.value.question+ " Saved Successfully")
+         storage_param.questions=this.quesAnsForm.getRawValue().questions
+         // this.SalesPdService.getData_fromLocal('sales_pd_id_PRIMARYKEY').then(key_value=>{
+           // let key_value = localStorage.getItem('sales_pd_id_PRIMARYKEY')
+           // storage_param.sales_pd_id=key_value
+         // this.salesPDProvider.insertData_Replace('sec'+storage_param.section_id,storage_param)
+         // })
+              let key_value = localStorage.getItem('sales_pd_id_PRIMARYKEY')
+            
+                // this.SalesPdService.getData_fromLocal('sales_pd_id_PRIMARYKEY').then(key_value=>{
+                  console.log(key_value)
+                  storage_param.sales_pd_id=key_value
+                // this.salesPDProvider.insertData_Replace('sec'+storage_param.section_id,storage_param)
+                // })
+                console.log("image saved successfully")
+ 
+                
+              }
+            })
+        //  this.ngxService.stop();
+      }, err => {
+        console.log('dk', err);
+        //this.ngxService.stop();
+      });
+    });
+    };
+       }
   addData(group_index, parent_index, data, event, options?: any, single_ques?) {
     console.clear();
     data=data.filter(group_indi=>!group_indi.hasOwnProperty('additional_field') && group_indi.additional_field != 1 )
@@ -1595,4 +1898,16 @@ this.proceedonChangeProperty(modified)
     control.controls.is_loader.setValue(false);
     control.controls.is_image_status.setValue(false);
   }
+  getImageName() {
+    return new Promise((resolve, reject) => {
+       let img_name = prompt('Enter the Image Name');
+       if (img_name != null) {
+         console.log(img_name);
+       //  return img_name;
+         resolve(img_name);
+       } else {
+         console.log('no name');
+       }
+     });
+   }
 }

ng6-seed/src/app/sales-pd/components/ques-template/single-capture-btn/single-capture-btn.component.html

@@ -0,0 +1,6 @@
+<button (click)="singlecapture($event)"  mat-button mat-raised-button>Capture 
+  <mat-icon name="camera" *ngIf="!addMoreBtn">camera_alt</mat-icon>
+  <mat-icon name="camera" *ngIf="addMoreBtn">add_a_photo</mat-icon>
+</button>
+<input  type="file" (change)="singlecapturedImage($event)" id="input-files" name="file" accept="image/*" capture="user" style="display: none">
+<!-- document.querySelector('#input-file').click() -->

ng6-seed/src/app/sales-pd/components/ques-template/single-capture-btn/single-capture-btn.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SingleCaptureBtnComponent } from './single-capture-btn.component';
+
+describe('SingleCaptureBtnComponent', () => {
+  let component: SingleCaptureBtnComponent;
+  let fixture: ComponentFixture<SingleCaptureBtnComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SingleCaptureBtnComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SingleCaptureBtnComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ng6-seed/src/app/sales-pd/components/ques-template/single-capture-btn/single-capture-btn.component.ts

@@ -0,0 +1,45 @@
+import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
+import { Ng2ImgMaxService } from 'ng2-img-max';
+
+@Component({
+  selector: 'app-single-capture-btn',
+  templateUrl: './single-capture-btn.component.html',
+  styleUrls: ['./single-capture-btn.component.scss']
+})
+export class SingleCaptureBtnComponent implements OnInit {
+
+  
+  @Input() addMoreBtn;
+ 
+  @Output() singleDataEmitter = new EventEmitter
+  
+  constructor(private ng2ImgMax:Ng2ImgMaxService) { }
+
+  ngOnInit(): void {
+    console.log(this.addMoreBtn)
+  }
+  singlecapturedImage(event){
+    console.log(event);
+    let imageData= event.target.files[0]
+    this.ng2ImgMax.resizeImage(imageData, 450, 650).subscribe(
+      result => {
+       
+        this.singleDataEmitter.emit(result)
+      },
+      error => {
+        console.log('😢 Oh no!', error);
+      }
+    );
+    
+  }
+  singlecapture(event){
+    event.preventDefault();
+    let element:HTMLElement = document.getElementById('input-files') as HTMLElement
+    element.click();
+  }
+}
+
+
+
+
+ 

ng6-seed/src/app/sales-pd/providers/camera/camera.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { CameraService } from './camera.service';
+
+describe('CameraService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: CameraService = TestBed.get(CameraService);
+    expect(service).toBeTruthy();
+  });
+});

ng6-seed/src/app/sales-pd/providers/camera/camera.service.ts

@@ -0,0 +1,111 @@
+import { Injectable } from '@angular/core';
+import { DatePipe } from '@angular/common';
+import * as watermark from 'watermarkjs';
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class CameraService {
+pipe = new DatePipe('en-US')
+  constructor() { 
+    setTimeout(()=>{
+    this.getPosition().then(res=>{
+      console.log("geolocation",res)
+    },err=>{
+      console.log("Error in geo",err);
+    })
+  },2000)
+  }
+  addWatermarks(base64Img,geoCords?) {
+
+    return new Promise((resolve, reject) => {
+     
+      // this.constant.getGeoTag().then(geoCoordinates => {
+        // this.getPosition().then(geoCords=>{
+        //   console.log(geoCords);
+      //   this.geoCords = geoCoordinates
+      // });
+    // this.geoCords=localStorage.getItem('current_coordinates')
+    // console.log("corrds",this.geoCords)
+      let raw_img = base64Img
+        var today = new Date();
+        // let today_loc = today.toLocaleString('en-US', { timeZone: "Asia/Kolkata" })
+        let today_loc=this.pipe.transform(today, 'yyyy-MM-dd, h:mm a')
+        var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
+        //  var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
+        var dateTime = 'Date : ' + today_loc;
+       
+        console.log(date)
+
+        // fetch(raw_img)
+        // .then(res => res.blob())
+        // .then(blob => {
+        watermark([raw_img, 'assets/images/PD_watermark.png'])
+          .image(watermark.image.upperRight())
+          .then(img => {
+            raw_img = img.src;
+
+            let text = watermark.text
+            watermark([raw_img])
+              .image(text.upperLeft(dateTime, '19px sans-serif', '#ff0000', 1.0))
+              // .image(text.upperLeft(dateTime, '20px sans-serif', '#ff0000', 1.0))
+              .then(img => {
+                raw_img = img.src;
+                console.log("2d", raw_img)
+                // resolve(img.src)
+                console.log(geoCords)
+                // let geoCoordinates = geoCords ? geoCords : '-'
+                if(geoCords) {
+                let Location = `Location : ` + geoCords
+                watermark([raw_img])
+                  .image(text.upperLeft(Location, '19px sans-serif', '#ff0000', 1.0, 40 ))
+                  .then(img => {
+                    raw_img = img.src
+                    console.log("3rd", raw_img)
+                    resolve(img.src)
+                    // localStorage.removeItem('current_coordinates')
+                  });
+                }
+                else {
+                  resolve(img.src)
+                }
+              });
+          });
+      
+         
+    // },err=>{
+    //   console.log("Error in geo",err);
+    //   switch(err.code) {
+    //     case 1:
+    //       alert("Geolocation permission is denied. Please allow the permission to capture");
+    //       break;
+    //     case 2:
+    //       alert("Do not get the geolocation of your place");
+    //       break;
+    //     case 2:
+    //       alert("Something went wrong");
+    //       break;
+    //   }
+    //   reject(err);
+    // })
+  })
+    // });
+  }
+  getPosition(): Promise<any>
+  {
+    return new Promise((resolve, reject) => {
+
+      navigator.geolocation.getCurrentPosition(resp => {
+        console.log("Geo",resp.coords);
+        let latLong:string = resp.coords.latitude+', '+resp.coords.longitude
+          // resolve({lng: resp.coords.longitude, lat: resp.coords.latitude});
+          resolve(latLong)
+        },
+        err => {
+          resolve('error');
+        });
+    });
+
+  }
+}

ng6-seed/src/app/sales-pd/providers/data-service/data-service.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { DataServiceService } from './data-service.service';
+
+describe('DataServiceService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: DataServiceService = TestBed.get(DataServiceService);
+    expect(service).toBeTruthy();
+  });
+});

ng6-seed/src/app/sales-pd/providers/data-service/data-service.service.ts

@@ -0,0 +1,25 @@
+import { Injectable } from '@angular/core';
+  export interface errorMsgInterface  {
+    title:string;
+    subtitle:string;
+    message:string;
+    is_homebtn:boolean
+  }
+@Injectable({
+  providedIn: 'root'
+})
+export class DataServiceService {
+  errorMsg:errorMsgInterface
+  getPDImageData:any;
+  constructor() { 
+    this.errorMsg ={
+      title:"404",
+      subtitle:'Not Found',
+      message:'The requested URL is not found on the server',
+      is_homebtn:false
+    }
+  }
+  setErrorMsg(obj:errorMsgInterface) {
+   this.errorMsg = obj
+  }
+}

ng6-seed/src/app/sales-pd/sales-pd.module.ts

@@ -20,6 +20,8 @@ import { AlertDialogComponent } from 'app/lender-credit-pd/alert-dialog/alert-di
 import { SharedModule } from 'app/shared/shared.module';
 import { StartPdModule } from 'app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.module';
 import { ConstantsProvider } from 'app/providers/constants/constants';
+import { CaptureBtnComponent } from './components/ques-template/capture-btn/capture-btn.component';
+import { SingleCaptureBtnComponent } from './components/ques-template/single-capture-btn/single-capture-btn.component';
 @NgModule({   
   imports: [ 
     CommonModule,
@@ -29,8 +31,8 @@ import { ConstantsProvider } from 'app/providers/constants/constants';
     SharedModule,
     StartPdModule
   ],
-  declarations: [AlertDialogComponent,HomePage,SalesPdComponent,AdvanceFilterComponent,SectionListComponent,Section9,QuesTemplateComponent],
+  declarations: [AlertDialogComponent,HomePage,SalesPdComponent,AdvanceFilterComponent,SectionListComponent,Section9,QuesTemplateComponent,CaptureBtnComponent,SingleCaptureBtnComponent],
-  entryComponents:[AlertDialogComponent,Section9,QuesTemplateComponent,HomePage],
+  entryComponents:[AlertDialogComponent,Section9,QuesTemplateComponent,HomePage,CaptureBtnComponent,SingleCaptureBtnComponent],
   providers:[ConstantsProvider,{ provide: MAT_DATE_LOCALE, useValue: 'en-GB' },{provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE]},
   {provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS},{ provide: MatDialogRef, useValue: {} },{ provide: MAT_DIALOG_DATA, useValue: [] }]
 })