import {Component, OnInit, ViewChild} from '@angular/core';
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 {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";
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
import {Breadcrumb} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.component";
import {Subscriber} from "rxjs";

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

export class ContactComponent implements OnInit {
    public url: string = null;
    public pageTitle: string = "OpenAIRE - Connect | Contact Us";
    public showLoading = true;
    public errorMessage = '';
    public email: Email;
    public properties: EnvProperties = null;
    public pageContents = null;
    public divContents = null;
    public breadcrumbs: Breadcrumb[] = [{name: 'home', route: '/'}, {name: 'contact us'}];

    public contactForm: FormGroup;
    @ViewChild('AlertModal') modal;
    @ViewChild('recaptcha') recaptcha;
    private subscriptions = [];
    ngOnDestroy() {
        this.subscriptions.forEach(subscription => {
            if (subscription instanceof Subscriber) {
                subscription.unsubscribe();
            }
        });
    }

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

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

            if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) {
                this.subscriptions.push( this._piwikService.trackView(this.properties, this.pageTitle, this.properties.piwikSiteId).subscribe());
            }
            this.url = this.properties.domain + this._router.url;
            this.seoService.createLinkForCanonicalURL(this.url);
            this.updateUrl(this.url);
            this.updateTitle(this.pageTitle);
            this.updateDescription("Contact us to learn more about OpenAIRE Connect Research Gateways");
            this.reset();
            //this.getDivContents();
            this.getPageContents();
            HelperFunctions.scroll();
            this.showLoading = false;
        }));
    }

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

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

    public send(event) {
        HelperFunctions.scroll();
        if(event.valid === true) {
            this.sendMail(this.properties.admins);
        } else {
            this.errorMessage = 'Please fill in all the required fields!';
        }
    }

    public reset() {
        this.contactForm = this.fb.group( {
            name: this.fb.control('', Validators.required),
            surname: this.fb.control('', Validators.required),
            email: this.fb.control('', [Validators.required, Validators.email]),
            affiliation: this.fb.control('', Validators.required),
            community: this.fb.control('', Validators.required),
            message: this.fb.control('', Validators.required),
            recaptcha: this.fb.control('', Validators.required),
        });
        this.errorMessage = '';
    }

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

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

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

    public goToHome() {
        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'");
    }
}