--- /dev/null
+import { Injectable } from '@angular/core';
+import { Response } from '@angular/http';
+import { Observable } from 'rxjs/Observable';
+
+import { AuthHttp, AuthService } from '../../shared';
+
+@Injectable()
+export class FriendService {
+ private static BASE_FRIEND_URL: string = '/api/v1/pods/';
+
+ constructor (private authHttp: AuthHttp, private authService: AuthService) {}
+
+ makeFriends() {
+ return this.authHttp.get(FriendService.BASE_FRIEND_URL + 'makefriends')
+ .map(res => res.status)
+ .catch(this.handleError);
+ }
+
+ quitFriends() {
+ return this.authHttp.get(FriendService.BASE_FRIEND_URL + 'quitfriends')
+ .map(res => res.status)
+ .catch(this.handleError);
+ }
+
+ private handleError (error: Response): Observable<number> {
+ console.error(error);
+ return Observable.throw(error.json().error || 'Server error');
+ }
+}
--- /dev/null
+export * from './friend.service';
export * from './users';
export * from './admin.component';
export * from './admin.routes';
+export * from './menu-admin.component';
--- /dev/null
+<menu class="col-md-2 col-sm-3 col-xs-3">
+
+ <div class="panel-block">
+ <div id="panel-users" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-user"></span>
+ <a [routerLink]="['/admin/users/list']">List users</a>
+ </div>
+
+ <div id="panel-make-friends" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-cloud"></span>
+ <a (click)='makeFriends()'>Make friends</a>
+ </div>
+
+ <div id="panel-quit-friends" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-plane"></span>
+ <a (click)='quitFriends()'>Quit friends</a>
+ </div>
+ </div>
+
+ <div class="panel-block">
+ <div id="panel-quit-administration" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-cog"></span>
+ <a (click)="quitAdmin()">Quit admin.</a>
+ </div>
+ </div>
+</menu>
--- /dev/null
+import { Component, Output, EventEmitter } from '@angular/core';
+import { ROUTER_DIRECTIVES } from '@angular/router';
+
+import { FriendService } from './friends';
+
+@Component({
+ selector: 'my-menu-admin',
+ template: require('./menu-admin.component.html'),
+ directives: [ ROUTER_DIRECTIVES ],
+ providers: [ FriendService ]
+})
+export class MenuAdminComponent {
+ @Output() quittedAdmin = new EventEmitter<boolean>();
+
+ constructor(private friendService: FriendService) {}
+
+ makeFriends() {
+ this.friendService.makeFriends().subscribe(
+ status => {
+ if (status === 409) {
+ alert('Already made friends!');
+ } else {
+ alert('Made friends!');
+ }
+ },
+ error => alert(error)
+ );
+ }
+
+ quitAdmin() {
+ this.quittedAdmin.emit(true);
+ }
+
+ quitFriends() {
+ this.friendService.quitFriends().subscribe(
+ status => {
+ alert('Quit friends!');
+ },
+ error => alert(error)
+ );
+ }
+}
<div class="row">
-
- <menu class="col-md-2 col-sm-3 col-xs-3">
- <div class="panel-block">
- <div id="panel-user-login" class="panel-button">
- <span *ngIf="!isLoggedIn" >
- <span class="hidden-xs glyphicon glyphicon-log-in"></span>
- <a [routerLink]="['/login']">Login</a>
- </span>
-
- <span *ngIf="isLoggedIn">
- <span class="hidden-xs glyphicon glyphicon-log-out"></span>
- <a *ngIf="isLoggedIn" (click)="logout()">Logout</a>
- </span>
- </div>
-
- <div *ngIf="isLoggedIn" id="panel-user-account" class="panel-button">
- <span class="hidden-xs glyphicon glyphicon-user"></span>
- <a [routerLink]="['/account']">My account</a>
- </div>
- </div>
-
- <div class="panel-block">
- <div id="panel-get-videos" class="panel-button">
- <span class="hidden-xs glyphicon glyphicon-list"></span>
- <a [routerLink]="['/videos/list']">Get videos</a>
- </div>
-
- <div id="panel-upload-video" class="panel-button" *ngIf="isLoggedIn">
- <span class="hidden-xs glyphicon glyphicon-cloud-upload"></span>
- <a [routerLink]="['/videos/add']">Upload a video</a>
- </div>
- </div>
-
- <div class="panel-block" *ngIf="isUserAdmin()">
- <div id="panel-users" class="panel-button">
- <span class="hidden-xs glyphicon glyphicon-user"></span>
- <a [routerLink]="['/admin/users/list']">List users</a>
- </div>
-
- <div id="panel-make-friends" class="panel-button">
- <span class="hidden-xs glyphicon glyphicon-cloud"></span>
- <a (click)='makeFriends()'>Make friends</a>
- </div>
-
- <div id="panel-quit-friends" class="panel-button">
- <span class="hidden-xs glyphicon glyphicon-plane"></span>
- <a (click)='quitFriends()'>Quit friends</a>
- </div>
- </div>
- </menu>
+ <my-menu *ngIf="isInAdmin === false" (enteredInAdmin)="onEnteredInAdmin()"></my-menu>
+ <my-menu-admin *ngIf="isInAdmin === true" (quittedAdmin)="onQuittedAdmin()"></my-menu-admin>
<div class="col-md-9 col-sm-8 col-xs-8 router-outlet-container">
<router-outlet></router-outlet>
</div>
-
</div>
margin-bottom: 30px;
}
-menu {
- @media screen and (max-width: 600px) {
- margin-right: 3px !important;
- padding: 3px !important;
- min-height: 400px !important;
- }
-
- min-height: 600px;
- margin-right: 20px;
- border-right: 1px solid rgba(0, 0, 0, 0.2);
-
- .panel-button {
- margin: 8px;
- cursor: pointer;
- transition: margin 0.2s;
-
- &:hover {
- margin-left: 15px;
- }
-
- a {
- color: #333333;
- }
- }
-
- .glyphicon {
- margin: 5px;
- }
-}
-
-.panel-block:not(:last-child) {
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-}
-
.router-outlet-container {
@media screen and (max-width: 400px) {
padding: 0 3px 0 3px;
import { Component } from '@angular/core';
-import { ActivatedRoute, Router, ROUTER_DIRECTIVES } from '@angular/router';
+import { ROUTER_DIRECTIVES } from '@angular/router';
-import { FriendService } from './friends';
-import {
- AuthService,
- AuthStatus,
- SearchComponent,
- SearchService
-} from './shared';
+import { MenuAdminComponent } from './admin';
+import { MenuComponent } from './menu.component';
+import { SearchComponent, SearchService } from './shared';
import { VideoService } from './videos';
@Component({
selector: 'my-app',
template: require('./app.component.html'),
styles: [ require('./app.component.scss') ],
- directives: [ ROUTER_DIRECTIVES, SearchComponent ],
- providers: [ FriendService, VideoService, SearchService ]
+ directives: [ MenuAdminComponent, MenuComponent, ROUTER_DIRECTIVES, SearchComponent ],
+ providers: [ VideoService, SearchService ]
})
export class AppComponent {
- choices = [];
- isLoggedIn: boolean;
+ isInAdmin = false;
- constructor(
- private authService: AuthService,
- private friendService: FriendService,
- private route: ActivatedRoute,
- private router: Router
- ) {
- this.isLoggedIn = this.authService.isLoggedIn();
-
- this.authService.loginChangedSource.subscribe(
- status => {
- if (status === AuthStatus.LoggedIn) {
- this.isLoggedIn = true;
- console.log('Logged in.');
- } else if (status === AuthStatus.LoggedOut) {
- this.isLoggedIn = false;
- console.log('Logged out.');
- } else {
- console.error('Unknown auth status: ' + status);
- }
- }
- );
- }
-
- isUserAdmin() {
- return this.authService.isAdmin();
- }
-
- logout() {
- this.authService.logout();
- // Redirect to home page
- this.router.navigate(['/videos/list']);
- }
-
- makeFriends() {
- this.friendService.makeFriends().subscribe(
- status => {
- if (status === 409) {
- alert('Already made friends!');
- } else {
- alert('Made friends!');
- }
- },
- error => alert(error)
- );
+ onEnteredInAdmin() {
+ this.isInAdmin = true;
}
- quitFriends() {
- this.friendService.quitFriends().subscribe(
- status => {
- alert('Quit friends!');
- },
- error => alert(error)
- );
+ onQuittedAdmin() {
+ this.isInAdmin = false;
}
}
+++ /dev/null
-import { Injectable } from '@angular/core';
-import { Response } from '@angular/http';
-import { Observable } from 'rxjs/Observable';
-
-import { AuthHttp, AuthService } from '../shared';
-
-@Injectable()
-export class FriendService {
- private static BASE_FRIEND_URL: string = '/api/v1/pods/';
-
- constructor (private authHttp: AuthHttp, private authService: AuthService) {}
-
- makeFriends() {
- return this.authHttp.get(FriendService.BASE_FRIEND_URL + 'makefriends')
- .map(res => res.status)
- .catch(this.handleError);
- }
-
- quitFriends() {
- return this.authHttp.get(FriendService.BASE_FRIEND_URL + 'quitfriends')
- .map(res => res.status)
- .catch(this.handleError);
- }
-
- private handleError (error: Response): Observable<number> {
- console.error(error);
- return Observable.throw(error.json().error || 'Server error');
- }
-}
+++ /dev/null
-export * from './friend.service';
--- /dev/null
+<menu class="col-md-2 col-sm-3 col-xs-3">
+ <div class="panel-block">
+ <div id="panel-user-login" class="panel-button">
+ <span *ngIf="!isLoggedIn" >
+ <span class="hidden-xs glyphicon glyphicon-log-in"></span>
+ <a [routerLink]="['/login']">Login</a>
+ </span>
+
+ <span *ngIf="isLoggedIn">
+ <span class="hidden-xs glyphicon glyphicon-log-out"></span>
+ <a *ngIf="isLoggedIn" (click)="logout()">Logout</a>
+ </span>
+ </div>
+
+ <div *ngIf="isLoggedIn" id="panel-user-account" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-user"></span>
+ <a [routerLink]="['/account']">My account</a>
+ </div>
+ </div>
+
+ <div class="panel-block">
+ <div id="panel-get-videos" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-list"></span>
+ <a [routerLink]="['/videos/list']">Get videos</a>
+ </div>
+
+ <div id="panel-upload-video" class="panel-button" *ngIf="isLoggedIn">
+ <span class="hidden-xs glyphicon glyphicon-cloud-upload"></span>
+ <a [routerLink]="['/videos/add']">Upload a video</a>
+ </div>
+ </div>
+
+ <div class="panel-block" *ngIf="isUserAdmin()">
+ <div id="panel-get-videos" class="panel-button">
+ <span class="hidden-xs glyphicon glyphicon-cog"></span>
+ <a (click)="enterInAdmin()">Administration</a>
+ </div>
+ </div>
+</menu>
--- /dev/null
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { Router, ROUTER_DIRECTIVES } from '@angular/router';
+
+import { AuthService, AuthStatus } from './shared';
+
+@Component({
+ selector: 'my-menu',
+ template: require('./menu.component.html'),
+ directives: [ ROUTER_DIRECTIVES ]
+})
+export class MenuComponent implements OnInit {
+ @Output() enteredInAdmin = new EventEmitter<boolean>();
+ isLoggedIn: boolean;
+
+ constructor (
+ private authService: AuthService,
+ private router: Router
+ ) {}
+
+ ngOnInit() {
+ this.isLoggedIn = this.authService.isLoggedIn();
+
+ this.authService.loginChangedSource.subscribe(
+ status => {
+ if (status === AuthStatus.LoggedIn) {
+ this.isLoggedIn = true;
+ console.log('Logged in.');
+ } else if (status === AuthStatus.LoggedOut) {
+ this.isLoggedIn = false;
+ console.log('Logged out.');
+ } else {
+ console.error('Unknown auth status: ' + status);
+ }
+ }
+ );
+ }
+
+ enterInAdmin() {
+ this.enteredInAdmin.emit(true);
+ }
+
+ isUserAdmin() {
+ return this.authService.isAdmin();
+ }
+
+ logout() {
+ this.authService.logout();
+ // Redirect to home page
+ this.router.navigate(['/videos/list']);
+ }
+}
import { bootstrap } from '@angular/platform-browser-dynamic';
import { provideRouter } from '@angular/router';
-import { AppComponent } from './app/app.component';
import { routes } from './app/app.routes';
import { AuthHttp, AuthService } from './app/shared';
+import { AppComponent } from './app/app.component';
if (process.env.ENV === 'production') {
enableProdMode();
}
}
+menu {
+ @media screen and (max-width: 600px) {
+ margin-right: 3px !important;
+ padding: 3px !important;
+ min-height: 400px !important;
+ }
+
+ min-height: 600px;
+ margin-right: 20px;
+ border-right: 1px solid rgba(0, 0, 0, 0.2);
+
+ .panel-block:not(:last-child) {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+ }
+
+ .panel-button {
+ margin: 8px;
+ cursor: pointer;
+ transition: margin 0.2s;
+
+ &:hover {
+ margin-left: 15px;
+ }
+
+ a {
+ color: #333333;
+ }
+ }
+
+ .glyphicon {
+ margin: 5px;
+ }
+}
+
+
footer {
border-top: 1px solid rgba(0, 0, 0, 0.2);
padding-top: 10px;
"src/app/account/index.ts",
"src/app/admin/admin.component.ts",
"src/app/admin/admin.routes.ts",
+ "src/app/admin/friends/friend.service.ts",
+ "src/app/admin/friends/index.ts",
"src/app/admin/index.ts",
+ "src/app/admin/menu-admin.component.ts",
"src/app/admin/users/index.ts",
"src/app/admin/users/shared/index.ts",
"src/app/admin/users/shared/user.service.ts",
"src/app/admin/users/users.routes.ts",
"src/app/app.component.ts",
"src/app/app.routes.ts",
- "src/app/friends/friend.service.ts",
- "src/app/friends/index.ts",
"src/app/login/index.ts",
"src/app/login/login.component.ts",
"src/app/login/login.routes.ts",
+ "src/app/menu.component.ts",
"src/app/shared/auth/auth-http.service.ts",
"src/app/shared/auth/auth-status.model.ts",
"src/app/shared/auth/auth-user.model.ts",