From 11ba2e08509132a4b7a48c09bbc0dd042722a54e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tormod=20Nyg=C3=A5rd?= <tormodny@stud.ntnu.no>
Date: Wed, 17 Feb 2021 13:43:37 +0100
Subject: [PATCH] Issue: Can upload image URL (#4)
Co-authored-by: Hanna Pelsholen Busterud <hannapb@ntnu.no>
---
.../app/posts/post-form/post-form.component.html | 5 ++++-
.../app/posts/post-form/post-form.component.spec.ts | 7 ++++++-
.../src/app/posts/post-form/post-form.component.ts | 13 +++++++++++--
3 files changed, 21 insertions(+), 4 deletions(-)
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 192abd1..c0cde4b 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 96f7a12..31c4d5b 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 667b24b..14be51a 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
--
GitLab