monitor/src/app/contact/contact.component.ts

import {Component, OnInit, Input, ElementRef, ViewChild} from '@angular/core';
import {FormGroup} from '@angular/forms';
import {ActivatedRoute, Router} from '@angular/router';
import {EmailService} from "../openaireLibrary/utils/email/email.service";
import {Email} from "../openaireLibrary/utils/email/email";
import {EnvProperties} from "../openaireLibrary/utils/properties/env-properties";
import {ContactForm} from "../openaireLibrary/utils/email/contact-form";
import {Composer} from "../openaireLibrary/utils/email/composer";
import {Meta, Title} from "@angular/platform-browser";
import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
import {HelperService} from "../openaireLibrary/utils/helper/helper.service";
import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";

@Component({
    selector: 'contact',
    templateUrl: './contact.component.html',
})

export class ContactComponent implements OnInit {
  public url: string = null;
  public pageTitle: string = "OpenAIRE - Connect | Contact Us";

  @Input('group')
  myForm: FormGroup;
  public piwiksub: any;
  public showLoading = true;
  public errorMessage = '';
  public isSubmitted = false;
  public email: Email;
  public note = '';
  public properties: EnvProperties = null;
  public pageContents = null;
  public divContents = null;

  public contactForm: ContactForm = new ContactForm();
  @ViewChild('AlertModal') modal;
  @ViewChild('name') name;
  @ViewChild('surname') surname;
  @ViewChild('sender') sender;
  @ViewChild('affiliation') affiliation;
  @ViewChild('community') community;
  @ViewChild('message') message;
  @ViewChild('recaptcha') recaptcha;

  constructor(private route: ActivatedRoute,
              private _router: Router,
              private _emailService: EmailService,
              private _meta: Meta,
              private _title: Title,
              private seoService: SEOService,
              private _piwikService: PiwikService,
              private helper: HelperService) {
  }

  ngOnInit() {
      this._title.setTitle('OpenAIRE-Connect | Contact Us');
      this.route.data.subscribe((data: { envSpecific: EnvProperties }) => {
          this.properties = data.envSpecific;
          this.email = {body: '', subject: '', recipients: []};

          if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) {
            this.piwiksub = this._piwikService.trackView(this.properties, this.pageTitle, this.properties.piwikSiteId).subscribe();
          }
          this.url = this.properties.baseLink + this._router.url;
          this.seoService.createLinkForCanonicalURL(this.url);
          this.updateUrl(this.url);
          this.updateTitle(this.pageTitle);
          this.updateDescription("OpenAIRE - Connect, Community Gateway, research community");

          //this.getDivContents();
          this.getPageContents();
          HelperFunctions.scroll();
          this.showLoading = false;
      });
  }

  private getPageContents() {
      this.helper.getPageHelpContents(this._router.url, this.properties, 'connect').subscribe(contents => {
          this.pageContents = contents;
      })
  }

  private getDivContents() {
      this.helper.getDivHelpContents(this._router.url, this.properties, 'connect').subscribe(contents => {
          this.divContents = contents;
      })
  }

  public send() {
      HelperFunctions.scroll();
      if(!this.name.invalid && !this.surname.invalid && !this.sender.invalid &&
          this.contactForm.email.match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$') &&
          !this.affiliation.invalid && !this.message.invalid && this.contactForm.recaptcha != '') {
          this.sendMail(this.properties.admins);
      }
      else {
          this.errorMessage = 'Please fill in all the required fields!'
          this.isSubmitted = true;
      }
  }

  public reset() {
      this.contactForm = new ContactForm();
      this.isSubmitted = false;
      this.errorMessage = '';
      this.contactForm.recaptcha = '';
  }

   private sendMail(admins: any) {
       this.showLoading = true;
       this._emailService.contact(this.properties.adminToolsAPIURL + '/contact',
                                    Composer.composeEmailForNewCommunity(this.contactForm, admins), this.contactForm.recaptcha).subscribe(
             res => {
                 if(res) {
                     this.reset();
                     this.modalOpen();
                     this.showLoading = false;
                 }
             },
             error => {
                 this.handleError('Email sent failed! Please try again.', error);
                 this.showLoading = false;
                 this.contactForm.recaptcha = '';
             }
       );
   }

  public modalOpen() {
      this.modal.okButton = true;
      this.modal.alertTitle = 'Your request has been successfully submitted';
      this.modal.alertMessage = false;
      this.modal.cancelButton = false;
      this.modal.okButtonLeft = false;
      this.modal.okButtonText = 'OK';
      this.modal.open();
  }

  public handleRecaptcha(captchaResponse: string) {
      this.contactForm.recaptcha = captchaResponse;
  }


  handleError(message: string, error) {
      this.errorMessage = message;
      console.log('Server responded: ' + error);

      this.showLoading = false;
  }

  public goToHome(data: any) {
      this._router.navigate(['/']);
  }

  private updateDescription(description: string) {
    this._meta.updateTag({content: description}, "name='description'");
    this._meta.updateTag({content: description}, "property='og:description'");
  }

  private updateTitle(title: string) {
    var _title = ((title.length > 50) ? title.substring(0, 50) : title);
    this._title.setTitle(_title);
    this._meta.updateTag({content: _title}, "property='og:title'");
  }

  private updateUrl(url: string) {
    this._meta.updateTag({content: url}, "property='og:url'");
  }
}