김명주 / kartrider

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

Update kart recommend page

Inline Side-by-side
Showing 104 changed files with 348 additions and 50 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
......
......@@ -3,54 +3,104 @@
<head>
<meta charset="utf-8">
<title>Hello World!</title>
<!--
<link rel="stylesheet" href="/css/master.css" >
-->
<link rel="stylesheet" type="text/css" href="search.css" />
</head>
<body>
<script language="JavaScript">
var name = '<%-name%>';
var level = '<%-level%>';
var trackId= '<%-trackId%>';
var kart='<%-kart%>';
document.write(name);
document.write("\n");
function Img() {
<script language="JavaScript">
function character(){
var a = Math.floor(Math.random() * 9) + 1;
return "main_character/" + a + ".png";
}
function Img2(){
return "level/"+level+".png"
}
function Img3(){
return "track/"+trackId+".png"
}
function Img4(){
return "kart/"+kart+".png"
}
</script>
<img id="imgId" src="" width="135" height="100">
<script>document.getElementById("imgId").src = Img()</script>
<p>레벨</p>
<img id="imgId2" src="">
<script>document.getElementById("imgId2").src = Img2()</script>
<H1>――――――――――――――――경기 정보――――――――――――――</H1>
<p>등수</p>
<span class="rank"><%= rank %></span>
<p>주행 시간</p>
<span class="time"><%= time %></span>
<p>트랙정보</p>
<img id="imgId3" src="">
<script>document.getElementById("imgId3").src = Img3()</script>
<p>카트정보</p>
<img id="imgId4" src="" width="135" height="100">
<script>document.getElementById("imgId4").src = Img4()</script>
function level(){
return "level/" + '<%- level %>' + ".png";
}
</script>
<body>
<div id="div">
<img id="imgId" src="" width="150" height="120">
<script>document.getElementById("imgId").src = character()</script>
<text id="nick"> <%- name %> </text>
<img id="imgId2" src="" width="30" height="30">
<script>document.getElementById("imgId2").src = level()</script>
</div>
<div id="sebo">
</div>
<div id="resu">
<div id="most">
</div>
<div id="div1">
<div id="div2"></div>
</div>
</div>
<div id="hle">
<text > 문의사항 : mjoo1106@naver.com | blog.naver.com/mjoo1106 </text>
</div>
</body>
<script>
var body = '<%- body -%>';
var match = JSON.parse(body);
var head=["승","타입","카트","맵","시간","순위","플레이"];
const target=document.querySelector('#div2');
for(var i=1; i<=7; i++){
var obj=document.createElement('div');
obj.id="tet"+i;
obj.innerText=head[i-1];
target.append(obj);
}
const div_target=document.querySelector('#div1');
for(var i=1; i<=5; i++){
var obj=document.createElement('div');
obj.id="fordiv";
div_target.append(obj);
var win = match.matches[0].matches[i-1].player.matchWin;
var tId = match.matches[0].matches[i-1].trackId;
var kartId = match.matches[0].matches[i-1].player.kart;
var mrank = match.matches[0].matches[i-1].player.matchRank;
var players = match.matches[0].matches[i-1].playerCount;
var stime = new Date(match.matches[0].matches[i-1].startTime.split('T')[0] + " " + match.matches[0].matches[i-1].startTime.split('T')[1]);
var etime = new Date(match.matches[0].matches[i-1].endTime.split('T')[0] + " " + match.matches[0].matches[i-1].endTime.split('T')[1]);
var diff = etime - stime
var minute = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
var second = Math.floor((diff % (1000 * 60)) / 1000);
var ranking = mrank + " / " + players
var diff_time=minute + " : " + second;
if(win==0)
win="패";
else
win="승";
if (mrank == "99") {
ranking = "retire";
diff_time = "retire";
}
var arr=[win,"타입",kartId,tId,diff_time,ranking,"몇 일전?"];
for(var j=1; j<=7; j++){
var sobj=document.createElement('div');
sobj.id="tet"+j;
if(j==3){
var img=document.createElement('img');
img.id="IMG";
img.src="kart/"+arr[j-1]+".png";
sobj.append(img);
}
else if(j==4){
var img=document.createElement('img');
img.id="IMG";
img.src="track/"+arr[j-1]+".png";
sobj.append(img);
}
else{
sobj.innerText=arr[j-1];
}
obj.append(sobj);
}
}
</script>
</html>
\ No newline at end of file
......