고다경 / Open_Source_project

Go to a project
Toggle navigation Toggle navigation pinning
김용재
ce7fb93a 1 parent 2c50f599

메인 페이지 수정, 메인페이지랑 회원가입페이지 연동

Inline Side-by-side
Showing 3 changed files with 142 additions and 39 deletions
...@@ -39,22 +39,24 @@ ...@@ -39,22 +39,24 @@
39 39
40 <br><br><br> 40 <br><br><br>
41 41
42 - <div id = "login-ing" style="width:100%; text-align: center; margin-top: 5ch"> 42 + <div id = "login-ing" style="width:100%; text-align: center; margin-top: 5ch">
43 - <form action="/starting" method="post"> 43 + <div class="form-inline">
44 - <div class="form-inline"> 44 + <form action="/login" method="post">
45 - <label>ID</label> 45 + <label>ID</label>
46 - <input type="text" name="name" class="form-control" placeholder="홍길동" style="width:200px;"> 46 + <input type="text" name="name" class="form-control" placeholder="홍길동" style="width:200px;">
47 - &nbsp &nbsp&nbsp&nbsp 47 + &nbsp &nbsp&nbsp&nbsp
48 - 48 +
49 - <label>Password</label> 49 + <label>Password</label>
50 - <input type="password" name="birth" class="form-control" placeholder="*******" style="width:200px;"> 50 + <input type="password" name="birth" class="form-control" placeholder="*******" style="width:200px;">
51 - <br><br><br> 51 + <br><br><br>
52 - 52 + <input type="submit" value="Login" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
53 - <input type="submit" value="Login" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;"> 53 + </form>
54 - <br><br> 54 + <br><br>
55 - <input type="submit" value="Sign Up" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;"> 55 + <form action="/signup" method="get">
56 + <input type="submit" value="Sign Up" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
57 + </form>
56 </div> 58 </div>
57 - </form> 59 +
58 </div> 60 </div>
59 61
60 </div> 62 </div>
......
1 module.exports = { 1 module.exports = {
2 - HTML:function(title, list, body){ 2 + HTML:function(title,ch,line, list, body,control){
3 return ` 3 return `
4 <!DOCTYPE html> 4 <!DOCTYPE html>
5 <html lang="en"> 5 <html lang="en">
...@@ -14,6 +14,14 @@ module.exports = { ...@@ -14,6 +14,14 @@ module.exports = {
14 14
15 </script> 15 </script>
16 <style > 16 <style >
17 +
18 + #banner {
19 + position: absolute;
20 + top: 0;
21 + width: 100%;
22 + margin-top: ${ch};
23 + color: white;
24 + }
17 25
18 #footer { 26 #footer {
19 position: absolute; 27 position: absolute;
...@@ -25,28 +33,25 @@ module.exports = { ...@@ -25,28 +33,25 @@ module.exports = {
25 } 33 }
26 34
27 </style> 35 </style>
36 + ${line}
28 </head> 37 </head>
29 <body> 38 <body>
30 - <img src = > 39 + <img src = "images/main_background.jpg" alt="" style="z-index:-1; min-width: 100%; height: 700px;"></img>
31 - ${body} 40 + <div id="banner">
41 + ${body}
42 +
43 +
32 <br><br><br> 44 <br><br><br>
33 45
34 - <div style="width:100%; text-align: center; "> 46 +
35 - <form action="/starting" method="post"> 47 +
36 - <div class="form-inline"> 48 + ${control}
37 - <label>ID</label> 49 +
38 - <input type="text" name="name" class="form-control" placeholder="홍길동" style="width:200px;">
39 - &nbsp &nbsp&nbsp&nbsp
40 - <label>Password</label>
41 - <input type="text" name="birth" class="form-control" placeholder="*******" style="width:200px;">
42 - <br><br><br>
43 - <input type="submit" value="Login" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
44 - </div>
45 - </form>
46 - </div>
47 50
51 +
52 + </div>
48 53
49 - <div id="footer">오픈소스SW Project 2019-1 고다경 김용재 김태희</div> 54 + <div id="footer">오픈소스SW Project 2019-1 고다경 김용재 김태희</div>
50 </body> 55 </body>
51 </html> 56 </html>
52 `; 57 `;
......
...@@ -6,18 +6,114 @@ var fs = require('fs'); ...@@ -6,18 +6,114 @@ var fs = require('fs');
6 // var sanitizeHtml = require('sanitize-html'); 6 // var sanitizeHtml = require('sanitize-html');
7 var template = require('./lib/template.js'); 7 var template = require('./lib/template.js');
8 8
9 +app.use(express.static('data'));
9 app.get('/', function(request, response) { 10 app.get('/', function(request, response) {
10 fs.readdir('./data', function(error, filelist){ 11 fs.readdir('./data', function(error, filelist){
11 var title = 'Health Care'; 12 var title = 'Health Care';
12 var description = '오늘은 얼마나 먹었어요?'; 13 var description = '오늘은 얼마나 먹었어요?';
13 var list = template.list(filelist); 14 var list = template.list(filelist);
14 - var html = template.HTML(title, list, 15 + var ch='15ch'
15 - `<div id="banner" > 16 + var html = template.HTML(title,ch,'', list,
16 - 17 + `<h1 style="font-size: 50px; text-align: center; ">${description}</h1>`,
17 - <h1 style="font-size: 50px; text-align: center; ">${description}</h1> 18 + `<div id = "login-ing" style="width:100%; text-align: center; margin-top: 5ch">
18 - 19 + <div class="form-inline">
19 - 20 + <form action="/login" method="post">
20 - </div>` 21 + <label>ID</label>
22 + <input type="text" name="name" class="form-control" placeholder="홍길동" style="width:200px;">
23 + &nbsp &nbsp&nbsp&nbsp
24 +
25 + <label>Password</label>
26 + <input type="password" name="birth" class="form-control" placeholder="*******" style="width:200px;">
27 + <br><br><br>
28 + <input type="submit" value="Login" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
29 + </form>
30 + <br><br>
31 + <form action="/signup" method="get">
32 + <input type="submit" value="Sign Up" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
33 + </form>
34 + </div>
35 +
36 +</div>`
37 + );
38 + response.send(html);
39 + });
40 + });
41 +
42 + app.get('/signup', function(request, response) {
43 + fs.readdir('./data', function(error, filelist){
44 + var title = 'Sign Up Page';
45 + var description = '오늘은 얼마나 먹었어요?';
46 + var list = template.list(filelist);
47 + var ch='5ch'
48 + var html = template.HTML(title,ch,`<link rel="stylesheet" type="text/css" href="./a.css" />`, list,
49 + `<h1 style="width: 100%; text-align: center; font-size: 40px;">${description}</h1>`,
50 +`<div id = "signup-ing" style="width:100%; text-align: center;">
51 +<form action="/starting" method="post">
52 + <div class="form-inline">
53 + <div class="input-area">
54 + <span class="input-label">
55 + <label name="ID">ID</label>
56 + </span>
57 + <span class="input-box">
58 + <input type="text" name="ID" >
59 + </span>
60 + </div>
61 +
62 + <div class="input-area">
63 + <span class="input-label">
64 + <label name="Password">Password</label>
65 + </span>
66 + <span class="input-box">
67 + <input type="text" name="Password" >
68 + </span>
69 + </div>
70 +
71 + <div class="input-area">
72 + <span class="input-label">
73 + <label name="age">나이(세)</label>
74 + </span>
75 + <span class="input-box">
76 + <input type="text" name="age" >
77 + </span>
78 + </div>
79 +
80 + <div class="input-area">
81 + <span class="input-label">
82 + <label name="male/female">성별</label>
83 + </span>
84 + <select id="male/female" style="width: 200px; ">
85 + <option>성별 선택</option>
86 + <option>남자</option>
87 + <option>여자</option>
88 +
89 + </select>
90 + </div>
91 +
92 + <div class="input-area">
93 + <span class="input-label">
94 + <label name="height">키(cm)</label>
95 + </span>
96 + <span class="input-box">
97 + <input type="text" name="height" >
98 + </span>
99 +
100 + </div>
101 +
102 + <div class="input-area">
103 + <span class="input-label">
104 + <label name="weight">체중(kg)</label>
105 + </span>
106 + <span class="input-box">
107 + <input type="text" name="weight" >
108 + </span>
109 + </div>
110 +
111 + <br><br><br>
112 +
113 + <input type="submit" value="Sign Up" class="btn btn-default" style=" width:100px;font-weight: bold; font-size: 18px; background-color: white;">
114 + </div>
115 +</form>
116 +</div>`
21 ); 117 );
22 response.send(html); 118 response.send(html);
23 }); 119 });
......