Explorar el Código

front end profile created, posts for users created and saved

Jonathan Hinds hace 5 años
padre
commit
b31c01d762

+ 2
- 2
.yo-rc.json Ver fichero

@@ -13,7 +13,7 @@
13 13
     "authenticationType": "jwt",
14 14
     "cacheProvider": "hazelcast",
15 15
     "enableHibernateCache": true,
16
-    "websocket": false,
16
+    "websocket": "spring-websocket",
17 17
     "databaseType": "sql",
18 18
     "devDatabaseType": "h2Memory",
19 19
     "prodDatabaseType": "postgresql",
@@ -35,4 +35,4 @@
35 35
       "en"
36 36
     ]
37 37
   }
38
-}
38
+}

+ 4
- 0
src/main/java/rocks/zipcode/io/repository/UserRepository.java Ver fichero

@@ -1,5 +1,6 @@
1 1
 package rocks.zipcode.io.repository;
2 2
 
3
+import org.springframework.data.jpa.repository.Query;
3 4
 import rocks.zipcode.io.domain.User;
4 5
 
5 6
 import org.springframework.cache.annotation.Cacheable;
@@ -32,6 +33,9 @@ public interface UserRepository extends JpaRepository<User, Long> {
32 33
 
33 34
     Optional<User> findOneByLogin(String login);
34 35
 
36
+    @Query("select user from User user where user.login = ?#{principal.username}")
37
+    Optional<User> findOneByCurrentUser();
38
+
35 39
     @EntityGraph(attributePaths = "authorities")
36 40
     Optional<User> findOneWithAuthoritiesById(Long id);
37 41
 

+ 7
- 2
src/main/java/rocks/zipcode/io/web/rest/PostResource.java Ver fichero

@@ -3,6 +3,7 @@ package rocks.zipcode.io.web.rest;
3 3
 import com.codahale.metrics.annotation.Timed;
4 4
 import rocks.zipcode.io.domain.Post;
5 5
 import rocks.zipcode.io.repository.PostRepository;
6
+import rocks.zipcode.io.repository.UserRepository;
6 7
 import rocks.zipcode.io.web.rest.errors.BadRequestAlertException;
7 8
 import rocks.zipcode.io.web.rest.util.HeaderUtil;
8 9
 import io.github.jhipster.web.util.ResponseUtil;
@@ -30,8 +31,11 @@ public class PostResource {
30 31
 
31 32
     private final PostRepository postRepository;
32 33
 
33
-    public PostResource(PostRepository postRepository) {
34
+    private final UserRepository userRepository;
35
+
36
+    public PostResource(PostRepository postRepository, UserRepository userRepository) {
34 37
         this.postRepository = postRepository;
38
+        this.userRepository = userRepository;
35 39
     }
36 40
 
37 41
     /**
@@ -44,6 +48,7 @@ public class PostResource {
44 48
     @PostMapping("/posts")
45 49
     @Timed
46 50
     public ResponseEntity<Post> createPost(@RequestBody Post post) throws URISyntaxException {
51
+        post.setOwner(userRepository.findOneByCurrentUser().get());
47 52
         log.debug("REST request to save Post : {}", post);
48 53
         if (post.getId() != null) {
49 54
             throw new BadRequestAlertException("A new post cannot already have an ID", ENTITY_NAME, "idexists");
@@ -85,7 +90,7 @@ public class PostResource {
85 90
     @Timed
86 91
     public List<Post> getAllPosts() {
87 92
         log.debug("REST request to get all Posts");
88
-        return postRepository.findAll();
93
+        return postRepository.findByOwnerIsCurrentUser();
89 94
     }
90 95
 
91 96
     /**

+ 1
- 0
src/main/resources/.h2.server.properties Ver fichero

@@ -1,4 +1,5 @@
1 1
 #H2 Server Properties
2
+#Wed Jan 09 09:38:54 EST 2019
2 3
 0=JHipster H2 (Memory)|org.h2.Driver|jdbc\:h2\:mem\:faeboo|FaeBoo
3 4
 webAllowOthers=true
4 5
 webPort=8082

+ 44
- 11
src/main/webapp/app/FaeBoo/Profile-head/profile-head.component.html Ver fichero

@@ -2,45 +2,78 @@
2 2
 
3 3
     <div class = "friend-cont">
4 4
 
5
-        <div class = "profile-pic">
6
-            <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
5
+        <div class="friend-pic friend4" id = "friend7">
6
+            <img class ="friend-photo friend4" src = "../../../content/images/defaultphoto.png">
7 7
         </div>
8 8
 
9
-        <div class="friend-pic">
10
-            <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
9
+        <div class="friend-pic friend3" id = "friend5">
10
+            <img class ="friend-photo friend3" src = "../../../content/images/defaultphoto.png">
11 11
         </div>
12 12
 
13
-        <div class="friend-pic">
13
+        <div class="friend-pic friend2" id = "friend3">
14 14
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
15 15
         </div>
16 16
 
17
-        <div class="friend-pic">
17
+        <div class="friend-pic friend1" id = "friend1">
18 18
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
19 19
         </div>
20 20
 
21
-        <div class="friend-pic">
21
+        <div class = "profile-pic">
22 22
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
23 23
         </div>
24 24
 
25
-        <div class="friend-pic">
25
+        <div class="friend-pic friend1" id = "friend2">
26 26
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
27 27
         </div>
28 28
 
29
-        <div class="friend-pic">
29
+        <div class="friend-pic friend2" id = "friend4">
30 30
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
31 31
         </div>
32 32
 
33
-        <div class="friend-pic">
33
+        <div class="friend-pic friend3" id = "friend6">
34 34
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
35 35
         </div>
36 36
 
37
-        <div class="friend-pic">
37
+        <div class="friend-pic friend4" id = friend8>
38 38
             <img class ="friend-photo" src = "../../../content/images/defaultphoto.png">
39 39
         </div>
40 40
 
41 41
     </div>
42 42
 
43
+
44
+    <div class = "settings-container">
45
+
46
+        <button>Settings</button>
47
+        <button>Change Profile</button>
48
+        <button>Change Bio</button>
49
+        <button>Friends</button>
50
+
51
+    </div>
52
+
53
+    <hr>
54
+
43 55
     <div id = "bio-cont"></div>
44 56
 
57
+    <hr>
58
+
59
+    <div id = "feed">
60
+
61
+        <div class = "post">
62
+            <div>
63
+                <textarea id = "post-area" [(ngModel)]="str"></textarea>
64
+            </div>
65
+
66
+            <div id = "postButton-container">
67
+                <div class = "button-holder"><button class = "postBtn">Schedule</button></div>
68
+                <div class = "button-holder"><button class = "postBtn">Memo</button></div>
69
+                <div class = "button-holder"><button class = "postBtn">Photo</button></div>
70
+                <div class = "button-holder"><button class = "postBtn" (click)="submitPost();">Submit</button></div>
71
+            </div>
72
+
73
+            <p id = "msg">Create a post...</p>
74
+        </div>
75
+
76
+
77
+    </div>
45 78
 
46 79
 </div>

+ 50
- 1
src/main/webapp/app/FaeBoo/Profile-head/profile-head.component.ts Ver fichero

@@ -1,8 +1,57 @@
1 1
 import { Component } from '@angular/core';
2
+import { PostService } from 'app/entities/post';
3
+import { IPost } from 'app/shared/model/post.model';
4
+import { IUser } from 'app/core';
5
+import { Observable } from 'rxjs';
6
+import { HttpErrorResponse, HttpResponse } from '@angular/common/http';
2 7
 
3 8
 @Component({
4 9
     selector: 'jhi-profile-head',
5 10
     templateUrl: './profile-head.component.html',
6 11
     styleUrls: ['profile-head.css']
7 12
 })
8
-export class ProfileHeadComponent {}
13
+export class ProfileHeadComponent {
14
+    str: string;
15
+    post: IPost;
16
+    user: IUser;
17
+    isSaving: boolean;
18
+    testPost: IPost;
19
+
20
+    constructor(private postService: PostService) {}
21
+
22
+    submitPost(): void {
23
+        this.post = new class implements IPost {
24
+            content: string;
25
+            dislikes: number;
26
+            id: number;
27
+            likes: number;
28
+            numberOfComments: number;
29
+            owner: IUser;
30
+        }();
31
+        this.post.content = this.str;
32
+        this.post.dislikes = 0;
33
+        this.post.likes = 0;
34
+        this.post.numberOfComments = 0;
35
+        if (this.post.content.length > 1) {
36
+            this.save(this.post);
37
+        }
38
+    }
39
+
40
+    save(post: IPost) {
41
+        this.isSaving = true;
42
+        this.subscribeToSaveResponse(this.postService.create(post));
43
+        console.log('post created');
44
+    }
45
+
46
+    private subscribeToSaveResponse(result: Observable<HttpResponse<IPost>>) {
47
+        result.subscribe((res: HttpResponse<IPost>) => this.onSaveSuccess(), (res: HttpErrorResponse) => this.onSaveError());
48
+    }
49
+
50
+    private onSaveSuccess() {
51
+        this.isSaving = false;
52
+    }
53
+
54
+    private onSaveError() {
55
+        this.isSaving = false;
56
+    }
57
+}

+ 111
- 54
src/main/webapp/app/FaeBoo/Profile-head/profile-head.css Ver fichero

@@ -1,27 +1,27 @@
1 1
 .main-cont {
2
-    border: red 1px solid;
3 2
     width: 100%;
4 3
     height: 1fr;
5 4
     box-sizing: border-box;
6 5
     padding: 8px;
6
+    position: relative;
7 7
 }
8 8
 
9 9
 .friend-cont {
10 10
     display: grid;
11
-    justify-content: space-around;
12
-    grid-template-columns: calc(10% - 5px) calc(10% - 5px) calc(10% - 5px) calc(10% - 5px) calc(20% - 5px) calc(10% - 5px) calc(10% - 5px) calc(
13
-            10% - 5px
14
-        ) calc(10% - 5px);
15
-    grid-column-gap: 5px;
11
+    justify-items: center;
12
+    grid-template-columns: calc(10%) calc(10%) calc(10%) calc(10%) calc(20%) calc(10%) calc(10%) calc(10%) calc(10%);
13
+    /*grid-column-gap: 5px;*/
16 14
     grid-template-rows: auto;
17 15
     width: 100%;
18 16
     height: 100%;
19 17
     box-sizing: border-box;
18
+    position: relative;
19
+    overflow-y: auto;
20
+    overflow-x: scroll;
20 21
     margin: auto;
21 22
 }
22 23
 
23 24
 #bio-cont {
24
-    border: red 1px solid;
25 25
     width: 100%;
26 26
     height: 75px;
27 27
     box-sizing: border-box;
@@ -30,74 +30,131 @@
30 30
 }
31 31
 
32 32
 .friend-pic {
33
-    /*border: blue 1px solid;
34
-    width: 100%;
35
-    height: 0px;
33
+    width: 100px;
34
+    height: 100px;
35
+    position: relative;
36 36
     border-radius: 50%;
37
-    grid-row-start: 1;
38
-    margin: auto;
39
-    padding-bottom: 100%;
40
-    position:relative;*/
41
-
42
-    /*border-radius: 50%;
43
-    height: 50%;
44
-    overflow: hidden;
45 37
     margin: auto;
46
-    box-sizing: border-box;*/
38
+    overflow-x: hidden;
39
+}
47 40
 
48
-    /*border: blue 1px solid;
49
-    border-radius: 50%;
41
+.friend-photo {
50 42
     width: 100%;
51
-    height: 0%;
52
-    padding-top: 100%;
53
-    margin:auto;
54
-    overflow: hidden;*/
43
+    height: 100%;
44
+    object-fit: cover;
45
+}
55 46
 
56
-    width: 100%;
57
-    height: 75%;
47
+.profile-pic {
48
+    width: 200px;
49
+    height: 200px;
58 50
     position: relative;
59 51
     overflow: hidden;
60 52
     border-radius: 50%;
53
+    grid-column-start: 5;
54
+    grid-row-start: 1;
55
+    margin: auto;
56
+    z-index: 5;
61 57
 }
62 58
 
63
-.friend-photo {
59
+.friend1 {
60
+    z-index: 1;
61
+}
62
+
63
+.friend2 {
64
+    z-index: 2;
65
+}
66
+
67
+.friend3 {
68
+    z-index: 3;
69
+}
70
+
71
+.friend4 {
72
+    z-index: 4;
73
+}
74
+
75
+.settings-container {
64 76
     width: 100%;
65
-    height: 100%;
66
-    object-fit: cover;
77
+    text-align: center;
78
+    padding: 10px;
67 79
 }
68 80
 
69
-.profile-pic {
70
-    /*border: green 1px solid;
81
+.settings-container button {
82
+    display: inline-block;
83
+    width: 20%;
84
+    text-align: center;
85
+    border: none;
86
+    background-color: #e2e6eb;
87
+    padding: 5px;
88
+    color: #969a9f;
89
+    margin-right: 10px;
90
+    margin-top: 10px;
91
+}
92
+
93
+hr {
94
+    border: 1px solid #d1d5da;
95
+}
96
+
97
+#feed {
98
+    width: 65%;
99
+    min-height: 250px;
100
+    margin: auto;
101
+    padding: 10px;
102
+    box-sizing: border-box;
103
+}
104
+
105
+.post {
71 106
     width: 100%;
72
-    height: 0px;
73
-    padding-bottom: 100%;
74
-    border-radius: 50%;
75
-    grid-column-start: 5;
107
+    height: 245px;
108
+    padding: 15px;
109
+    box-sizing: border-box;
110
+    display: grid;
111
+    grid-template-columns: calc(85% - 5px) 15%;
112
+    grid-template-rows: 195px 20px;
113
+    grid-column-gap: 5px;
114
+    color: #969a9f;
115
+    border-radius: 5px;
116
+    background-color: #e2e6eb;
117
+}
118
+
119
+#post-area {
120
+    resize: none;
121
+    width: 100%;
122
+    height: 100%;
76 123
     grid-row-start: 1;
77
-    margin:auto;*/
124
+    grid-column-start: 1;
125
+    border: none;
126
+    border-radius: 5px;
127
+    padding: 10px;
128
+}
78 129
 
79
-    /*border-radius: 50%;
130
+#postButton-container {
131
+    width: 100%;
80 132
     height: 100%;
81
-    overflow: hidden;
82
-    margin: auto;
133
+    display: grid;
134
+    grid-template-rows: 25% 25% 25% 25%;
135
+    grid-template-columns: 100%;
83 136
     box-sizing: border-box;
84
-    grid-column-start: 5;
85 137
     grid-row-start: 1;
86
-    margin:auto*/
138
+    grid-column-start: 2;
139
+}
87 140
 
88
-    /*border: blue 1px solid;
89
-    border-radius: 50%;
141
+.postBtn {
90 142
     width: 100%;
91
-    height: 0%;
92
-    padding-top: 100%;
93
-    margin:auto;
94
-    overflow: hidden;*/
143
+    height: 100%;
144
+    font-size: 10px;
145
+    border: none;
146
+    background-color: white;
147
+    color: #969a9f;
148
+}
95 149
 
150
+.button-holder {
96 151
     width: 100%;
97
-    height: 150%;
98
-    position: relative;
99
-    overflow: hidden;
100
-    border-radius: 50%;
101
-    grid-column-start: 5;
102
-    grid-row-start: 1;
152
+    height: 100%;
153
+    box-sizing: border-box;
154
+    padding: 5px;
155
+}
156
+
157
+#msg {
158
+    grid-column-start: 1;
159
+    grid-row-start: 2;
103 160
 }

+ 39
- 0
src/main/webapp/app/FaeBoo/Services/post.service.ts Ver fichero

@@ -0,0 +1,39 @@
1
+import { Injectable } from '@angular/core';
2
+import { HttpClient, HttpResponse } from '@angular/common/http';
3
+import { Observable } from 'rxjs';
4
+
5
+import { SERVER_API_URL } from 'app/app.constants';
6
+import { createRequestOption } from 'app/shared/util/request-util';
7
+import { IPost } from 'app/shared/model/post.model';
8
+
9
+@Injectable({ providedIn: 'root' })
10
+export class PostService {
11
+    public resourceUrl = SERVER_API_URL + 'api/users';
12
+
13
+    constructor(private http: HttpClient) {}
14
+
15
+    create(post: IPost): Observable<HttpResponse<IPost>> {
16
+        return this.http.post<IPost>(this.resourceUrl, post, { observe: 'response' });
17
+    }
18
+
19
+    update(post: IPost): Observable<HttpResponse<IPost>> {
20
+        return this.http.put<IPost>(this.resourceUrl, post, { observe: 'response' });
21
+    }
22
+
23
+    find(login: string): Observable<HttpResponse<IPost>> {
24
+        return this.http.get<IPost>(`${this.resourceUrl}/${login}`, { observe: 'response' });
25
+    }
26
+
27
+    query(req?: any): Observable<HttpResponse<IPost[]>> {
28
+        const options = createRequestOption(req);
29
+        return this.http.get<IPost[]>(this.resourceUrl, { params: options, observe: 'response' });
30
+    }
31
+
32
+    delete(login: string): Observable<HttpResponse<any>> {
33
+        return this.http.delete(`${this.resourceUrl}/${login}`, { observe: 'response' });
34
+    }
35
+
36
+    authorities(): Observable<string[]> {
37
+        return this.http.get<string[]>(SERVER_API_URL + 'api/users/authorities');
38
+    }
39
+}

+ 5
- 1
src/test/java/rocks/zipcode/io/web/rest/PostResourceIntTest.java Ver fichero

@@ -4,6 +4,7 @@ import rocks.zipcode.io.FaeBooApp;
4 4
 
5 5
 import rocks.zipcode.io.domain.Post;
6 6
 import rocks.zipcode.io.repository.PostRepository;
7
+import rocks.zipcode.io.repository.UserRepository;
7 8
 import rocks.zipcode.io.web.rest.errors.ExceptionTranslator;
8 9
 
9 10
 import org.junit.Before;
@@ -55,6 +56,9 @@ public class PostResourceIntTest {
55 56
     private PostRepository postRepository;
56 57
 
57 58
     @Autowired
59
+    UserRepository userRepository;
60
+
61
+    @Autowired
58 62
     private MappingJackson2HttpMessageConverter jacksonMessageConverter;
59 63
 
60 64
     @Autowired
@@ -73,7 +77,7 @@ public class PostResourceIntTest {
73 77
     @Before
74 78
     public void setup() {
75 79
         MockitoAnnotations.initMocks(this);
76
-        final PostResource postResource = new PostResource(postRepository);
80
+        final PostResource postResource = new PostResource(postRepository, userRepository);
77 81
         this.restPostMockMvc = MockMvcBuilders.standaloneSetup(postResource)
78 82
             .setCustomArgumentResolvers(pageableArgumentResolver)
79 83
             .setControllerAdvice(exceptionTranslator)