D-Net

import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';

import {Observable}       from 'rxjs/Observable';

import {AlertModal} from '../../utils/modal/alert';

import {OpenaireProperties} from '../../utils/properties/openaireProperties';

import {ReportsService} from '../../services/reports.service';

import {ModalLoading} from '../../utils/modal/loading.component';

@Component({

    selector: 'search-download',

    template: `

    <div class= "searchDownload" *ngIf="totalResults > 0">

        <p class="uk-text-right" *ngIf="totalResults <= 10000">

            <!--a (click)="download()" href="{{downloadURLAPI}}{{type}}?format=csv&page=0&size={{totalResults}}{{csvParams}}" -->

            <span class="clickable" (click)="downloadfile(downloadURLAPI+type+'?format=csv&page=0&size='+totalResults+csvParams,type+'-report-'+totalResults)">

                <span aria-hidden="true" class="glyphicon glyphicon-download"></span>

                <span uk-icon="icon: download"></span> Results (CSV)

            </span>

        </p>

    </div>

    <!--modal-alert></modal-alert-->

    <modal-loading></modal-loading>

    `

})

export class SearchDownloadComponent {

    @Input() totalResults:number = 0;

    @Input() csvParams: string;

    @Input() type: string;

    @ViewChild(AlertModal) alertApplyAll;

    @Output() downloadClick  = new EventEmitter();

    private downloadURLAPI: string;

    @ViewChild (ModalLoading) loading : ModalLoading ;

    constructor ( private _reportsService: ReportsService) {}

    ngOnInit() {

        this.downloadURLAPI = OpenaireProperties.getCsvAPIURL();

    }

    confirmClose(data){

    }

    download() {

        this.downloadClick.emit({

            value: true

        });

    }

    denialOfDownload() {

        this.alertApplyAll.isOpen = true;

        this.alertApplyAll.cancelButton = true;

        this.alertApplyAll.okButton = false;

        this.alertApplyAll.alertTitle = "Download Results in CSV";

        this.alertApplyAll.message = "Sorry, but the results are too many! Use the api instead!";

        this.alertApplyAll.cancelButtonText = "Ok";

        console.info("denial of Download");

    }

    downloadfile(url:string,filename:string){

      console.log("Downloading file: "+ url);

      this.openLoading();

      this.setMessageLoading("Downloading CSV file");

      this._reportsService.downloadCSVFile(url).subscribe(

          data => {

              this.closeLoading();

              window.open(window.URL.createObjectURL(data),filename+".csv")

          },

          error => console.log("Error downloading the file."),

          () => console.log('Completed file download.')

      );

    }

    public openLoading(){

      if(this.loading){

        this.loading.open();

      }

    }

    public closeLoading(){

      if(this.loading){

        this.loading.close();

      }

    }

    public setMessageLoading(message: string){

      if(this.loading){

        this.loading.message = message;

      }

    }

}