이승규

미래예측 구현완료

No preview for this file type
This diff is collapsed. Click to expand it.
......@@ -5,12 +5,12 @@ var db = require('../lib/db');
/* GET home page. */
router.post('/starting' , (req,res) => {
res.redirect(`/Cname/${req.body.name}/Cbirth/${req.body.birth}`);
})
//예보 추가
router.post('/forecasting' , (req,res) =>{
res.redirect(`/Fname/${req.body.name}/Fbirth/${req.body.birth}`);
})
if (req.body.action == "운명보기")
res.redirect(`/Cname/${req.body.name}/Cbirth/${req.body.birth}`);
else if (req.body.action == "미래확인")
res.redirect(`/Fname/${req.body.name}/Fbirth/${req.body.birth}`);
console.log(req.body.action);
});
router.get('/Fname/:name/Fbirth/:birth',(req,res)=>{
......@@ -131,7 +131,7 @@ router.get('/Cname/:name/Cbirth/:birth', (req,res) => {
dataLen,
name,
birth,
factorArr,
factorArr
});
}
});
......
......@@ -175,13 +175,11 @@
})
i++;
}
<% for(var n; n < probArr.length; n++) {%>
<% for(var n = 0; n < factorArr.length; n++) {%>
var temp, temp2;
temp = <%=probArr[n] %>;
temp2 = '<%= factorArr[n] %>';
temp2 = '<%=factorArr[n] %>';
// for(;j<10;j++)
// {
......
......@@ -25,7 +25,7 @@
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style type="text/css">
html,
html
{
margin: 0;
padding: 0;
......@@ -88,15 +88,12 @@
<label>생년월일</label>
<input type="text" name="birth" class="form-control" placeholder="971009" style="width:200px;" minlength="6" maxlength="6">
<br><br><br>
<input type="submit" value="운명보기" class="btn btn-danger" style="font-family: 'Yeon Sung', cursive; width:100px;font-weight: bold; font-size: 18px; background-color: white;">
<input type="submit" name="action" value="운명보기" class="btn btn-danger" style="font-family: 'Yeon Sung', cursive; width:100px;font-weight: bold; font-size: 18px; background-color: white;">
<br><br>
<input type="submit" name="action" value="미래확인" class="btn btn-danger" style="font-family: 'Yeon Sung', cursive; width:100px;font-weight: bold; font-size: 18px; background-color: white;">
</div>
</form>
<form action="/forecasting" method="post">
<div class="/forecasting" method="post">
<input type="submit" value="미래확인" class="btn btn-default" style="...">
</div>
</form>
</div>
</div>
......
<!DOCTYPE html>
<head>
<link href="https://fonts.googleapis.com/css?family=Nanum+Brush+Script&amp;subset=korean" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Yeon+Sung&amp;subset=korean" rel="stylesheet" />
......@@ -13,6 +14,17 @@
body {
margin: 0;
padding: 0;
margin-left:0px;
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
width : 100%;
font-size: 3.0em;
line-height: 3.0em;
font-weight : bold;
font-family: Yeon Sung;
text-align:center;
color: white;
/* background: linear-gradient( to bottom, #65799B, rgb(38, 14, 41) ); */
/* background-color:#65799B; */
......@@ -20,6 +32,15 @@
background-repeat: no-repeat;
background-size: cover; */
}
#center_top1 {position:absolute; top:100px; left:630px; height :25%; overflow:hidden; }
#center_top2 {position:absolute; top:300px; left:600px; height :25%; overflow:hidden;}
#center_top3 {position:absolute; top:500px; left:400px; height :25%; overflow:hidden;}
#banner {
position: absolute;
top: 0;
......@@ -29,21 +50,66 @@
</style>
</head>
<body>
<img src="images/background.jpg" alt="" style="z-index:-1; min-width: 100%; min-height: 100%"width="50%" height="100%">
<img src="images/background.jpg" alt="" style="z-index:-1; min-width: 100%; min-height: 100%"width="50%" height="100%">
<div id = "center_top1">
(사용자정보) 님은
</div>
<div id = "center_top2">
<div id = "timerTxt"></div>
</div>
<div id = "center_top3">
(사고 요인)로 인해 사망
</div>
<script src="/socket.io/socket.io.js"></script>
<script type = "text/javascript">
var deathNote;
var timerId;
var timerSec;
let client_data = {
birth: "<%=birth%>",
name: "<%=name%>"
}
var socket = io.connect('/', { transports: ['websocket'], upgrade: false });
socket.emit("connection", client_data);
socket.on("weatherInfo_minutely_send_to_client", (info) => { //서버에서 client에게 메세지 전송
// 첫 메세지를 받았을 때 페이지에 정보를 띄워줌
if (deathNote == undefined) {
deathNote = info.deathnote;
timerSec = deathNote.hours*3600 + deathNote.minutes*60 + deathNote.seconds;
timerId = setInterval('timer()', 1000);
<div class="menu">
document.getElementById('center_top1').innerHTML = client_data.name + " 님은";
document.getElementById('center_top3').innerHTML = deathNote.factor + " 합니다.";
<a id ="home">Home</a>
<a id ="paris">Paris</a>
<a id ="seoul">Seoul</a>
<a id ="tokyo">Tokyo</a>
</div>
}
console.log(deathNote);
});
// 타이머
function timer(){
var min = Math.floor(timerSec / 60) % 60;
var sec = timerSec % 60;
var hour = Math.floor(timerSec / 3600)
var msg = (hour < 10 ? "0" + hour : hour) + ":" + (min < 10 ? "0" + min : min) + ":" + (sec < 10 ? "0" + sec : sec) + " 후에";
timerSec--;
if (timerSec < 0){ // time end
clearInterval(timerId);
}
document.getElementById("timerTxt").innerHTML = msg ;
}
</script>
</body>
<img id ="photo" src="../image/home.png" width="50%" height="50%">
<script
src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
crossorigin="anonymous"></script>
<script src="../js/kts.js"type="text/javascript"></script>
</body>
\ No newline at end of file
......
<!DOCTYPE html>
<html>
<head>
<style type = "text/css">
body {margin-left:0px; margin-top:0px; margin-right:0px; margin-bottom:0px; width : 100%; font-size: 3.0em; line-height: 3.0em; font-weight : bold; font-family: Yeon Sung; text-align:center; color:white; background-image:url(../public/images/indexWallpaper.jpg); }
#center_top1 {position:absolute; top:50px; left:550px; height :25%; overflow:hidden; }
#center_top2 {position:absolute; top:200px; left:600px; height :25%; overflow:hidden;}
#center_top3 {position:absolute; top:350px; left:500px; height :25%; overflow:hidden;}
#center_top4 {position:absolute; top:500px; left:670px; height :25%; overflow:hidden; }
</style>
</head>
<body>
<div id = "center_top1">
(사용자정보) 님은
</div>
<div id = "center_top2">
<div id = "timerTxt"></div>
</div>
<div id = "center_top3">
(사고 요인)로 인해 사망
</div>
<div id = "center_top4">
합니다.
</div>
<script type = "text/javascript">
var timerId;
var timerSec = 3;
window.onload = function(){
timerId = setInterval('timer()', 1000);
}
function timer(){
var min = Math.floor(timerSec / 60)
var sec = timerSec % 60;
var hour = Math.floor(timerSec / 3600)
var msg = (hour < 10 ? "0" + hour : hour) + ":" + (min < 10 ? "0" + min : min) + ":" + (sec < 10 ? "0" + sec : sec);
timerSec--;
if (timerSec < 0){ // time end
clearInterval(timerId);
}
document.getElementById("timerTxt").innerHTML = msg ;
}
</script>
</body>
</html>
\ No newline at end of file