diff --git a/package.json b/package.json index ff930f3..f72946a 100644 --- a/package.json +++ b/package.json @@ -21,10 +21,11 @@ "@angular/platform-browser-dynamic": "2.4.7", "@angular/router": "3.4.7", "angularfire2": "^2.0.0-beta.7", - "firebase": "3.6.9", "bootstrap": "3.3.7", "core-js": "2.4.1", + "firebase": "3.6.9", "ng2-bootstrap": "^1.3.3", + "ng2-dnd": "^2.2.2", "rxjs": "5.0.3", "ts-helpers": "1.1.2", "zone.js": "0.7.6" diff --git a/src/app/app.component.html b/src/app/app.component.html index 70462b4..c952a6b 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,16 +1,12 @@
-

+

{{title}}

-
- -
-
- -
-
- + +
+ +
\ No newline at end of file diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts deleted file mode 100644 index 4141d1d..0000000 --- a/src/app/app.component.spec.ts +++ /dev/null @@ -1,41 +0,0 @@ -/* tslint:disable:no-unused-variable */ -import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import {TestBed, async} from "@angular/core/testing"; -import {AppComponent} from "./app.component"; -import {AuthService} from "app/shared/auth.service"; -import {AuthServiceStub} from "app/shared/auth.service.stub"; - -describe('AppComponent', () => { - beforeEach(() => { - let authServiceStub = new AuthServiceStub(true); - - TestBed.configureTestingModule({ - declarations: [ - AppComponent - ], - schemas: [CUSTOM_ELEMENTS_SCHEMA], - providers: [ - {provide: AuthService, useValue: authServiceStub} - ] - });; - }); - - it('should create the app', async(() => { - let fixture = TestBed.createComponent(AppComponent); - let app = fixture.debugElement.componentInstance; - expect(app).toBeTruthy(); - })); - - it(`should have as title 'app works!'`, async(() => { - let fixture = TestBed.createComponent(AppComponent); - let app = fixture.debugElement.componentInstance; - expect(app.title).toEqual('app works! - kanban2'); - })); - - it('should render title in a h1 tag', async(() => { - let fixture = TestBed.createComponent(AppComponent); - fixture.detectChanges(); - let compiled = fixture.debugElement.nativeElement; - expect(compiled.querySelector('h1').textContent).toContain('app works! - kanban2'); - })); -}); diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 7b9cc33..e850680 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,19 +1,67 @@ -import {Component} from "@angular/core"; -import {AuthService} from "app/shared/auth.service"; +import {Component, OnInit} from "@angular/core"; +import {DataService} from "app/shared/data.service"; import {Observable} from "rxjs"; +import {Project} from "app/models/project-info"; +import {CardList} from "app/models/cardlist-info"; +import {Card} from "app/models/card-info"; + @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) -export class AppComponent { - title = 'app works! - kanban2'; +export class AppComponent implements OnInit { + title = 'The Kanban Board'; + projects: Project[]; + cardlists: CardList[]; - constructor(private authService: AuthService) { + constructor(private dataService: DataService) { } - isLoggedIn(): Observable { - return this.authService.isLoggedIn(); + ngOnInit(){ + this.dataService.getProjects() + .subscribe(data => { + this.projects = data; + let firstProject = this.projects[0]; + //console.log(firstProject); + // this.addAddCardList( + // 'Done', + // firstProject.$key, + // 'green' + // ); + }); + this.dataService.getCardLists() + .subscribe(c => this.cardlists = c) + ; + this.dataService.getCards(); + this.dataService.getTasks(); + //this.addProject("TestProject1"); } + + addProject(name: string) + { + let created_at = new Date().toString(); + let newProject:Project = new Project(); + newProject.name = name; + newProject.created_at= created_at; + this.dataService.addProject(newProject); + } + + addCardList( + name: string, + projectId: string, + color: string, + order: number) + { + let created_at = new Date().toString(); + let newCardList:CardList = new CardList(); + newCardList.name = name; + newCardList.projectId = projectId; + newCardList.color = color; + newCardList.order = order; + newCardList.created_at = created_at; + this.dataService.addCardList(newCardList); + } + } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 34e9d1b..9068be1 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,18 +5,19 @@ import {HttpModule} from "@angular/http"; import {AppComponent} from "./app.component"; import {authConfig, firebaseConfig} from "environments/firebaseConfig"; import {AngularFireModule} from "angularfire2"; -import {AuthService} from "app/shared/auth.service"; -import {LoginUserComponent} from "app/login-user/login-user.component"; -import {DisplayUserComponent} from "app/display-user/display-user.component"; -import {RegisterUserComponent} from "app/register-user/register-user.component"; import {AlertModule} from "ng2-bootstrap"; +import {ModalModule} from 'ng2-bootstrap'; + +import {DataService} from "app/shared/data.service"; +import {CardListComponent} from "app/cardlist/cardlist.component"; +import {CardComponent} from "app/card/card.component"; +import {DndModule} from 'ng2-dnd'; @NgModule({ declarations: [ AppComponent, - DisplayUserComponent, - LoginUserComponent, - RegisterUserComponent + CardListComponent, + CardComponent ], imports: [ BrowserModule, @@ -24,9 +25,11 @@ import {AlertModule} from "ng2-bootstrap"; ReactiveFormsModule, HttpModule, AlertModule.forRoot(), + ModalModule.forRoot(), + DndModule.forRoot(), AngularFireModule.initializeApp(firebaseConfig, authConfig) ], - providers: [AuthService], + providers: [DataService], bootstrap: [AppComponent] }) export class AppModule { diff --git a/src/app/card/card.component.css b/src/app/card/card.component.css new file mode 100644 index 0000000..8c0217d --- /dev/null +++ b/src/app/card/card.component.css @@ -0,0 +1,38 @@ +.cardTitle{ + margin-left: 10px; + font-size: 1em; + font-weight: bold; +} +.cardDesc{ + margin-left: 10px; +} +.tasklist{ + margin: 10px; +} +.newtask +{ + font-size: 0.8em; +} +.link{ + cursor: pointer; +} +.carret{ + display: inline-block; + cursor: pointer; +} +.titleText{ + display: inline-block; +} +.modal-header { + padding:9px 15px; + border-bottom:1px solid #eee; + background-color: #ff4040; + -webkit-border-top-left-radius: 5px; + -webkit-border-top-right-radius: 5px; + -moz-border-radius-topleft: 5px; + -moz-border-radius-topright: 5px; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + color: white; + font-weight: bold; + } \ No newline at end of file diff --git a/src/app/card/card.component.html b/src/app/card/card.component.html new file mode 100644 index 0000000..b696e0c --- /dev/null +++ b/src/app/card/card.component.html @@ -0,0 +1,48 @@ +
+
+ + +
+
+ {{item.name}} +
+
+
+
+ {{item.description}} +
+
+
+ + + {{task.description}} + + +
+
+
+
+ +
+
+
+ + + + \ No newline at end of file diff --git a/src/app/card/card.component.ts b/src/app/card/card.component.ts new file mode 100644 index 0000000..c66fe77 --- /dev/null +++ b/src/app/card/card.component.ts @@ -0,0 +1,65 @@ +import {Component, OnInit, Input, ViewChild} from "@angular/core"; +import {DataService} from "app/shared/data.service"; +import {Observable} from "rxjs"; +import {CardList} from "app/models/cardlist-info"; +import {Card} from "app/models/card-info"; +import {Task} from "app/models/task-info"; +import { ModalDirective } from 'ng2-bootstrap/modal'; + +@Component({ + selector: 'card', + templateUrl: './card.component.html', + styleUrls: ['./card.component.css'] +}) +export class CardComponent implements OnInit { + @ViewChild('childModal') public childModal:ModalDirective; + @Input() item: Card; + tasks : Task[] + + newtaskdesc; + + + constructor(private dataService: DataService) { + //console.log(this.item); + } + + ngOnInit() { + //console.log(this.item); + this.dataService.getTasksByCardId(this.item.$key) + .subscribe(data => { + this.tasks = data; + }) + } + + addNewTask(){ + //console.log('Add new subtask!'); + let newTask = new Task(); + newTask.cardId = this.item.$key; + newTask.description = this.newtaskdesc; + newTask.isCompleted = false; + newTask.order = 0; + newTask.created_at = new Date().toString(); + this.dataService.addTask(newTask) + .then(() => { + this.newtaskdesc = ''; + }); + } + + deleteTask(task){ + //console.log(task); + this.childModal.show(); + } + public hideChildModal():void { + this.childModal.hide(); + } + + changeTaskCompleted(task){ + //console.log(task); + this.dataService.updateTask(task.$key, task); + } + + clickCarret(){ + this.item.isExpanded = !this.item.isExpanded; + this.dataService.updateCard(this.item.$key,this.item); + } +} diff --git a/src/app/cardlist/cardlist.component.css b/src/app/cardlist/cardlist.component.css new file mode 100644 index 0000000..3f9841f --- /dev/null +++ b/src/app/cardlist/cardlist.component.css @@ -0,0 +1,79 @@ +.card{ + background-color: lightblue; + border: solid 1px; + border-left-width: 5px; + margin: 15px; +} +.cardTitle{ + margin-left: 10px; + font-size: 1em; +} +.cardDesc{ + margin-left: 10px; +} +.createCard{ + padding: 10px; + /*background-color: lightcyan;*/ +} +.fullScreen{ + position: fixed; + width: 100%; + height: 100%; + left: 0; + top: 0; + clear: both; + background: black; + opacity: 0.3; + padding-left: 35%; + padding-right: 35%; + padding-top: 35%; + padding-bottom: 15%; + z-index: 100; +} +.fullScreentransparent{ + position: absolute; + clear: both; + width: 100%; + height: 100%; + left: 0; + top: 0; + background: transparent; + z-index: 101; +} +.link{ + cursor: pointer; +} +.createTitle{ + font-weight: bold; + color: white; +} +.formfields{ + margin-top: 10px; +} + + + +.dnd-drag-start { + -moz-transform:scale(0.8); + -webkit-transform:scale(0.8); + transform:scale(0.8); + opacity:0.7; + border: 2px dashed #000; +} + +.dnd-drag-enter { + opacity:0.7; + border: 2px dashed #000; +} + +.dnd-drag-over { + border: 2px dashed #000; +} + +.dnd-sortable-drag { + -moz-transform:scale(0.9); + -webkit-transform:scale(0.9); + transform:scale(0.9); + opacity:0.7; + border: 1px dashed #000; +} \ No newline at end of file diff --git a/src/app/cardlist/cardlist.component.html b/src/app/cardlist/cardlist.component.html new file mode 100644 index 0000000..97ae65f --- /dev/null +++ b/src/app/cardlist/cardlist.component.html @@ -0,0 +1,50 @@ +
+
+

+ {{item.name}} +   + +

+
+
+
    +
  • + + +
    • +
+
+
+ +
+
+
+
+
+

New task - {{ item.name }} +
+ +
+

+
+
+ + + + +
+
+ +
+
+
\ No newline at end of file diff --git a/src/app/cardlist/cardlist.component.ts b/src/app/cardlist/cardlist.component.ts new file mode 100644 index 0000000..67a9ce9 --- /dev/null +++ b/src/app/cardlist/cardlist.component.ts @@ -0,0 +1,107 @@ +import {Component, OnInit, Input} from "@angular/core"; +import {DataService} from "app/shared/data.service"; +import {Observable} from "rxjs"; +import {CardList} from "app/models/cardlist-info"; +import {Card} from "app/models/card-info"; +import {Task} from "app/models/task-info"; + +@Component({ + selector: 'cardlist', + templateUrl: './cardlist.component.html', + styleUrls: ['./cardlist.component.css'] +}) +export class CardListComponent implements OnInit { + @Input() item: CardList; + cards : Card[] + + toShowAddCard:boolean; + editCard: Card; + cardname; + carddescription; + allowedDropFrom = []; + allowedDragTo = false; + + + constructor(private dataService: DataService) { + } + + ngOnInit() { + this.dataService.getCardsByListId(this.item.$key) + .subscribe(data => { + this.cards = data; + }); + //fill allowed drop-from containers + this.dataService.getCardListsByOrder(this.item.order-1) + .subscribe(d => { + if(d.length>0) + this.allowedDropFrom.push(d[0].$key); + } + ); + //fill if it has next containers + this.dataService.getCardListsByOrder(this.item.order+1) + .subscribe(d => { + if(d.length>0) + this.allowedDragTo = true; + } + ); + } + + showAddCard(){ + this.cardname = ''; + this.carddescription = ''; + this.toShowAddCard = true; + } + + cancelAddCard(){ + this.toShowAddCard = false; + } + saveAddCard(){ + //console.log('save card'); + this.addCard( + this.cardname, + this.carddescription, + true, + this.item.$key, + 0); + this.toShowAddCard = false; + } + + + addCard( + name: string, + description: string, + isExpanded: boolean, + cardListId: string, + order: number + ) + { + let created_at = new Date().toString(); + let newCard:Card = new Card(); + newCard.name = name; + newCard.description = description; + newCard.cardListId = cardListId; + newCard.isExpanded = isExpanded; + newCard.order = order; + newCard.created_at = created_at; + this.dataService.addCard(newCard); + } + + cardDropped(ev){ + let card:Card = ev.dragData; + if(card.cardListId !== this.item.$key){ + card.cardListId = this.item.$key; + this.dataService.updateCard(card.$key, card); + } + } + + allowDragFunction(card: Card){ + return this.allowedDragTo; + } + + allowDropFunction(): any { + return (dragData: Card) => { + return this.allowedDropFrom.indexOf(dragData.cardListId) > -1; + }; + } + +} diff --git a/src/app/display-user/display-user.component.css b/src/app/display-user/display-user.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/display-user/display-user.component.html b/src/app/display-user/display-user.component.html deleted file mode 100644 index 6a92bb8..0000000 --- a/src/app/display-user/display-user.component.html +++ /dev/null @@ -1,20 +0,0 @@ -
-
-
-
User Information
-
    -
  • Email: {{(currentUser()|async).email}}
    • -
  • Display Name: {{(currentUser()|async).displayName}}
    • -
  • Uid: {{(currentUser()|async).uid}}
    • -
  • Provider Id: {{(currentUser()|async).providerId}}
    • -
    • -
-
-
-
-
-
- Log out -
-
\ No newline at end of file diff --git a/src/app/display-user/display-user.component.spec.ts b/src/app/display-user/display-user.component.spec.ts deleted file mode 100644 index eac1f6c..0000000 --- a/src/app/display-user/display-user.component.spec.ts +++ /dev/null @@ -1,42 +0,0 @@ -/* tslint:disable:no-unused-variable */ -import {async, ComponentFixture, TestBed} from "@angular/core/testing"; -import {DisplayUserComponent} from "./display-user.component"; -import {AsyncSubject, Observable, ReplaySubject} from "rxjs"; -import {FormsModule} from "@angular/forms"; -import {AuthService} from "app/shared/auth.service"; -import {UserInfo} from "app/shared/user-info"; -import {By} from "@angular/platform-browser"; -import {AuthServiceStub} from "app/shared/auth.service.stub"; - -describe('DisplayUserComponent', () => { - - let component: DisplayUserComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - let authServiceStub = new AuthServiceStub(true); - - TestBed.configureTestingModule({ - imports: [FormsModule], - declarations: [DisplayUserComponent], - providers: [ - {provide: AuthService, useValue: authServiceStub} - ] - }).compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(DisplayUserComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should display userinfo when logged in', () => { - expect(component).toBeTruthy(); - let elements = fixture.debugElement.queryAll(By.css(".list-group-item")); - expect(elements[0].nativeElement.textContent).toContain("Email: my-email"); - expect(elements[1].nativeElement.textContent).toContain("Display Name: my-display-name"); - expect(elements[2].nativeElement.textContent).toContain("Uid: my-uid"); - expect(elements[3].nativeElement.textContent).toContain("Provider Id: my-provider-id"); - }); -}); diff --git a/src/app/display-user/display-user.component.ts b/src/app/display-user/display-user.component.ts deleted file mode 100644 index c55258e..0000000 --- a/src/app/display-user/display-user.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import {Component, OnInit} from "@angular/core"; -import {AuthService} from "app/shared/auth.service"; -import {UserInfo} from "app/shared/user-info"; -import {Observable} from "rxjs"; - -@Component({ - selector: 'app-display-user', - templateUrl: './display-user.component.html', - styleUrls: ['./display-user.component.css'] -}) -export class DisplayUserComponent { - - constructor(private authService: AuthService) {} - - currentUser(): Observable { - return this.authService.currentUser(); - } - - logout() { - this.authService.logout(); - } -} diff --git a/src/app/login-user/login-user.component.css b/src/app/login-user/login-user.component.css deleted file mode 100644 index db40d23..0000000 --- a/src/app/login-user/login-user.component.css +++ /dev/null @@ -1,33 +0,0 @@ - -.login-or { - position: relative; - font-size: 18px; - color: #aaa; - margin-top: 10px; - margin-bottom: 10px; - padding-top: 10px; - padding-bottom: 10px; -} - -.span-or { - display: block; - position: absolute; - left: 50%; - top: -2px; - margin-left: -25px; - background-color: #fff; - width: 50px; - text-align: center; -} - -.hr-or { - background-color: #cdcdcd; - height: 1px; - margin-top: 0px !important; - margin-bottom: 0px !important; -} - -h3 { - text-align: center; - line-height: 300%; -} \ No newline at end of file diff --git a/src/app/login-user/login-user.component.html b/src/app/login-user/login-user.component.html deleted file mode 100644 index 42a80ad..0000000 --- a/src/app/login-user/login-user.component.html +++ /dev/null @@ -1,39 +0,0 @@ -

Please Log In

-
-
- Twitter -
-
- Google -
-
- - -
-
- - -
-
    -
  • Enter your email address
    • -
  • An email address is required
    • -
-
-
-
- - -
-
    -
  • Enter your password
    • -
  • A password is required
    • -
-
-
- -
diff --git a/src/app/login-user/login-user.component.spec.ts b/src/app/login-user/login-user.component.spec.ts deleted file mode 100644 index c5329fc..0000000 --- a/src/app/login-user/login-user.component.spec.ts +++ /dev/null @@ -1,39 +0,0 @@ -/* tslint:disable:no-unused-variable */ -import {async, ComponentFixture, TestBed} from "@angular/core/testing"; -import {LoginUserComponent} from "./login-user.component"; -import {AuthService} from "app/shared/auth.service"; -import {FormsModule, ReactiveFormsModule} from "@angular/forms"; -import {AsyncSubject, Observable, ReplaySubject} from "rxjs"; -import {UserInfo} from "app/shared/user-info"; -import {AuthServiceStub} from "app/shared/auth.service.stub"; - -describe('LoginUserComponent', () => { - let component: LoginUserComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - let authServiceStub = new AuthServiceStub(true); - - TestBed.configureTestingModule({ - imports: [ - FormsModule, - ReactiveFormsModule - ], - declarations: [LoginUserComponent], - providers: [ - {provide: AuthService, useValue: authServiceStub} - ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(LoginUserComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/login-user/login-user.component.ts b/src/app/login-user/login-user.component.ts deleted file mode 100644 index c67ce24..0000000 --- a/src/app/login-user/login-user.component.ts +++ /dev/null @@ -1,35 +0,0 @@ -import {Component} from "@angular/core"; -import {Observable} from "rxjs"; -import {AuthService} from "app/shared/auth.service"; -import {FormBuilder, Validators, AbstractControl, FormGroup} from "@angular/forms"; - -@Component({ - selector: 'app-login-user', - templateUrl: './login-user.component.html', - styleUrls: ['./login-user.component.css'] -}) -export class LoginUserComponent { - form: FormGroup; - email: AbstractControl; - password: AbstractControl; - - constructor(private authService: AuthService, private fb: FormBuilder) { - this.form = fb.group({ - 'email': ['', Validators.required], - 'password': ['', Validators.required] - }); - this.email = this.form.controls['email']; - this.password = this.form.controls['password']; - } - - login(value: any) { - if (this.form.valid) { - this.authService.login(this.email.value, this.password.value); - this.form.reset(); - } - } - - loginVia(provider: string) { - this.authService.loginViaProvider(provider); - } -} \ No newline at end of file diff --git a/src/app/models/card-info.ts b/src/app/models/card-info.ts new file mode 100644 index 0000000..2135ae4 --- /dev/null +++ b/src/app/models/card-info.ts @@ -0,0 +1,9 @@ +export class Card { + $key?: string; + name?: string; + description?: string; + cardListId?: string; + isExpanded?: boolean; + order?: number; + created_at?: string; +} diff --git a/src/app/models/cardlist-info.ts b/src/app/models/cardlist-info.ts new file mode 100644 index 0000000..efa3cf2 --- /dev/null +++ b/src/app/models/cardlist-info.ts @@ -0,0 +1,8 @@ +export class CardList { + $key?: string; + name?: string; + projectId?: string; + color?: string; + order?: number; + created_at?: string; +} diff --git a/src/app/models/project-info.ts b/src/app/models/project-info.ts new file mode 100644 index 0000000..9b2a026 --- /dev/null +++ b/src/app/models/project-info.ts @@ -0,0 +1,5 @@ +export class Project { + $key?: string; + name?: string; + created_at?: string; +} diff --git a/src/app/models/task-info.ts b/src/app/models/task-info.ts new file mode 100644 index 0000000..969a699 --- /dev/null +++ b/src/app/models/task-info.ts @@ -0,0 +1,8 @@ +export class Task { + $key?: string; + description?: string; + isCompleted: boolean; + cardId?: string; + order?: number; + created_at?: string; +} diff --git a/src/app/register-user/register-user.component.css b/src/app/register-user/register-user.component.css deleted file mode 100644 index 93bae47..0000000 --- a/src/app/register-user/register-user.component.css +++ /dev/null @@ -1,37 +0,0 @@ -.main { - max-width: 320px; - margin: 0 auto; -} - -.login-or { - position: relative; - font-size: 18px; - color: #aaa; - margin-top: 10px; - margin-bottom: 10px; - padding-top: 10px; - padding-bottom: 10px; -} - -.span-or { - display: block; - position: absolute; - left: 50%; - top: -2px; - margin-left: -25px; - background-color: #fff; - width: 50px; - text-align: center; -} - -.hr-or { - background-color: #cdcdcd; - height: 1px; - margin-top: 0px !important; - margin-bottom: 0px !important; -} - -h3 { - text-align: center; - line-height: 300%; -} \ No newline at end of file diff --git a/src/app/register-user/register-user.component.html b/src/app/register-user/register-user.component.html deleted file mode 100644 index 13a3410..0000000 --- a/src/app/register-user/register-user.component.html +++ /dev/null @@ -1,56 +0,0 @@ -

Register

-
-
- - -
-
    -
  • Enter your name
    • -
  • A name is required
    • -
-
-
-
- - -
-
    -
  • Enter your email address
    • -
  • An email address is required
    • -
  • Please enter a valid email address
    • -
-
-
-
- - -
-
    -
  • Enter your password
    • -
  • A password is required
    • -
-
-
-
- - -
-
    -
  • Repeat - your - password -
    • -
  • A password is required
    • -
  • Passwords - don't - match -
    • -
-
-
- -
\ No newline at end of file diff --git a/src/app/register-user/register-user.component.spec.ts b/src/app/register-user/register-user.component.spec.ts deleted file mode 100644 index a2d13bf..0000000 --- a/src/app/register-user/register-user.component.spec.ts +++ /dev/null @@ -1,37 +0,0 @@ -/* tslint:disable:no-unused-variable */ -import {async, ComponentFixture, TestBed} from "@angular/core/testing"; -import {RegisterUserComponent} from "./register-user.component"; -import {ReactiveFormsModule, FormsModule} from "@angular/forms"; -import {AuthService} from "app/shared/auth.service"; -import {AuthServiceStub} from "app/shared/auth.service.stub"; - -describe('RegisterUserComponent', () => { - let component: RegisterUserComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - let authServiceStub = new AuthServiceStub(true); - - TestBed.configureTestingModule({ - declarations: [RegisterUserComponent], - imports: [ - FormsModule, - ReactiveFormsModule - ], - providers: [ - {provide: AuthService, useValue: authServiceStub} - ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(RegisterUserComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/register-user/register-user.component.ts b/src/app/register-user/register-user.component.ts deleted file mode 100644 index 91c9629..0000000 --- a/src/app/register-user/register-user.component.ts +++ /dev/null @@ -1,61 +0,0 @@ -import {Component, OnInit} from "@angular/core"; -import {AuthService} from "app/shared/auth.service"; -import {Observable} from "rxjs"; -import {FormGroup, AbstractControl, FormBuilder, Validators} from "@angular/forms"; - -@Component({ - selector: 'app-register-user', - templateUrl: './register-user.component.html', - styleUrls: ['./register-user.component.css'] -}) -export class RegisterUserComponent implements OnInit { - form: FormGroup; - email: AbstractControl; - name: AbstractControl; - password: AbstractControl; - password2: AbstractControl; - - constructor(private authService: AuthService, - private fb: FormBuilder) { - this.form = fb.group({ - 'name': ['', Validators.required], - 'email': ['', Validators.compose([ - Validators.required, - Validators.pattern(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)] - )], - 'password': ['', Validators.required], - 'password2': ['', Validators.required] - }, {validator: this.matchingPasswords('password', 'password2')}); - this.name = this.form.controls['name']; - this.email = this.form.controls['email']; - this.password = this.form.controls['password']; - this.password2 = this.form.controls['password2']; - } - - ngOnInit(): void { - } - - isLoggedIn(): Observable { - return this.authService.isLoggedIn(); - } - - onSubmit(value: any) { - if (this.form.valid) { - this.authService.createUser(this.email.value, this.password.value, this.name.value); - this.form.reset(); - } - } - - matchingPasswords(passwordKey: string, confirmPasswordKey: string) { - return (group: FormGroup): {[key: string]: any} => { - let password = group.controls[passwordKey]; - let confirmPassword = group.controls[confirmPasswordKey]; - - if (password.value !== confirmPassword.value) { - return { - mismatchedPasswords: true - }; - } - } - } -} diff --git a/src/app/shared/auth.service.stub.ts b/src/app/shared/auth.service.stub.ts deleted file mode 100644 index 2f0ea90..0000000 --- a/src/app/shared/auth.service.stub.ts +++ /dev/null @@ -1,34 +0,0 @@ -import {AsyncSubject, Observable, ReplaySubject} from "rxjs"; -import {UserInfo} from "app/shared/user-info"; - -export class AuthServiceStub { - - constructor(private loggedin: boolean) { - } - - login(email: string, password: string) { - } - - currentUser(): Observable { - let userInfo = new UserInfo(); - userInfo.displayName = "my-display-name"; - userInfo.email = "my-email"; - userInfo.uid = "my-uid"; - userInfo.isAnonymous = false; - userInfo.photoURL = "my-photo-url"; - userInfo.providerId = "my-provider-id"; - - let replaySubject = new ReplaySubject(); - if (this.loggedin) { - replaySubject.next(userInfo); - } - return replaySubject; - } - - isLoggedIn(): Observable { - let isLoggedInBS = new AsyncSubject(); - isLoggedInBS.next(true); - isLoggedInBS.complete(); - return isLoggedInBS; - } -} diff --git a/src/app/shared/auth.service.ts b/src/app/shared/auth.service.ts deleted file mode 100644 index 4119c46..0000000 --- a/src/app/shared/auth.service.ts +++ /dev/null @@ -1,124 +0,0 @@ -import {Injectable, EventEmitter, Output} from "@angular/core"; -import {User} from "firebase"; -import {AngularFireAuth, AuthProviders, AuthMethods} from "angularfire2"; -import {BehaviorSubject} from "rxjs/BehaviorSubject"; -import {UserInfo} from "./user-info"; -import {Observable, Subject, ReplaySubject, AsyncSubject} from "rxjs"; - -@Injectable() -export class AuthService { - private userInfoSubject: ReplaySubject; - private auth: User; - - constructor(private angularFireAuth: AngularFireAuth) { - this.initUserInfoSubject(); - // console.log("AuthService"); - angularFireAuth.subscribe(auth => { - // console.log("auth: ", JSON.stringify(auth)); - let userInfo = new UserInfo(); - if (auth != null) { - this.auth = auth.auth; - userInfo.isAnonymous = auth.auth.isAnonymous; - userInfo.email = auth.auth.email; - userInfo.displayName = auth.auth.displayName; - userInfo.providerId = auth.auth.providerId; - userInfo.photoURL = auth.auth.photoURL; - userInfo.uid = auth.auth.uid; - } else { - this.auth = null; - userInfo.isAnonymous = true; - } - this.userInfoSubject.next(userInfo); - }); - } - - login(email: string, password: string) { - // console.log("login: ", email); - this.initUserInfoSubject(); - this.angularFireAuth.login({email: email, password: password}); - } - - private initUserInfoSubject() { - this.userInfoSubject = new ReplaySubject(1); - } - - currentUser(): Observable { - return this.userInfoSubject.asObservable(); - } - - logout() { - this.initUserInfoSubject(); - this.angularFireAuth.logout(); - } - - isLoggedIn(): Observable { - let isLoggedInBS = new AsyncSubject(); - this.userInfoSubject.subscribe(ui => { - // console.log("isLoggedIn: anonymous=" + ui.isAnonymous); - isLoggedInBS.next(!ui.isAnonymous); - isLoggedInBS.complete(); - // setTimeout(() => { - // }, 0); - }); - return isLoggedInBS; - } - - updateDisplayName(displayName: string): Observable { - let result = new Subject(); - //noinspection TypeScriptUnresolvedFunction - this.auth.updateProfile({displayName: displayName, photoURL: null}).then(a => { - result.next("success"); - }).catch(err => result.error(err)); - return result; - } - - createUser(email: string, password: string, displayName: string) { - //noinspection TypeScriptUnresolvedFunction - this.angularFireAuth.createUser({email: email, password: password}) - .then(auth => auth.auth.updateProfile({displayName: displayName, photoURL: null})); - } - - updateEmail(email: string): Observable { - let result = new Subject(); - //noinspection TypeScriptUnresolvedFunction - this.auth.updateEmail(email).then(a => { - result.next("success"); - }).catch(err => result.error(err)); - return result.asObservable(); - } - - updatePassword(password: string): Observable { - let result = new Subject(); - //noinspection TypeScriptUnresolvedFunction - this.auth.updatePassword(password).then(a => { - result.next("success"); - }).catch(err => result.error(err)); - return result.asObservable(); - } - - loginViaProvider(provider: string): Observable { - let result = new Subject(); - if (provider === "google") { - //noinspection TypeScriptUnresolvedFunction - this.angularFireAuth - .login({provider: AuthProviders.Google, method: AuthMethods.Popup}) - //noinspection TypeScriptUnresolvedFunction - . //noinspection TypeScriptUnresolvedFunction - then(auth => result.next("success")) - .catch(err => result.error(err)); - return result.asObservable(); - } - else if (provider === "twitter") { - //noinspection TypeScriptUnresolvedFunction - this.angularFireAuth - .login({provider: AuthProviders.Twitter, method: AuthMethods.Popup}) - //noinspection TypeScriptUnresolvedFunction - . //noinspection TypeScriptUnresolvedFunction - then(auth => result.next("success")) - .catch(err => result.error(err)); - return result.asObservable(); - } - result.error("Not a supported authentication method: " + provider) - return result.asObservable(); - } -} diff --git a/src/app/shared/data.service.ts b/src/app/shared/data.service.ts new file mode 100644 index 0000000..6f28972 --- /dev/null +++ b/src/app/shared/data.service.ts @@ -0,0 +1,118 @@ +import {Injectable, EventEmitter, Output} from "@angular/core"; +import {AngularFire, FirebaseObjectObservable, FirebaseListObservable} from "angularfire2"; +import {BehaviorSubject} from "rxjs/BehaviorSubject"; +import {Observable, Subject, ReplaySubject, AsyncSubject} from "rxjs"; +import {Project} from "../models/project-info"; +import {CardList} from "../models/cardlist-info"; +import {Card} from "../models/card-info"; +import {Task} from "../models/task-info"; + +@Injectable() +export class DataService { + + projects: FirebaseListObservable; + cardlists: FirebaseListObservable; + cards: FirebaseListObservable; + tasks: FirebaseListObservable; + + constructor(private af: AngularFire) { + //console.log("DataService"); + } + + getProjects(){ + this.projects = this.af.database.list('/projects') as + FirebaseListObservable; + return this.projects; + } + + addProject(project) { + return this.projects.push(project); + } + + + + getCardLists(){ + this.cardlists = this.af.database.list('/cardlist') as + FirebaseListObservable; + return this.cardlists; + } + getCardListsById(cardListId:string): FirebaseObjectObservable { + return this.af.database.object(`/cardlist/${cardListId}`) as FirebaseObjectObservable; + } + getCardListsByOrder(order:number): FirebaseListObservable { + let _cardlist = this.af.database.list('/cardlist',{ + query: { + orderByChild: 'order', + equalTo: order, + }} + ) as FirebaseListObservable; + return _cardlist; + } + getCachedCardListsById(cardListId:string):CardList { + return this.cardlists + .filter(d => d.$key == cardListId) + .map(d=> d.$key) + ; + //.first(); + } + getCardListsByProject(projectId: string){ + let _cardlist = this.af.database.list('/cardlist',{ + query: { + orderByChild: 'projectId', + equalTo: projectId, + }} + ) as FirebaseListObservable; + return _cardlist + } + addCardList(cardlist){ + return this.cardlists.push(cardlist); + } + + + + + getCards(){ + this.cards = this.af.database.list('/cards') as + FirebaseListObservable; + return this.cards; + } + getCardsByListId(listId:string){ + this.cards = this.af.database.list('/cards',{ + query: { + orderByChild: 'cardListId', + equalTo: listId, + }} + ) as + FirebaseListObservable; + return this.cards; + } + addCard(card){ + return this.cards.push(card); + } + updateCard(key, updCard){ + return this.cards.update(key, updCard); + } + + + + getTasks(){ + this.tasks = this.af.database.list('/tasks') as + FirebaseListObservable; + return this.cards; + } + getTasksByCardId(cardId:string){ + let _tasks = this.af.database.list('/tasks',{ + query: { + orderByChild: 'cardId', + equalTo: cardId, + }} + ) as FirebaseListObservable; + return _tasks; + } + addTask(task){ + return this.tasks.push(task); + } + updateTask(key, updTask){ + return this.tasks.update(key, updTask); + } +} \ No newline at end of file diff --git a/src/app/shared/user-info.ts b/src/app/shared/user-info.ts deleted file mode 100644 index f71d801..0000000 --- a/src/app/shared/user-info.ts +++ /dev/null @@ -1,8 +0,0 @@ -export class UserInfo { - isAnonymous: boolean; - email: string; - displayName: string; - photoURL?: string; - providerId: string; - uid: string; -} diff --git a/src/index.html b/src/index.html index 0e33be6..f39f80d 100644 --- a/src/index.html +++ b/src/index.html @@ -2,11 +2,12 @@ - kanban2 + The Kanban Board + Loading...