김명주 / kartrider

Go to a project
Toggle navigation Toggle navigation pinning
김명주
e66d3b8f 1 parent 46252a5d

Update kart recommend page

Expand all
Inline Side-by-side
Showing 104 changed files with 256 additions and 8 deletions
......@@ -48,15 +48,32 @@ app.get("/inf/result",(req,res)=>{
app.post("/game/result",(req,res)=>{
vec=req.body.test;
var item=["empty", "추억", "empty", "신중함","안정적","empty","열정","책임감","아이템","스피드","믿음직","호기심","헌신적","자유로움"];
keyword=[];
for(var i=1; i<vec.length; i++){
if(i%2!=0){
if(vec[i]=="1"){
keyword.push(item[i-1]);
}
else{
keyword.push(item[i]);
}
}
}
})
app.get("/game/result",(req,res)=>{
var temp="";
for(var i=0; i<vec.length; i++){
if(i!=2 && i!=3 && i!=4 && i!=5 && i!=10 && i!=11)
temp+=vec[i];
}
var fs=require('fs');
var url="kart_special"+vec+"/";
var testFolder="metadata/kart_special"+vec;
var url="kart_find"+temp+"/";
var testFolder="metadata/kart_find"+temp;
fs.readdir(testFolder, function(error, list){
var rand=Math.floor(Math.random()*list.length);
res.render('game_result',{url:url,body:list[rand]});
res.render('game_result',{url:url,body:list[rand],keyword:keyword});
});
});
......
#total
{
position:absolute;
background-image:url("result/background.png");
top:50%;
left:50%;
width:1300px;
height:650px;
margin:-325px 0px 0px -650px;
}
#words
{
position:absolute;
top:42%;
left:16%;
width:400px;
height:350px;
margin:-75px 0px 0px 0px;
}
#imgkey
{
position:relative;
left:15%;
}
#rkart
{
position:absolute;
background-image: url("result/kart.png");
width:350px;
height:350px;
top:30%;
left:60%;
}
#imgId
{
position:relative;
top:20%;
left:15%;
width:70%;
height:60%;
}
#word1
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:10%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word2
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:19%;
left:15%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word3
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:19%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word4
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:28%;
left:15%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word5
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:28%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word6
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:35%;
left:15%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#word7
{
position:relative;
font-family: 'Nanum Gothic';
font-size:large;
font-weight: bold;
top:38%;
width:160px;
height:40px;
border-radius: 30px;
border:0;
background: rgb(192, 234, 250);
box-shadow: 3px 3px 3px rgb(209, 207, 207);
}
#text1
{
position:relative;
left:15%;
font-family: 'Nanum Gothic';
font-size:50px;
font-weight: bold;
}
#text2
{
position:relative;
left:15%;
font-family: 'Nanum Gothic';
font-size:70px;
font-weight: bold;
color:rgb(0, 153, 255);
}
\ No newline at end of file
This diff could not be displayed because it is too large.
212라인 안함
1라인 안함
\ No newline at end of file
#uni
{
position:absolute;
top:60%;
left:80%;
}
#dao
{
position:absolute;
top:55%;
}
div
{
width: 500px;
......@@ -60,3 +72,10 @@ div
border-radius: 50%;
animation: spin 1s linear infinite;
}
#index
{
position:absolute;
left:55%;
}
\ No newline at end of file
......
......@@ -35,7 +35,10 @@
</head>
<body>
<img id="dao" src="image/bdao.png"></img>
<img id="uni" src="image/buni.png"></img>
<div class="box" id="div1">
<img id="index" src="image/one.png"></img>
<text id="tex1">Q1.</text><br>
<text id="tex2">대표 카트를 지정할 때</text>
<button id="btn" onClick="any(1,1)">가장 좋은 신규 카트로 전시한다.</button>
......@@ -43,6 +46,7 @@
</div>
<div class="box" id="div2" style="display:none">
<img id="index" src="image/two.png"></img>
<text id="tex1">Q2.</text><br>
<text id="tex2">3....2.....1 GAME START</text>
<button id="btn" onClick="any(2,1)">부스터를 사용하여 치고나간다.</button>
......@@ -50,6 +54,7 @@
</div>
<div class="box" id="div3" style="display:none">
<img id="index" src="image/three.png"></img>
<text id="tex1">Q3.</text><br>
<text id="tex2">스피드 전에서 중요하게 생각하는 것</text>
<button id="btn" onClick="any(3,1)">부스터 갯수</button>
......@@ -57,6 +62,7 @@
</div>
<div class="box" id="div4" style="display:none">
<img id="index" src="image/four.png"></img>
<text id="tex1">Q4.</text><br>
<text id="tex2">팀전을 하는 경우</text>
<button id="btn" onClick="any(4,1)">1등이 우선! 혼자 치고 나가기</button>
......@@ -64,6 +70,7 @@
</div>
<div class="box" id="div5" style="display:none">
<img id="index" src="image/five.png"></img>
<text id="tex1">Q5.</text><br>
<text id="tex2">현재 1등을 잡기위해</text>
<button id="btn" onClick="any(5,1)">아이템을 사용하여 격추한다.</button>
......@@ -71,6 +78,7 @@
</div>
<div class="box" id="div6" style="display:none">
<img id="index" src="image/six.png"></img>
<text id="tex1">Q6.</text><br>
<text id="tex2">나는 카트를 볼 때</text>
<button id="btn" onClick="any(6,1)">성능이 우선이다.</button>
......@@ -78,11 +86,11 @@
</div>
<div class="box" id="div7" style="display:none">
<img id="index" src="image/seven.png"></img>
<text id="tex1">Q7.</text><br>
<text id="tex2">넥슨 캐쉬가 생겼다.</text>
<button id="btn" onClick="any2(1); location.href='game/result'">유료 카트를 구매한다.</button>
<button id="btn" onClick="any2(2); location.href='game/result'">다른 게임(피파, 메이플)에 투자</button>
</div>
</body>
</html>
\ No newline at end of file
......
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="game_result.css" />
</head>
<script>
var item='<%- body %>';
var url='<%- url %>';
var stritem=item.split(".");
function load() {
return fetch("kart.json")
.then((response) => response.json())
.then((json) => json.kart);
}
load().then((kart) => {
const div_target = document.querySelector("#total");
var obj = document.createElement('text');
var obj2=document.createElement('text');
for (var i = 0; i < kart.length; i++) {
if (kart[i]['id'] == stritem[0]) {
obj.id="text1";
obj2.id="text2";
obj.innerText = "나에게 맞는 카트는 ";
obj2.innerText=kart[i]['name'];
break;
}
}
div_target.append(obj);
div_target.append(obj2);
});
function Img() {
return url+item;
}
</script>
</head>
<body>
<div id="total">
<div id="words">
<img id="imgkey" src="result/keyword.png">
</div>
<div id="rkart">
<img id="imgId" src="">
<script>document.getElementById("imgId").src = Img()</script>
</div>
</div>
</body>
<script>
var keyword="<%- keyword %>";
var keyarr=keyword.split(',');
const div_target=document.querySelector("#words");
var i=0, index=0;
while(index<7){
if(keyarr[index]!="empty"){
var obj=document.createElement('button');
obj.id="word"+(i+1);
obj.innerText='#'+keyarr[index];
div_target.append(obj);
i++;
}
index++;
}
</script>
</html>
\ No newline at end of file
......
This diff is collapsed. Click to expand it.