Skeleton code for angular lab 2

date-string.pipe.js

import {Pipe} from 'angular2/core';

@Pipe({
    name: 'dateString'
})
class DateStringPipe {

    transform(dateString: string, args: string[]) {
        const [, year, month, day] = /^(\d\d\d\d)-(\d\d)-(\d\d)$/.exec(dateString) || [,,,,];
    }

}

export default DateStringPipe;
export {DateStringPipe};

search-input.js

import {Component, Output, EventEmitter} from 'angular2/core';

@Component({
    selector: 'search-input',
    template: `
        <form>
            <div class="input-group">
                <input type="search" class="form-control">
                <span class="input-group-btn">
                    <button class="btn btn-primary">Search</button>
                </span>
            </div>
        </form>
    `
})
class SearchInputComponent {
    @Output('search') searchEmitter = new EventEmitter<string>();
}

export default SearchInputComponent;
export {SearchInputComponent};

search-result.js

import {Component, Input, Output, EventEmitter} from 'angular2/core';
import {DateStringPipe} from './date-string.pipe';

@Component({
    selector: 'search-result',
    template: `
        <figure class="figure" *ngFor="#show of searchResultStream | async">
            <img [src]="show.image?.medium" [alt]="show.name" class="figure-img img-fluid img-rounded" />
            <figcaption class="figure-caption">Show name (2015)</figcaption>
        </figure>
    `,
    pipes: [DateStringPipe]
})
class SearchResult {
    @Input('resultStream') searchResultStream;
    @Output() subscribe = new EventEmitter();
}

export default SearchResult;
export {SearchResult};

search.component.js

import {Component, EventEmitter} from 'angular2/core';
import {Router} from 'angular2/router';
import {SearchInputComponent} from './search-input';
import {SearchResult} from './search-result';
import {TVMaze, SubscribeService} from '../lib/providers';

@Component({
    selector: 'search-show',
    template: `
        <search-input (search)="onSearch($event)"></search-input>
        <search-result [resultStream]="searchResultStream" (subscribe)="onSubscribeShow($event)"></search-result>
    `,
    directives: [SearchInputComponent, SearchResult]
})
class SearchComponent {
    tvMaze: TVMaze;
    service: SubscribeService;
    router: Router;
    searchEmitter = new EventEmitter<string>();
    searchResultStream;

    constructor(tvMaze: TVMaze, router: Router, service: SubscribeService) {
        this.tvMaze = tvMaze;
        this.service = service;
        this.router = router;
        this.bindSearchEvent();
    }

    onSearch(term) {
        console.log('We have a new serach string:', term);
    }

    onSubscribeShow(show) {
        console.log('Subscribe on show', show);
    }

    bindSearchEvent() {
        this.searchResultStream = this.searchEmitter
            .map(searchString => {
                console.log('searchString: ', searchString);
                return {}; // Make an ajax request instead
            });
    }

}

export default SearchComponent;
export {SearchComponent};