Przeglądaj źródła

post feed working, thanks Wilhem

Jonathan Hinds 5 lat temu
rodzic
commit
170c97937b

+ 6
- 3
src/main/webapp/app/FaeBoo/Profile-head/profile-head.component.html Wyświetl plik

@@ -67,13 +67,16 @@
67 67
                 <div class = "button-holder"><button class = "postBtn">Schedule</button></div>
68 68
                 <div class = "button-holder"><button class = "postBtn">Memo</button></div>
69 69
                 <div class = "button-holder"><button class = "postBtn">Photo</button></div>
70
-                <div class = "button-holder"><button class = "postBtn" (click)="submitPost();">Submit</button></div>
70
+                <div class = "button-holder"><button class = "postBtn" (click)="submitPost();loadAll();">Submit</button></div>
71 71
             </div>
72 72
 
73 73
             <p id = "msg">Create a post...</p>
74 74
         </div>
75
-
76
-
77 75
     </div>
78 76
 
77
+    <div id = "post-container">
78
+            <div *ngFor="let post of posts;trackBy: trackId" class = "single-post">
79
+                {{post.content}}
80
+            </div>
81
+    </div>
79 82
 </div>

+ 54
- 9
src/main/webapp/app/FaeBoo/Profile-head/profile-head.component.ts Wyświetl plik

@@ -1,23 +1,64 @@
1
-import { Component } from '@angular/core';
1
+import { Component, OnInit } from '@angular/core';
2 2
 import { PostService } from 'app/entities/post';
3 3
 import { IPost } from 'app/shared/model/post.model';
4
-import { IUser } from 'app/core';
4
+import { IUser, Principal } from 'app/core';
5 5
 import { Observable } from 'rxjs';
6 6
 import { HttpErrorResponse, HttpResponse } from '@angular/common/http';
7
+import { JhiAlertService } from 'ng-jhipster';
7 8
 
8 9
 @Component({
9 10
     selector: 'jhi-profile-head',
10 11
     templateUrl: './profile-head.component.html',
11 12
     styleUrls: ['profile-head.css']
12 13
 })
13
-export class ProfileHeadComponent {
14
+export class ProfileHeadComponent implements OnInit {
14 15
     str: string;
15 16
     post: IPost;
16 17
     user: IUser;
17 18
     isSaving: boolean;
18 19
     testPost: IPost;
20
+    posts: IPost[];
19 21
 
20
-    constructor(private postService: PostService) {}
22
+    constructor(private postService: PostService, private jhiAlertService: JhiAlertService) {}
23
+
24
+    ngOnInit() {
25
+        this.loadAll();
26
+    }
27
+
28
+    trackId(index: number, item: IPost) {
29
+        return item.id;
30
+    }
31
+
32
+    loadAll() {
33
+        this.postService.query().subscribe(
34
+            (res: HttpResponse<IPost[]>) => {
35
+                this.posts = res.body;
36
+            },
37
+            (res: HttpErrorResponse) => this.onError(res.message)
38
+        );
39
+    }
40
+
41
+    private onError(errorMessage: string) {
42
+        this.jhiAlertService.error(errorMessage, null, null);
43
+    }
44
+
45
+    getPost(): void {
46
+        console.log('2');
47
+        this.testPost = new class implements IPost {
48
+            content: string;
49
+            dislikes: number;
50
+            id: number;
51
+            likes: number;
52
+            numberOfComments: number;
53
+            owner: IUser;
54
+        }();
55
+        this.testPost.content = 'This is a test';
56
+        this.testPost.numberOfComments = 0;
57
+        this.testPost.likes = 0;
58
+        this.testPost.dislikes = 0;
59
+        this.testPost.id = 0;
60
+        // this.testPosts.push(this.testPost);
61
+    }
21 62
 
22 63
     submitPost(): void {
23 64
         this.post = new class implements IPost {
@@ -32,15 +73,19 @@ export class ProfileHeadComponent {
32 73
         this.post.dislikes = 0;
33 74
         this.post.likes = 0;
34 75
         this.post.numberOfComments = 0;
35
-        if (this.post.content.length > 1) {
36
-            this.save(this.post);
37
-        }
76
+        this.save(this.post);
77
+        this.str = '';
38 78
     }
39 79
 
40 80
     save(post: IPost) {
41 81
         this.isSaving = true;
42
-        this.subscribeToSaveResponse(this.postService.create(post));
43
-        console.log('post created');
82
+        const self = this;
83
+        this.postService
84
+            .create(post)
85
+            .toPromise()
86
+            .then(function(response) {
87
+                self.loadAll();
88
+            });
44 89
     }
45 90
 
46 91
     private subscribeToSaveResponse(result: Observable<HttpResponse<IPost>>) {

+ 20
- 0
src/main/webapp/app/FaeBoo/Profile-head/profile-head.css Wyświetl plik

@@ -158,3 +158,23 @@ hr {
158 158
     grid-column-start: 1;
159 159
     grid-row-start: 2;
160 160
 }
161
+
162
+#post-container {
163
+    width: 65%;
164
+    min-height: 250px;
165
+    margin: auto;
166
+    padding: 10px;
167
+    box-sizing: border-box;
168
+}
169
+
170
+.single-post {
171
+    width: 100%;
172
+    min-height: 100px;
173
+    padding: 15px;
174
+    box-sizing: border-box;
175
+    color: #969a9f;
176
+    border-radius: 5px;
177
+    background-color: #e2e6eb;
178
+    margin-top: 10px;
179
+    margin-bottom: 10px;
180
+}

+ 1
- 0
src/main/webapp/app/entities/post/post.component.ts Wyświetl plik

@@ -45,6 +45,7 @@ export class PostComponent implements OnInit, OnDestroy {
45 45
     }
46 46
 
47 47
     trackId(index: number, item: IPost) {
48
+        console.log(item);
48 49
         return item.id;
49 50
     }
50 51
 

+ 1
- 1
src/main/webapp/app/layouts/navbar/navbar.component.html Wyświetl plik

@@ -46,7 +46,7 @@
46 46
                         </a>
47 47
                     </li>
48 48
                     <li>
49
-                        <a class="dropdown-item" routerLink="profile" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar()">
49
+                        <a class="dropdown-item" routerLink="profile" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="collapseNavbar();">
50 50
                             <fa-icon icon="asterisk" fixedWidth="true"></fa-icon>
51 51
                             <span jhiTranslate="global.menu.entities.profile">Profile</span>
52 52
                         </a>

+ 2
- 0
src/main/webapp/app/layouts/navbar/navbar.component.ts Wyświetl plik

@@ -6,6 +6,7 @@ import { SessionStorageService } from 'ngx-webstorage';
6 6
 import { VERSION } from 'app/app.constants';
7 7
 import { JhiLanguageHelper, Principal, LoginModalService, LoginService } from 'app/core';
8 8
 import { ProfileService } from '../profiles/profile.service';
9
+import { ProfileHeadComponent } from 'app/FaeBoo/Profile-head/profile-head.component';
9 10
 
10 11
 @Component({
11 12
     selector: 'jhi-navbar',
@@ -19,6 +20,7 @@ export class NavbarComponent implements OnInit {
19 20
     swaggerEnabled: boolean;
20 21
     modalRef: NgbModalRef;
21 22
     version: string;
23
+    public profileHead: ProfileHeadComponent;
22 24
 
23 25
     constructor(
24 26
         private loginService: LoginService,