import { Component, Input, OnChanges } from "@angular/core";
import { ActivatedRoute, Params }   from '@angular/router';
import { Router }        from '@angular/router';

import { DesignerType } from '../../../types/designer';

import { DesignerService } from '../../../services/svc.designer';

@Component({
    moduleId: module.id+ '',
    selector: 'designer',
    templateUrl: './tpl.designer.pug',
    styleUrls: ['./sty.designer.scss'],
    providers: [DesignerService]
})

export class DesignerComponent implements OnChanges {
   
    @Input() who: string;

    designers = [];
    description: string;
    readmore: any = [];

    tmpDesigner: DesignerType[];

    constructor(
        private _router: Router,
        private route: ActivatedRoute,
        private _designerService: DesignerService
    ) {}

    ngOnChanges(): void {

        this.designers = [];

        for(let designer of this.who) {

            this._designerService.httpGetDesigners(designer).then((response) => {

                if(!!response){
                    for(let designer of response) {
                        this.designers.push(designer)
                        this.readmore.push(0)
                    }
                }
            })
            
        }
    }

    readMore(element:any) {
        this.readmore[element] = 1;
    }

    sanitize(string:string): string {
        return string.replace('-', ' ');
    }
}