* Result.BUILDING added

* team editor is mostly done
* commit tracker works and is styled
* added new components for slide editor, still empty
* team resolver service

src/app/admin/admin-routing.module.ts

@@ -3,6 +3,8 @@ import { RouterModule, Routes } from '@angular/router';
 
 import { TeamListComponent} from './team-list/team-list.component';
 import { TeamService } from '../shared/service/team.service';
+import { TeamResolverService } from './team-resolver.service';
+import { TeamEditorComponent } from './team-editor/team-editor.component';
 
 const routes: Routes = [
   {
@@ -12,6 +14,13 @@ const routes: Routes = [
     resolve: {
       teams: TeamService,
     },
+  }, {
+    path: 'admin/team/edit/:id',
+    component: TeamEditorComponent,
+    // canActivate: [AuthGuardService, RoleGuardService],
+    resolve: {
+      team: TeamResolverService,
+    },
   }
 ];
 

src/app/admin/admin.module.ts

@@ -1,15 +1,21 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 
 import { AdminRoutingModule } from './admin-routing.module';
 import { TeamListComponent } from './team-list/team-list.component';
+import { TeamEditorComponent } from './team-editor/team-editor.component';
+import { SlideEditorComponent } from './slide-editor/slide-editor.component';
+import { SlideListComponent } from './slide-list/slide-list.component';
+import { TeamResolverService } from './team-resolver.service';
 
 @NgModule({
   imports: [
     CommonModule,
+    FormsModule,
     AdminRoutingModule
   ],
-  declarations: [TeamListComponent],
-  providers: []
+  declarations: [TeamListComponent, TeamEditorComponent, SlideEditorComponent, SlideListComponent],
+  providers: [TeamResolverService]
 })
 export class AdminModule { }

src/app/admin/slide-editor/slide-editor.component.html

@@ -0,0 +1,3 @@
+<p>
+  slide-editor works!
+</p>

src/app/admin/slide-editor/slide-editor.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SlideEditorComponent } from './slide-editor.component';
+
+describe('SlideEditorComponent', () => {
+  let component: SlideEditorComponent;
+  let fixture: ComponentFixture<SlideEditorComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SlideEditorComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SlideEditorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/slide-editor/slide-editor.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-slide-editor',
+  templateUrl: './slide-editor.component.html',
+  styleUrls: ['./slide-editor.component.css']
+})
+export class SlideEditorComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/admin/slide-list/slide-list.component.html

@@ -0,0 +1,3 @@
+<p>
+  slide-list works!
+</p>

src/app/admin/slide-list/slide-list.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SlideListComponent } from './slide-list.component';
+
+describe('SlideListComponent', () => {
+  let component: SlideListComponent;
+  let fixture: ComponentFixture<SlideListComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SlideListComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SlideListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/slide-list/slide-list.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-slide-list',
+  templateUrl: './slide-list.component.html',
+  styleUrls: ['./slide-list.component.css']
+})
+export class SlideListComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/admin/team-editor/team-editor.component.html

@@ -0,0 +1,53 @@
+<div class="ui main container">
+    <h1 class="ui dividing header">Team editor</h1>
+
+    <form class="ui form" #teamEditorForm (ngSubmit)="saveTeam()">
+        <div class="six wide field">
+            <label for="team_name">Team name</label>
+            <input id="team_name" type="text" name="team_name" [(ngModel)]="team.name">
+        </div>
+        <button type="submit" class="ui positive button">Save changes</button>
+
+        <h4 class="ui dividing header">Team members</h4>
+        <div class="three inline fields">
+            <div class="two wide field">
+                <button type="button" class="ui fluid button"
+                        [class.positive]="canAddMember"
+                        [class.disabled]="!canAddMember"
+                        (click)="addMember()">Add
+                </button>
+            </div>
+            <div class="five wide field">
+                <input type="text"
+                       name="member_signum"
+                       placeholder="Signum"
+                       [(ngModel)]="member.signum">
+            </div>
+            <div class="nine wide field">
+                <input type="text"
+                       name="member_name"
+                       placeholder="Display name"
+                       [(ngModel)]="member.name">
+            </div>
+        </div>
+        <h4 class="ui dividing header"></h4>
+        <table class="ui celled definition table">
+            <thead>
+            <tr>
+                <th class="collapsing"></th>
+                <th class="collapsing"><i class="large user outline icon"></i>Signum</th>
+                <th><i class="large id card outline icon"></i>Display name</th>
+            </tr>
+            </thead>
+            <tbody>
+            <tr *ngFor="let member of team.members">
+                <td class="collapsing"><a title="Remove" (click)="removeMember(member.signum)"><i
+                        class="large fitted red trash alternate outline icon"></i></a></td>
+                <td class="collapsing">{{member.signum}}</td>
+                <td>{{member.name}}</td>
+            </tr>
+            </tbody>
+        </table>
+
+    </form>
+</div>

src/app/admin/team-editor/team-editor.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TeamEditorComponent } from './team-editor.component';
+
+describe('TeamEditorComponent', () => {
+  let component: TeamEditorComponent;
+  let fixture: ComponentFixture<TeamEditorComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TeamEditorComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TeamEditorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/team-editor/team-editor.component.ts

@@ -0,0 +1,53 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Title } from '@angular/platform-browser';
+
+import { TeamService } from '../../shared/service/team.service';
+import { Team } from '../../shared/team';
+import { Member } from '../../shared/member';
+
+@Component({
+  selector: 'app-team-editor',
+  templateUrl: './team-editor.component.html',
+  styleUrls: ['./team-editor.component.css']
+})
+export class TeamEditorComponent implements OnInit {
+  public team: Team = new Team();
+  public member: Member = new Member();
+
+  constructor(private teamService: TeamService,
+              private titleService: Title,
+              private route: ActivatedRoute,
+              private router: Router) {
+  }
+
+  ngOnInit() {
+    this.titleService.setTitle('Team editor : MTAStv');
+    this.route.data.subscribe((data: { team: Team }) => this.team = data.team);
+  }
+
+  get canAddMember(): boolean {
+    try {
+      return [this.member.name, this.member.signum].every(field => field.length !== 0);
+    } catch (e) {
+      return false;
+    }
+  }
+
+  public addMember() {
+    this.team.members = this.team.members.concat(Object.assign({}, this.member));
+    this.member = new Member();
+  }
+
+  public removeMember(signum: String) {
+    if (confirm(`Remove the member with signum ${signum}?`)) {
+      this.team.members = this.team.members.filter(member => member.signum !== signum);
+    }
+  }
+
+  public saveTeam() {
+    this.teamService.update(this.team).subscribe(
+      () => this.router.navigate(['/admin/teams/list'])
+    );
+  }
+}

src/app/admin/team-list/team-list.component.html

@@ -1,26 +1,22 @@
 <div class="ui main container">
     <h1 class="ui dividing header">Teams</h1>
-    <div class="ui raised segments">
-        <div class="ui segment">
-            <table *ngIf="teams?.length" class="ui celled definition table">
-                <thead>
-                <tr>
-                    <th></th>
-                    <th class="clickable">Team</th>
-                    <th class="clickable">Members</th>
-                </tr>
-                </thead>
-                <tbody>
-                <tr *ngFor="let team of teams">
-                    <td class="collapsing">
-                        <a [routerLink]="['/team/edit', team.id]" title="Change"><i
-                                class="large edit link icon"></i></a>
-                    </td>
-                    <td>{{team.name}}</td>
-                    <td>{{fancyMemberNames(team)}}</td>
-                </tr>
-                </tbody>
-            </table>
-        </div>
-    </div>
+    <table *ngIf="teams?.length" class="ui large padded celled definition table">
+        <thead>
+        <tr>
+            <th></th>
+            <th class="clickable"><i class="large address book outline icon"></i>Team</th>
+            <th class="clickable"><i class="large users icon"></i>Members</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr *ngFor="let team of teams">
+            <td class="collapsing">
+                <a [routerLink]="['/admin/team/edit', team.id]" title="Change"><i
+                        class="large fitted pencil alternate icon"></i></a>
+            </td>
+            <td>{{team.name}}</td>
+            <td>{{fancyMemberNames(team)}}</td>
+        </tr>
+        </tbody>
+    </table>
 </div>

src/app/admin/team-resolver.service.spec.ts

@@ -0,0 +1,15 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { TeamResolverService } from './team-resolver.service';
+
+describe('TeamResolverService', () => {
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [TeamResolverService]
+    });
+  });
+
+  it('should be created', inject([TeamResolverService], (service: TeamResolverService) => {
+    expect(service).toBeTruthy();
+  }));
+});

src/app/admin/team-resolver.service.ts

@@ -0,0 +1,21 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, RouterStateSnapshot } from '@angular/router';
+import { Team } from '../shared/team';
+import { environment } from '../../environments/environment';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs/Observable';
+
+@Injectable()
+export class TeamResolverService implements Resolve<Team> {
+  private apiEndPoint = environment.apiUrl + '/api/team';
+
+  constructor(private httpClient: HttpClient) {}
+
+  public resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<Team> {
+    return this.getTeam(route.params['id']).toPromise();
+  }
+
+  public getTeam(id: Number): Observable<Team> {
+    return this.httpClient.get<Team>(`${this.apiEndPoint}/${id}`);
+  }
+}