김명주

Update test result page design

...@@ -158,3 +158,26 @@ ...@@ -158,3 +158,26 @@
158 font-weight: bold; 158 font-weight: bold;
159 color:rgb(0, 153, 255); 159 color:rgb(0, 153, 255);
160 } 160 }
161 +#home
162 +{
163 + position:relative;
164 + font-family: 'Nanum Gothic';
165 + font-size:x-large;
166 + font-weight: bold;
167 + color:white;
168 + top:80%;
169 + left:35%;
170 + background-color: rgb(0, 153, 255);
171 +
172 +}
173 +#reset
174 +{
175 + position:relative;
176 + font-family: 'Nanum Gothic';
177 + font-size:x-large;
178 + font-weight: bold;
179 + color:white;
180 + top:80%;
181 + left:55%;
182 + background-color: rgb(0, 153, 255);
183 +}
...\ No newline at end of file ...\ No newline at end of file
......
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 +
3 <head> 4 <head>
4 <title>추천 카트</title> 5 <title>추천 카트</title>
5 <link rel="stylesheet" type="text/css" href="test_result.css" /> 6 <link rel="stylesheet" type="text/css" href="test_result.css" />
6 </head> 7 </head>
7 <script> 8 <script>
8 - var item='<%- body %>'; 9 + var item = '<%- body %>';
9 - var url='<%- url %>'; 10 + var url = '<%- url %>';
10 - var stritem=item.split("."); 11 + var stritem = item.split(".");
11 function load() { 12 function load() {
12 return fetch("metadata/kart.json") 13 return fetch("metadata/kart.json")
13 .then((response) => response.json()) 14 .then((response) => response.json())
...@@ -16,13 +17,13 @@ ...@@ -16,13 +17,13 @@
16 load().then((kart) => { 17 load().then((kart) => {
17 const div_target = document.querySelector("#total"); 18 const div_target = document.querySelector("#total");
18 var obj = document.createElement('text'); 19 var obj = document.createElement('text');
19 - var obj2=document.createElement('text'); 20 + var obj2 = document.createElement('text');
20 for (var i = 0; i < kart.length; i++) { 21 for (var i = 0; i < kart.length; i++) {
21 if (kart[i]['id'] == stritem[0]) { 22 if (kart[i]['id'] == stritem[0]) {
22 - obj.id="text1"; 23 + obj.id = "text1";
23 - obj2.id="text2"; 24 + obj2.id = "text2";
24 obj.innerText = "나에게 맞는 카트는 "; 25 obj.innerText = "나에게 맞는 카트는 ";
25 - obj2.innerText=kart[i]['name']; 26 + obj2.innerText = kart[i]['name'];
26 break; 27 break;
27 } 28 }
28 } 29 }
...@@ -31,9 +32,10 @@ ...@@ -31,9 +32,10 @@
31 }); 32 });
32 33
33 function Img() { 34 function Img() {
34 - return url+item; 35 + return url + item;
35 } 36 }
36 </script> 37 </script>
38 +
37 <body> 39 <body>
38 <div id="total"> 40 <div id="total">
39 <div id="words"> 41 <div id="words">
...@@ -43,22 +45,25 @@ ...@@ -43,22 +45,25 @@
43 <img id="imgId" src=""> 45 <img id="imgId" src="">
44 <script>document.getElementById("imgId").src = Img()</script> 46 <script>document.getElementById("imgId").src = Img()</script>
45 </div> 47 </div>
48 + <button id="reset" onClick="location.href='/test'">다시하기</button>
49 + <button id="home" onClick="location.href='/'">HOME</button>
46 </div> 50 </div>
47 </body> 51 </body>
48 <script> 52 <script>
49 - var keyword="<%- keyword %>"; 53 + var keyword = "<%- keyword %>";
50 - var keyarr=keyword.split(','); 54 + var keyarr = keyword.split(',');
51 - const div_target=document.querySelector("#words"); 55 + const div_target = document.querySelector("#words");
52 - var i=0, index=0; 56 + var i = 0, index = 0;
53 - while(index<7){ 57 + while (index < 7) {
54 - if(keyarr[index]!="empty"){ 58 + if (keyarr[index] != "empty") {
55 - var obj=document.createElement('button'); 59 + var obj = document.createElement('button');
56 - obj.id="word"+(i+1); 60 + obj.id = "word" + (i + 1);
57 - obj.innerText='#'+keyarr[index]; 61 + obj.innerText = '#' + keyarr[index];
58 div_target.append(obj); 62 div_target.append(obj);
59 i++; 63 i++;
60 } 64 }
61 index++; 65 index++;
62 } 66 }
63 </script> 67 </script>
68 +
64 </html> 69 </html>
...\ No newline at end of file ...\ No newline at end of file
......