Suyeon Jung

Modify views : split pages into components

...@@ -235,7 +235,7 @@ router.get('/food', function(req, res) { ...@@ -235,7 +235,7 @@ router.get('/food', function(req, res) {
235 fast_food_stores.push(fast_food_store); 235 fast_food_stores.push(fast_food_store);
236 } 236 }
237 } 237 }
238 - res.render('food_result', { stores: stores, fast_food_stores: fast_food_stores }); 238 + res.render('result', { category: 'food', stores: stores, fast_food_stores: fast_food_stores, userLocation: userLocation });
239 } 239 }
240 240
241 }) 241 })
...@@ -280,7 +280,7 @@ router.get('/school', function(req, res) { ...@@ -280,7 +280,7 @@ router.get('/school', function(req, res) {
280 institutes.push(institute); 280 institutes.push(institute);
281 } 281 }
282 } 282 }
283 - res.render('school_result', { librarys: librarys, institutes: institutes }); 283 + res.render('result', { category: 'school', librarys: librarys, institutes: institutes, userLocation: userLocation });
284 } 284 }
285 }) 285 })
286 } 286 }
...@@ -306,16 +306,8 @@ router.get('/park', function(req, res) { ...@@ -306,16 +306,8 @@ router.get('/park', function(req, res) {
306 city_parks.push(city_park); 306 city_parks.push(city_park);
307 } 307 }
308 } 308 }
309 - res.render('park_result', { city_parks: city_parks }); 309 + res.render('result', { category: 'park', city_parks: city_parks, userLocation: userLocation });
310 } 310 }
311 -
312 - // if (park_result.CityPark[0].head[1].RESULT.CODE == 'INFO-000') {
313 - // cityparknum = park_result.CityPark[0].head[0].list_total_count;
314 - // console.log(cityparknum + "개의 도시공원이 존재합니다.");
315 - // res.send(String(cityparknum) + "개의 도시공원이 존재합니다.");
316 - // } else {
317 - // res.send("도시공원이 없습니다.");
318 - // }
319 }) 311 })
320 }); 312 });
321 313
...@@ -360,7 +352,7 @@ router.get('/transport', function(req, res) { ...@@ -360,7 +352,7 @@ router.get('/transport', function(req, res) {
360 } 352 }
361 console.log(busStations); 353 console.log(busStations);
362 console.log('subwayStaions', subwayStations); 354 console.log('subwayStaions', subwayStations);
363 - res.render('transport_result', { busStations: busStations, subwayStations: subwayStations }) 355 + res.render('result', { category: 'transport', busStations: busStations, subwayStations: subwayStations, userLocation: userLocation })
364 } 356 }
365 }) 357 })
366 358
...@@ -403,7 +395,7 @@ router.get('/safe', function(req, res) { ...@@ -403,7 +395,7 @@ router.get('/safe', function(req, res) {
403 lights.push(light); 395 lights.push(light);
404 } 396 }
405 } 397 }
406 - res.render('safe_result', { cctvs: cctvs, lights: lights }); 398 + res.render('result', { category: 'safe', cctvs: cctvs, lights: lights, userLocation: userLocation });
407 } 399 }
408 }) 400 })
409 } 401 }
...@@ -431,7 +423,7 @@ router.get('/culture', function(req, res) { ...@@ -431,7 +423,7 @@ router.get('/culture', function(req, res) {
431 sings.push(sing); 423 sings.push(sing);
432 } 424 }
433 } 425 }
434 - res.render('culture_result', { sings: sings }); 426 + res.render('result', { category: 'culture', sings: sings, userLocation: userLocation });
435 } 427 }
436 }); 428 });
437 }); 429 });
...@@ -456,7 +448,7 @@ router.get('/shop', function(req, res) { ...@@ -456,7 +448,7 @@ router.get('/shop', function(req, res) {
456 shops.push(shop); 448 shops.push(shop);
457 } 449 }
458 } 450 }
459 - res.render('shop_result', { shops: shops }); 451 + res.render('result', { category: 'shop', shops: shops, userLocation: userLocation });
460 } 452 }
461 453
462 }) 454 })
...@@ -481,7 +473,7 @@ router.get('/gym', function(req, res) { ...@@ -481,7 +473,7 @@ router.get('/gym', function(req, res) {
481 gyms.push(gym); 473 gyms.push(gym);
482 } 474 }
483 } 475 }
484 - res.render('gym_result', { gyms: gyms }); 476 + res.render('result', { category: 'gym', gyms: gyms, userLocation: userLocation });
485 } 477 }
486 }) 478 })
487 }); 479 });
......
...@@ -15,80 +15,10 @@ ...@@ -15,80 +15,10 @@
15 <body> 15 <body>
16 16
17 17
18 - <div class="jumbotron jumbotron-fluid"> 18 + <%- include('components/locationJumbotron') -%>
19 - <div class="container"> 19 +
20 - <h3> 20 + <%- include('components/category') -%>
21 - 🔎 검색한 동네 : 21 +
22 - <%=userLocation%>
23 - </h3>
24 - </div>
25 - </div>
26 - <div class="row">
27 - <div class="card" style="width: 18rem;">
28 - <img src="/img/restaurant.jpg" class="card-img-top" alt="...">
29 - <div class="card-body">
30 - <h5 class="card-title">음식</h5>
31 - <p class="card-text">주변 음식점의 수</p>
32 - <a href="/category/food" class="btn btn-primary">검사!</a>
33 - </div>
34 - </div>
35 - <div class="card" style="width: 18rem;">
36 - <img src="/img/school.jpg" class="card-img-top" alt="...">
37 - <div class="card-body">
38 - <h5 class="card-title">학군</h5>
39 - <p class="card-text">주변 학원 및 도서관 현황</p>
40 - <a href="/category/school" class="btn btn-primary">검사!</a>
41 - </div>
42 - </div>
43 - <div class="card" style="width: 18rem;">
44 - <img src="/img/park.jpg" class="card-img-top" alt="...">
45 - <div class="card-body">
46 - <h5 class="card-title">공원</h5>
47 - <p class="card-text">주변 공원</p>
48 - <a href="/category/park" class="btn btn-primary">검사!</a>
49 - </div>
50 - </div>
51 - <div class="card" style="width: 18rem;">
52 - <img src="/img/transport.jpg" class="card-img-top" alt="...">
53 - <div class="card-body">
54 - <h5 class="card-title">대중교통</h5>
55 - <p class="card-text">대중교통 편리도</p>
56 - <a href="/category/transport" class="btn btn-primary">검사!</a>
57 - </div>
58 - </div>
59 - <div class="card" style="width: 18rem;">
60 - <img src="/img/safe.jpg" class="card-img-top" alt="...">
61 - <div class="card-body">
62 - <h5 class="card-title">안전</h5>
63 - <p class="card-text">주변 경찰서, 범죄자 인근~</p>
64 - <a href="/category/safe" class="btn btn-primary">검사!</a>
65 - </div>
66 - </div>
67 - <div class="card" style="width: 18rem;">
68 - <img src="/img/cultural_life.jpg" class="card-img-top" alt="...">
69 - <div class="card-body">
70 - <h5 class="card-title">여가</h5>
71 - <p class="card-text">주변 문화시설</p>
72 - <a href="/category/culture" class="btn btn-primary">검사!</a>
73 - </div>
74 - </div>
75 - <div class="card" style="width: 18rem;">
76 - <img src="/img/shopping.jpg" class="card-img-top" alt="...">
77 - <div class="card-body">
78 - <h5 class="card-title">쇼핑</h5>
79 - <p class="card-text">주변 백화점, 마트, 재래시장</p>
80 - <a href="/category/shop" class="btn btn-primary">검사!</a>
81 - </div>
82 - </div>
83 - <div class="card" style="width: 18rem;">
84 - <img src="/img/gym.jpg" class="card-img-top" alt="...">
85 - <div class="card-body">
86 - <h5 class="card-title">운동</h5>
87 - <p class="card-text">주변 운동시설</p>
88 - <a href="/category/gym" class="btn btn-primary">검사!</a>
89 - </div>
90 - </div>
91 - </div>
92 22
93 </body> 23 </body>
94 24
......
1 +<div class="row">
2 + <div class="card" style="width: 18rem;">
3 + <img src="/img/restaurant.jpg" class="card-img-top" alt="...">
4 + <div class="card-body">
5 + <h5 class="card-title">음식</h5>
6 + <p class="card-text">주변 음식점의 수</p>
7 + <a href="/category/food" class="btn btn-primary">검사!</a>
8 + </div>
9 + </div>
10 + <div class="card" style="width: 18rem;">
11 + <img src="/img/school.jpg" class="card-img-top" alt="...">
12 + <div class="card-body">
13 + <h5 class="card-title">학군</h5>
14 + <p class="card-text">주변 학원 및 도서관 현황</p>
15 + <a href="/category/school" class="btn btn-primary">검사!</a>
16 + </div>
17 + </div>
18 + <div class="card" style="width: 18rem;">
19 + <img src="/img/park.jpg" class="card-img-top" alt="...">
20 + <div class="card-body">
21 + <h5 class="card-title">공원</h5>
22 + <p class="card-text">주변 공원</p>
23 + <a href="/category/park" class="btn btn-primary">검사!</a>
24 + </div>
25 + </div>
26 + <div class="card" style="width: 18rem;">
27 + <img src="/img/transport.jpg" class="card-img-top" alt="...">
28 + <div class="card-body">
29 + <h5 class="card-title">대중교통</h5>
30 + <p class="card-text">대중교통 편리도</p>
31 + <a href="/category/transport" class="btn btn-primary">검사!</a>
32 + </div>
33 + </div>
34 + <div class="card" style="width: 18rem;">
35 + <img src="/img/safe.jpg" class="card-img-top" alt="...">
36 + <div class="card-body">
37 + <h5 class="card-title">안전</h5>
38 + <p class="card-text">주변 경찰서, 범죄자 인근~</p>
39 + <a href="/category/safe" class="btn btn-primary">검사!</a>
40 + </div>
41 + </div>
42 + <div class="card" style="width: 18rem;">
43 + <img src="/img/cultural_life.jpg" class="card-img-top" alt="...">
44 + <div class="card-body">
45 + <h5 class="card-title">여가</h5>
46 + <p class="card-text">주변 문화시설</p>
47 + <a href="/category/culture" class="btn btn-primary">검사!</a>
48 + </div>
49 + </div>
50 + <div class="card" style="width: 18rem;">
51 + <img src="/img/shopping.jpg" class="card-img-top" alt="...">
52 + <div class="card-body">
53 + <h5 class="card-title">쇼핑</h5>
54 + <p class="card-text">주변 백화점, 마트, 재래시장</p>
55 + <a href="/category/shop" class="btn btn-primary">검사!</a>
56 + </div>
57 + </div>
58 + <div class="card" style="width: 18rem;">
59 + <img src="/img/gym.jpg" class="card-img-top" alt="...">
60 + <div class="card-body">
61 + <h5 class="card-title">운동</h5>
62 + <p class="card-text">주변 운동시설</p>
63 + <a href="/category/gym" class="btn btn-primary">검사!</a>
64 + </div>
65 + </div>
66 +</div>
...\ No newline at end of file ...\ No newline at end of file
1 +<head>
2 + <meta charset="UTF-8" />
3 + <meta name="viewport" content="width=device-width, initial-scale=1.0" />
4 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap.min.css' />
5 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-grid.min.css' />
6 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-reboot.min.css' />
7 + <link rel="preconnect" href="https://fonts.gstatic.com">
8 + <link href="https://fonts.googleapis.com/css2?family=Sunflower:wght@300&display=swap" rel="stylesheet">
9 + <link rel="stylesheet" href="/css/style.css">
10 + <title>🏡 어떤 동네가 좋은 동네일까?</title>
11 + <style>
12 + img {
13 + display: block;
14 + margin: 0px auto;
15 + }
16 + </style>
17 +
18 +</head>
...\ No newline at end of file ...\ No newline at end of file
1 +<div class="jumbotron jumbotron-fluid">
2 + <div class="container">
3 + <h3>
4 + 🔎 검색한 동네 :
5 + <%=userLocation%>
6 + </h3>
7 + </div>
8 +</div>
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html lang="ko"> 2 <html lang="ko">
3 3
4 -<head>
5 - <meta charset="UTF-8" />
6 - <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7 - <!-- <link rel="stylesheet" href="/css/style.css"> -->
8 - <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap.min.css' />
9 - <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-grid.min.css' />
10 - <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-reboot.min.css' />
11 - <title>🏡 How about the Village?</title>
12 -</head>
13 4
14 -<body> 5 +<%- include('components/header') -%>
15 - <img class="gyeonggi" src="/img/logo.png">
16 6
17 - <form action="/category" method="post" name="location"> 7 + <body>
18 - <!-- <input type="text" id="userLocation" name="userLocation" placeholder="당신의 동네 주소를 입력해주세요(시/구/동)"> 8 + <img class="gyeonggi" src="/img/logo.png">
19 - <input type="submit" id="search" value="검색"> --> 9 +
20 - <div class="form-group"> 10 + <form action="/category" method="post" name="location">
21 - <label for="exampleFormControlInput1">당신이 조사하고 싶은 동네의 주소를 입력하세요!</label> 11 + <div class="form-group">
22 - <input type="text" class="form-control" id="exampleFormControlInput1" name="sigun" placeholder="시/군을 입력하세요"> 12 + <label for="exampleFormControlInput1">당신이 조사하고 싶은 동네의 주소를 입력하세요!</label>
23 - <input type="text" class="form-control" id="exampleFormControlInput1" name="gu" placeholder="구를 입력하세요"> 13 + <input type="text" class="form-control" id="exampleFormControlInput1" name="sigun" placeholder="시/군을 입력하세요">
24 - <input type="text" class="form-control" id="exampleFormControlInput1" name="dong" placeholder="읍/면/동을 입력하세요"> 14 + <input type="text" class="form-control" id="exampleFormControlInput1" name="gu" placeholder="구를 입력하세요">
25 - </div> 15 + <input type="text" class="form-control" id="exampleFormControlInput1" name="dong" placeholder="읍/면/동을 입력하세요">
26 - <button type="submit" class="btn btn-primary">검색</button> 16 + </div>
27 - </form> 17 + <button type="submit" class="btn btn-primary">검색</button>
28 -</body> 18 + </form>
19 + </body>
29 20
30 </html> 21 </html>
...\ No newline at end of file ...\ No newline at end of file
......
1 +<!DOCTYPE html>
2 +<html lang="ko">
3 +
4 +<head>
5 + <meta charset="UTF-8">
6 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap.min.css' />
8 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-grid.min.css' />
9 + <link rel='stylesheet' href='/vendors/bootstrap/css/bootstrap-reboot.min.css' />
10 + <link rel='stylesheet' href='/css/category.css'>
11 +
12 + <title>📝 결과</title>
13 +</head>
14 +
15 +<body>
16 + <%- include('components/locationJumbotron') -%>
17 + <%- include(`results/${category}`) -%>
18 +
19 +</body>
20 +
21 +</html>
...\ No newline at end of file ...\ No newline at end of file