diff --git a/client/src/app/posts/post-form/post-form.component.html b/client/src/app/posts/post-form/post-form.component.html index 192abd1de24c1537052a059f5156cc4468ec6e56..c0cde4bbde1575cb8beecba709028d397bf86e96 100644 --- a/client/src/app/posts/post-form/post-form.component.html +++ b/client/src/app/posts/post-form/post-form.component.html @@ -11,6 +11,9 @@ <option *ngFor="let category of categories" [value]="category.getCategoryId">{{category.getName}}</option> </app-select> +<app-text-input [(inputModel)]="imageUrl" label="Bilde URL" (blur)="showImage(imageUrl)"></app-text-input> +<img [src]="displayImageUrl" (error)="showImage('https://i.stack.imgur.com/y9DpT.jpg')"> + <p>{{statusMessage}}</p> -<app-button (click)="publishPost()" text="Publiser"></app-button> \ No newline at end of file +<app-button (click)="publishPost()" text="Publiser"></app-button> diff --git a/client/src/app/posts/post-form/post-form.component.spec.ts b/client/src/app/posts/post-form/post-form.component.spec.ts index 96f7a12f252d95f763b41c1fcd6c33ceddb78784..31c4d5b8657d2bc3ea4af3df65d67e7624b33d83 100644 --- a/client/src/app/posts/post-form/post-form.component.spec.ts +++ b/client/src/app/posts/post-form/post-form.component.spec.ts @@ -31,7 +31,6 @@ describe('PostFormComponent', () => { }) ); - await TestBed.configureTestingModule({ declarations: [ PostFormComponent ], imports: [ HttpClientTestingModule, RouterTestingModule, FormsModule, SharedModule ], @@ -104,4 +103,10 @@ describe('PostFormComponent', () => { expect(mockPostService.addPost).toHaveBeenCalled(); expect(router.url).toBe('/'); }); + + it('should show image', () => { + // Tests that image is updated with new URL + component.showImage("test"); + expect(component.displayImageUrl).toBe("test"); + }); }); diff --git a/client/src/app/posts/post-form/post-form.component.ts b/client/src/app/posts/post-form/post-form.component.ts index 667b24bb79800bae7ba083269985ea1f8d7c1600..14be51a44f2ec8bb6ae959d52e81e657037a65db 100644 --- a/client/src/app/posts/post-form/post-form.component.ts +++ b/client/src/app/posts/post-form/post-form.component.ts @@ -15,6 +15,8 @@ export class PostFormComponent implements OnInit { description: string = ""; price: number = 0; categoryid: number = 0; + imageUrl: string; + displayImageUrl: string; statusMessage: string = ""; @@ -70,7 +72,7 @@ export class PostFormComponent implements OnInit { description: this.description, timestamp: new Date(), owner: "admin", - imageUrl: "", + imageUrl: this.imageUrl, price: this.price, categoryid: this.categoryid }); @@ -85,10 +87,17 @@ export class PostFormComponent implements OnInit { } } + /** + * Sets the image source to be the url. + */ + showImage(url) { + this.displayImageUrl = url; + } + /** * Sets a status message. */ - setStatusMessage(message: string){ + setStatusMessage(message: string) { this.statusMessage = message; } } \ No newline at end of file