import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { FlashMessagesService } from 'angular2-flash-messages';
import {Contactus} from '../contactus';
import {ContactService} from '../contact.service';

@Component({
  selector: 'app-support',
  templateUrl: './support.component.html',
  styles: [`
  .background-image{
    width: 100%;
   // height: 100%;

    margin: -16px;
    padding: 0;
    background-image: url('../../assets/image/Traffic-Blur.jpg');
    background-size: 100%;
    background-repeat: repeat;
  }
  .signal {
    border: 5px solid #333;
    border-radius: 30px;
    height: 30px;
    left: 25%;
    margin: -15px 0 0 -15px;
    opacity: 0;
    position: absolute;
    top: 50%;
    width: 30px;
 
    animation: pulsate 1s ease-out;
    animation-iteration-count: infinite;
}

@keyframes pulsate {
    0% {
      transform: scale(.1);
      opacity: 0.0;
    }
    50% {
      opacity: 1;
    }
    100% {
      transform: scale(1.2);
      opacity: 0;
    }
}
`],
  providers: [ContactService]
})
export class SupportComponent implements OnInit {
  call(e) {
    {
           if (e.keyCode == 32) {
               e.preventDefault();
           }
       }
}
  myFunction(){
  this.MapLoad = false
  }
  constructor(private contactService: ContactService,private router: Router,private _flashMessagesService: FlashMessagesService) { }

  email:any;
  title:any;
  Email:boolean=true;
  msg:any;
  MapLoad:boolean=true;
  phone:any;
  address:any;
  Contactuss: Contactus[]=[];
  Contactus: Contactus;
/*   checker(field,field2,maxlimit){
    function a(){
      
    }
  } */
  valid(){
    this.Email = true;
  }
  addContact(){
    if(this.email == null  && this.phone == null ){
      this._flashMessagesService.show("Please Enter either Email ID or Mobile Number", { cssClass: 'alert-danger', timeout: 2000 });
    }

    else   if(this.title == null || this.title == undefined){
      this._flashMessagesService.show("Please Enter Title", { cssClass: 'alert-danger', timeout: 2000 });
    }
    else  if(this.msg == null || this.msg == undefined){
      this._flashMessagesService.show("Please Enter Message", { cssClass: 'alert-danger', timeout: 2000 });
    }
    else {
      const newMsg ={
        email:this.email,
        title:this.title,
        msg:this.msg,
        phone:this.phone,
        dealerid:this.dealerid,
        dealerName:this.dealerName
        
      }
       
        this.contactService.contactus(newMsg)
        .subscribe(Contactus => {
              this.Email = false
              this.email = ' ';
              this.title = ' ';
              this.msg = ' ';
              this.phone = null
              
      this._flashMessagesService.show("Message Sent Succesfully", { cssClass: 'alert-success', timeout: 2000 });
           this.Contactuss.push(Contactus);
           }, (err: any) => { 
  
      this._flashMessagesService.show("Error Try Again", { cssClass: 'alert-danger', timeout: 2000 });
          console.log("Error"); 
  
        }
      );
    }

  }
  str:any;
  show2:any;
  show3:any;
  stren(){
    this.str =false;
  }
  click2(event2){
    this.show2=true;
    this.show3=false;
    
    }
    dealerid:any;
    mobile:any;
    facebook:any;
    dealerName:any

  ngOnInit() {
    this.dealerid = window.localStorage['DealerID'];
    this.address =  window.localStorage['address'];
    this.mobile = window.localStorage['mobile'];
    this.facebook = window.localStorage['facebook'];
    this.dealerName = window.localStorage['dealerName'];
  }
  
   detectmob() { 
    if( navigator.userAgent.match(/Android/i)
    || navigator.userAgent.match(/webOS/i)
    || navigator.userAgent.match(/iPhone/i)
    || navigator.userAgent.match(/iPad/i)
    || navigator.userAgent.match(/iPod/i)
    || navigator.userAgent.match(/BlackBerry/i)
    || navigator.userAgent.match(/Windows Phone/i)
    ){
       return true;
     }
    else {
       return false;
     }
   }

}