7 files changed, 73 insertions, 0 deletions

diff --git a/client/components/app/app.component.html b/client/components/app/app.component.html
new file mode 100644
index 000000000..5a841ca0f
--- /dev/null
+++ b/client/components/app/app.component.html
@@ -0,0 +1,23 @@
+<div class="container">
+  <div class="row">
+    <menu class="col-md-2">
+      <div id="panel_get_videos" class="panel_button">
+        <a [routerLink]="['VideosList']" class="glyphicon glyphicon-list">Get videos</a>
+      </div>
+
+      <div id="panel_upload_video" class="panel_button">
+        <a [routerLink]="['VideosAdd']" class="glyphicon glyphicon-cloud-upload">Upload a video</a>
+      </div>
+
+      <div id="panel_make_friends" class="panel_button">
+        <a (click)='makeFriends()' class="glyphicon glyphicon-user">Make friends</a>
+      </div>
+
+      <div id="panel_quit_friends" class="panel_button">
+        <a (click)='quitFriends()' class="glyphicon glyphicon-plane">Quit friends</a>
+      </div>
+    </menu>
+
+    <router-outlet class="col-md-9"></router-outlet>
+  </div>
+</div>
diff --git a/client/components/app/app.component.scss b/client/components/app/app.component.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/client/components/app/app.component.scss
diff --git a/client/components/app/app.component.ts b/client/components/app/app.component.ts
new file mode 100644
index 000000000..e2cebf535
--- /dev/null
+++ b/client/components/app/app.component.ts
@@ -0,0 +1,43 @@
+import {Component} from 'angular2/core';
+import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from 'angular2/router';
+
+import { VideosAddComponent } from '../videos/add/videos-add.component';
+import { VideosListComponent } from '../videos/list/videos-list.component';
+import { VideosWatchComponent } from '../videos/watch/videos-watch.component';
+
+@RouteConfig([
+  {
+    path: '/videos/list',
+    name: 'VideosList',
+    component: VideosListComponent,
+    useAsDefault: true
+  },
+  {
+    path: '/videos/watch/:id',
+    name: 'VideosWatch',
+    component: VideosWatchComponent
+  },
+  {
+    path: '/videos/add',
+    name: 'VideosAdd',
+    component: VideosAddComponent
+  }
+])
+
+@Component({
+    selector: 'my-app',
+    templateUrl: 'app/components/app/app.component.html',
+    styleUrls: [ 'app/components/app/app.component.css' ],
+    directives: [ ROUTER_DIRECTIVES ],
+    providers: [ ROUTER_PROVIDERS ]
+})
+
+export class AppComponent {
+  makeFriends() {
+    alert('make Friends');
+  }
+
+  quitFriends() {
+    alert('quit Friends');
+  }
+}
diff --git a/client/components/bootstrap.ts b/client/components/bootstrap.ts
new file mode 100644
index 000000000..d0f524f4a
--- /dev/null
+++ b/client/components/bootstrap.ts
@@ -0,0 +1,4 @@
+import { bootstrap }    from 'angular2/platform/browser';
+import { AppComponent } from './app/app.component';
+
+bootstrap(AppComponent);
diff --git a/client/components/videos/add/videos-add.component.ts b/client/components/videos/add/videos-add.component.ts
new file mode 100644
index 000000000..0db7c0163
--- /dev/null
+++ b/client/components/videos/add/videos-add.component.ts
@@ -0,0 +1 @@
+export class VideosAddComponent {}
diff --git a/client/components/videos/list/videos-list.component.ts b/client/components/videos/list/videos-list.component.ts
new file mode 100644
index 000000000..54470a5ad
--- /dev/null
+++ b/client/components/videos/list/videos-list.component.ts
@@ -0,0 +1 @@
+export class VideosListComponent {}
diff --git a/client/components/videos/watch/videos-watch.component.ts b/client/components/videos/watch/videos-watch.component.ts
new file mode 100644
index 000000000..84daef336
--- /dev/null
+++ b/client/components/videos/watch/videos-watch.component.ts
@@ -0,0 +1 @@
+export class VideosWatchComponent {}