From 63866a274603fd4b7cd5151a66fc4f27ef0e32b4 Mon Sep 17 00:00:00 2001
From: chsakell <chsakell@gmail.com>
Date: Fri, 30 Sep 2016 10:51:07 +0300
Subject: [PATCH] move match details to its own component

---
 app/app.component.ts                        |  2 +-
 app/app.module.ts                           |  8 ++++---
 app/home/home.component.html                | 26 +--------------------
 app/home/home.component.ts                  |  4 ++--
 app/shared/components/match.component.html  | 25 ++++++++++++++++++++
 app/shared/components/match.component.ts    | 16 +++++++++++++
 app/shared/{ => services}/config.service.ts |  0
 app/shared/{ => services}/data.service.ts   |  2 +-
 app/shared/{ => services}/feed.service.ts   |  2 +-
 9 files changed, 52 insertions(+), 33 deletions(-)
 create mode 100644 app/shared/components/match.component.html
 create mode 100644 app/shared/components/match.component.ts
 rename app/shared/{ => services}/config.service.ts (100%)
 rename app/shared/{ => services}/data.service.ts (94%)
 rename app/shared/{ => services}/feed.service.ts (96%)

diff --git a/app/app.component.ts b/app/app.component.ts
index 7617329..52efc7e 100644
--- a/app/app.component.ts
+++ b/app/app.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 
-import { FeedService } from './shared/feed.service';
+import { FeedService } from './shared/services/feed.service';
 import { ConnectionState } from './shared/interfaces';
 
 @Component({
diff --git a/app/app.module.ts b/app/app.module.ts
index be3fd0d..39f651a 100644
--- a/app/app.module.ts
+++ b/app/app.module.ts
@@ -4,9 +4,10 @@ import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';
 
 import { AppComponent } from './app.component';
-import { ConfigService } from './shared/config.service';
-import { DataService } from './shared/data.service';
+import { ConfigService } from './shared/services/config.service';
+import { DataService } from './shared/services/data.service';
 import { HomeComponent } from './home/home.component';
+import { MatchComponent } from './shared/components/match.component';
 import { routing } from './app.routes';
 
 @NgModule({
@@ -18,7 +19,8 @@ import { routing } from './app.routes';
     ],
     declarations: [
         AppComponent,
-        HomeComponent
+        HomeComponent,
+        MatchComponent
     ],
     bootstrap: [AppComponent],
     providers: [ 
diff --git a/app/home/home.component.html b/app/home/home.component.html
index daed21d..cea8b66 100644
--- a/app/home/home.component.html
+++ b/app/home/home.component.html
@@ -1,29 +1,5 @@
 <div class="row">
     <div class="col-xs-6 col-md-4" *ngFor="let match of matches">
-        <table class="table table-bordered box">
-            <thead>
-                <tr>
-                    <th>Team</th>
-                    <th>Score</th>
-                </tr>
-            </thead>
-            <tbody>
-                <tr>
-                    <td><span class="teamName">{{match.host}}</span></td>
-                    <td><span class="teamScore"> {{match.hostScore}} </span></td>
-                </tr>
-                <tr>
-                    <td><span class="teamName"> {{match.guest}} </span></td>
-                    <td><span class="teamScore">{{match.guestScore}}</span></td>
-                </tr>
-                <tr>
-                    <td colspan="2">
-                        <button type="button" class="btn btn-default btn-lg btn-block">
-                            Subscribe to feed
-                        </button>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
+        <match [match]="match"></match>
     </div>
 </div>
\ No newline at end of file
diff --git a/app/home/home.component.ts b/app/home/home.component.ts
index f87ab06..f5a2b91 100644
--- a/app/home/home.component.ts
+++ b/app/home/home.component.ts
@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 
-import { FeedService } from '../shared/feed.service';
+import { FeedService } from '../shared/services/feed.service';
 import { Match } from '../shared/interfaces';
-import { DataService } from '../shared/data.service';
+import { DataService } from '../shared/services/data.service';
 import { ConnectionState } from '../shared/interfaces';
 
 @Component({
diff --git a/app/shared/components/match.component.html b/app/shared/components/match.component.html
new file mode 100644
index 0000000..7c7e21c
--- /dev/null
+++ b/app/shared/components/match.component.html
@@ -0,0 +1,25 @@
+<table class="table table-bordered box">
+    <thead>
+        <tr>
+            <th>Team</th>
+            <th>Score</th>
+        </tr>
+    </thead>
+    <tbody>
+        <tr>
+            <td><span class="teamName">{{match.host}}</span></td>
+            <td><span class="teamScore"> {{match.hostScore}} </span></td>
+        </tr>
+        <tr>
+            <td><span class="teamName"> {{match.guest}} </span></td>
+            <td><span class="teamScore">{{match.guestScore}}</span></td>
+        </tr>
+        <tr>
+            <td colspan="2">
+                <button type="button" class="btn btn-default btn-lg btn-block">
+                            Subscribe to feed
+                        </button>
+            </td>
+        </tr>
+    </tbody>
+</table>
\ No newline at end of file
diff --git a/app/shared/components/match.component.ts b/app/shared/components/match.component.ts
new file mode 100644
index 0000000..0ced8ec
--- /dev/null
+++ b/app/shared/components/match.component.ts
@@ -0,0 +1,16 @@
+import { Component, OnInit, Input } from '@angular/core';
+
+import { Match } from '../interfaces';
+
+@Component({
+    selector: 'match',
+    templateUrl: 'app/shared/components/match.component.html'
+})
+export class MatchComponent implements OnInit {
+
+    @Input() match: Match;
+
+    constructor() { }
+
+    ngOnInit() { }
+}
\ No newline at end of file
diff --git a/app/shared/config.service.ts b/app/shared/services/config.service.ts
similarity index 100%
rename from app/shared/config.service.ts
rename to app/shared/services/config.service.ts
diff --git a/app/shared/data.service.ts b/app/shared/services/data.service.ts
similarity index 94%
rename from app/shared/data.service.ts
rename to app/shared/services/data.service.ts
index d58cafd..380ec40 100644
--- a/app/shared/data.service.ts
+++ b/app/shared/services/data.service.ts
@@ -6,7 +6,7 @@ import {Observer} from 'rxjs/Observer';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/catch';
 
-import { Match } from './interfaces';
+import { Match } from '../interfaces';
 import { ConfigService } from './config.service';
 
 @Injectable()
diff --git a/app/shared/feed.service.ts b/app/shared/services/feed.service.ts
similarity index 96%
rename from app/shared/feed.service.ts
rename to app/shared/services/feed.service.ts
index 4479038..3f64fd6 100644
--- a/app/shared/feed.service.ts
+++ b/app/shared/services/feed.service.ts
@@ -5,7 +5,7 @@ import 'rxjs/add/operator/toPromise';
 import { Observable } from "rxjs/Observable";
 import { Subject } from "rxjs/Subject";
 
-import { FeedSignalR, FeedProxy, FeedClient, ConnectionState } from './interfaces';
+import { FeedSignalR, FeedProxy, FeedClient, ConnectionState } from '../interfaces';
 
 @Injectable()
 export class FeedService {