Showing
6 changed files
with
227 additions
and
6 deletions
... | @@ -32,3 +32,20 @@ ul.sidenav li a:hover:not(.active) { | ... | @@ -32,3 +32,20 @@ ul.sidenav li a:hover:not(.active) { |
32 | padding: 1px 16px; | 32 | padding: 1px 16px; |
33 | height: 100%; | 33 | height: 100%; |
34 | } | 34 | } |
35 | +table { | ||
36 | + display: block; | ||
37 | + width: 70%; | ||
38 | + height: 100%; | ||
39 | +} | ||
40 | +td { | ||
41 | + text-align: center; | ||
42 | + display: block; | ||
43 | +} | ||
44 | +.bold { | ||
45 | + color: #ffc0cb; | ||
46 | + font-size: 100%; | ||
47 | +} | ||
48 | +.small { | ||
49 | + color: #808080; | ||
50 | + font-size: 8pt; | ||
51 | +} | ... | ... |
... | @@ -36,3 +36,20 @@ ul.sidenav li a:hover:not(.active) | ... | @@ -36,3 +36,20 @@ ul.sidenav li a:hover:not(.active) |
36 | margin-left: 25%; | 36 | margin-left: 25%; |
37 | padding: 1px 16px; | 37 | padding: 1px 16px; |
38 | height: 100%; | 38 | height: 100%; |
39 | + | ||
40 | +table | ||
41 | + display : block | ||
42 | + width : 70% | ||
43 | + height : 100% | ||
44 | + | ||
45 | + | ||
46 | +td | ||
47 | + text-align : center; | ||
48 | + display : block | ||
49 | + | ||
50 | +.bold | ||
51 | + color : pink; | ||
52 | + font-size : 100%; | ||
53 | +.small | ||
54 | + color : grey; | ||
55 | + font-size : 8pt; | ... | ... |
... | @@ -2,12 +2,48 @@ var express = require('express'); | ... | @@ -2,12 +2,48 @@ var express = require('express'); |
2 | var router = express.Router(); | 2 | var router = express.Router(); |
3 | 3 | ||
4 | /* GET home page. */ | 4 | /* GET home page. */ |
5 | -router.get('/', function(req, res, next) { | 5 | +router.get('/index', function(req, res, next) { |
6 | res.render('index', { title: 'Express' }); | 6 | res.render('index', { title: 'Express' }); |
7 | }); | 7 | }); |
8 | 8 | ||
9 | -router.get('/test', function(req, res, next) { | 9 | +router.get('/', function(req, res, next) { |
10 | - res.render('test', { title: '맛집 견문록' }); | 10 | + res.render('main', { title: '맛집 견문록' }); |
11 | +}); | ||
12 | + | ||
13 | + | ||
14 | +router.get('/map', function(req, res, next){ | ||
15 | + | ||
16 | + res.render('map', {title: '맛집 도장찍기'}); | ||
17 | + | ||
18 | +}); | ||
19 | +router.get('/home', function(req,res,next){ | ||
20 | + | ||
21 | + res.render('main', {title: '맛집견문록'}); | ||
11 | }); | 22 | }); |
23 | +router.get('/mybook', function(req, res, next){ | ||
24 | + | ||
25 | + var rows = new Array(); | ||
26 | + | ||
27 | + var temp1 = { | ||
28 | + | ||
29 | + name : "신사동떡볶이", | ||
30 | + place : "서울특별시 영등포구 신길7동" | ||
31 | + } | ||
12 | 32 | ||
33 | + var temp2 ={name : "동해떡국집", place : "서교동 1234"} | ||
34 | + var temp3 = {name : "앗뜨거어묵국물", place : "용인시 기흥구 어디일까"} | ||
35 | + var temp5 = {name : "와장창창", place : "윌집앞"} | ||
36 | + var temp6 = {name : "맛있는 짜장면", place : "너네집앞"} | ||
37 | + var temp4 = {name : "네모네모 오징어", place : "영등포경찰서"} | ||
38 | + | ||
39 | + rows.push(temp1); | ||
40 | + rows.push(temp2); | ||
41 | + rows.push(temp3); | ||
42 | + rows.push(temp4); | ||
43 | + rows.push(temp5); | ||
44 | + rows.push(temp6); | ||
45 | + | ||
46 | + res.render('mybook', {title: '견문록 보기', rows : rows}); | ||
47 | + | ||
48 | +}); | ||
13 | module.exports = router; | 49 | module.exports = router; | ... | ... |
... | @@ -22,18 +22,24 @@ | ... | @@ -22,18 +22,24 @@ |
22 | </script> | 22 | </script> |
23 | 23 | ||
24 | 24 | ||
25 | + | ||
26 | + | ||
25 | <div id ="menu"> | 27 | <div id ="menu"> |
26 | <div id ="show">clickmenu</div> | 28 | <div id ="show">clickmenu</div> |
27 | 29 | ||
28 | <ul class="sidenav"> | 30 | <ul class="sidenav"> |
29 | - <li><a class="active" href="#home">home</a></li> | 31 | + <li><a class="active" href="home">home</a></li> |
30 | - <li><a href="#map">맛집도장찍기</a></li> | 32 | + <li><a href="map">맛집도장찍기</a></li> |
31 | - <li><a href="#mybook">견문록확인</a></li> | 33 | + <li><a href="mybook">견문록확인</a></li> |
32 | 34 | ||
33 | </ul> | 35 | </ul> |
34 | 36 | ||
35 | 37 | ||
36 | </div> | 38 | </div> |
39 | + | ||
40 | + | ||
41 | + <div id = "header"> </div> | ||
42 | + | ||
37 | <div id ="content"> | 43 | <div id ="content"> |
38 | 44 | ||
39 | <h1><%= title %></h1> | 45 | <h1><%= title %></h1> |
... | @@ -49,4 +55,5 @@ | ... | @@ -49,4 +55,5 @@ |
49 | 55 | ||
50 | 56 | ||
51 | </body> | 57 | </body> |
58 | + | ||
52 | </html> | 59 | </html> | ... | ... |
views/map.ejs
0 → 100644
1 | +<html> | ||
2 | + <head> | ||
3 | + <title><%= title %></title> | ||
4 | + <link rel='stylesheet' href='/stylesheets/style.css'/> | ||
5 | + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | ||
6 | + </head> | ||
7 | + <body> | ||
8 | + | ||
9 | + <script> | ||
10 | + | ||
11 | + $(document).ready(function() { | ||
12 | + $('.sidenav').hide(); | ||
13 | + | ||
14 | + $('#show').click(function() { | ||
15 | + | ||
16 | + $('.sidenav').slideToggle("fast"); | ||
17 | + }); | ||
18 | + }); | ||
19 | + | ||
20 | + | ||
21 | + </script> | ||
22 | + | ||
23 | + | ||
24 | + | ||
25 | + | ||
26 | + <div id ="menu"> | ||
27 | + <div id ="show">clickmenu</div> | ||
28 | + | ||
29 | + <ul class="sidenav"> | ||
30 | + <li><a class="active" href="home">home</a></li> | ||
31 | + <li><a href="map">맛집도장찍기</a></li> | ||
32 | + <li><a href="mybook">견문록확인</a></li> | ||
33 | + | ||
34 | + </ul> | ||
35 | + | ||
36 | + | ||
37 | + </div> | ||
38 | + | ||
39 | + | ||
40 | + <div id = "header"> </div> | ||
41 | + | ||
42 | + <div id ="content"> | ||
43 | + | ||
44 | + <h1>구글지도보기</h1> | ||
45 | + 탐방한 맛집을 클릭하면 쿠폰북에 기록됩니다 | ||
46 | + | ||
47 | + </div> | ||
48 | + | ||
49 | + <div id ="footer"></div> | ||
50 | + | ||
51 | + | ||
52 | + | ||
53 | + | ||
54 | + </body> | ||
55 | + | ||
56 | +</html> |
views/mybook.ejs
0 → 100644
1 | +<html> | ||
2 | + <head> | ||
3 | + <title><%= title %></title> | ||
4 | + <link rel='stylesheet' href='/stylesheets/style.css'/> | ||
5 | + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | ||
6 | + </head> | ||
7 | + <body> | ||
8 | + | ||
9 | + <script> | ||
10 | + | ||
11 | + $(document).ready(function() { | ||
12 | + $('.sidenav').hide(); | ||
13 | + | ||
14 | + $('#show').click(function() { | ||
15 | + | ||
16 | + $('.sidenav').slideToggle("fast"); | ||
17 | + }); | ||
18 | + }); | ||
19 | + | ||
20 | + | ||
21 | + </script> | ||
22 | + | ||
23 | + | ||
24 | + | ||
25 | + | ||
26 | + <div id ="menu"> | ||
27 | + <div id ="show">clickmenu</div> | ||
28 | + | ||
29 | + <ul class="sidenav"> | ||
30 | + <li><a class="active" href="home">home</a></li> | ||
31 | + <li><a href="map">맛집도장찍기</a></li> | ||
32 | + <li><a href="mybook">견문록확인</a></li> | ||
33 | + | ||
34 | + </ul> | ||
35 | + | ||
36 | + | ||
37 | + </div> | ||
38 | + | ||
39 | + | ||
40 | + <div id = "header"> </div> | ||
41 | + | ||
42 | + <div id ="content"> | ||
43 | + | ||
44 | + <table border="1"> | ||
45 | + | ||
46 | + | ||
47 | + <% | ||
48 | + for( var i=0; i<rows.length; i++) | ||
49 | + { | ||
50 | + | ||
51 | + | ||
52 | + for( var j = 0; j<3; j++){ | ||
53 | + num = i * 3 + j; | ||
54 | + var item = rows[num]; | ||
55 | + | ||
56 | + | ||
57 | + | ||
58 | + %> | ||
59 | + <tr> | ||
60 | + <td><p class="bold"><%=num%> : <%=item.name%></p> | ||
61 | + | ||
62 | + <p class="small"><%=item.place%></p></td> | ||
63 | + | ||
64 | + | ||
65 | + <% } %> | ||
66 | + | ||
67 | + </tr> | ||
68 | + | ||
69 | + | ||
70 | + <% | ||
71 | + } | ||
72 | + %> | ||
73 | + </table> | ||
74 | + | ||
75 | + | ||
76 | + | ||
77 | + | ||
78 | + | ||
79 | + </div> | ||
80 | + | ||
81 | + <div id ="footer"></div> | ||
82 | + | ||
83 | + | ||
84 | + | ||
85 | + | ||
86 | + </body> | ||
87 | + | ||
88 | +</html> |
-
Please register or login to post a comment