이유제 / CultureGallery

Go to a project
Toggle navigation Toggle navigation pinning
YujeLee
8725dbd5 1 parent a6872f5c

최종 수정

Inline Side-by-side
Showing 3 changed files with 170 additions and 0 deletions
1 +table{
2 + position: absolute;
3 + z-index: 2;
4 + left:50%;
5 + top: 20vh;
6 + margin-left: -75vh;
7 + width: 150vh;
8 + border-collapse: collapse;
9 + border-spacing: 0;
10 + border-radius: 12px 12px 0 0;
11 + overflow: hidden;
12 + background: #fafafa;
13 + text-align: center;
14 +}
15 +th,td{
16 + padding:12px 15px;
17 +}
18 +th{
19 + background: #303f9f;
20 + color: #fafafa;
21 + text-transform: uppercase;
22 +}
23 +
24 +tr:nth-child(odd){
25 + background-color: #eeeeee;
26 +}
27 +.name{
28 + position: absolute;
29 + width: 70vh;
30 + left:50%;
31 + margin-left:-35vh;
32 +}
33 +.question{
34 + position: absolute;
35 + top: 15vh;
36 + width: 40vh;
37 + left: 50%;
38 + margin-left:-15vh;
39 +}
...\ No newline at end of file ...\ No newline at end of file
1 +<!DOCTYPE html>
2 +<html>
3 + <head>
4 + <title> findpage</title>
5 + <link rel="stylesheet" href='/stylesheets/findPage_style.css' type="text/css">
6 +
7 + <script src="https://developers.kakao.com/sdk/js/kakao.js"></script>
8 + <script>
9 + Kakao.init('0678e32dab56db1c52ac63ab4ccb7663')
10 + function sendLink(id){
11 + var data=[];
12 + var strData = "<%= data %>";
13 + var splitData=strData.split(',');
14 + for(var i=0;i<splitData.length;i+=5){
15 + data.push([Number(splitData[i]),splitData[i+1],Number(splitData[i+2]),Number(splitData[i+3]),splitData[i+4],splitData[i+5]]);
16 + }
17 + var index;
18 + for(var i=0;i<data.length;i++){
19 + console.log(data.length);
20 + if(data[i][0]===id){
21 + index=i;
22 + Kakao.Link.sendDefault({
23 + objectType: 'location',
24 + address: `${data[i][5]}`,
25 + addressTitle: `${data[i][1]}`,
26 + content:{
27 + title: `공연 이름: ${data[i][1]}\n공연 위치: ${data[i][5]}`,
28 + description: `${splitData[i+2]}`,
29 + imageUrl:'https://ifh.cc/g/aEvr86.png',
30 + link:{
31 + mobileWebUrl: 'http://naver.com',
32 + webUrl: 'http://naver.com',
33 + },
34 + },
35 + buttons: [
36 + {
37 + title: 'Culture Gallery',
38 + link: {
39 + mobileWebUrl: 'http://naver.com',
40 + webUrl: 'http://naver.com',
41 + },
42 + },
43 + ],
44 + })
45 + }
46 + }
47 +
48 + }
49 + </script>
50 + </head>
51 + <body>
52 + <h1 class='name'>공연 이름을 검색해보세요!</h1>
53 +
54 + <div class = "question">
55 + <input type="text" value='' id="inputText" placeholder="어떤 공연을 찾으시나요?">
56 + <button onclick='find()'>검색</button>
57 + </div>
58 + </div>
59 + <table class="table" >
60 + <tr>
61 + <th>id</th>
62 + <th>행사 이름</th>
63 + <th>시작 날짜</th>
64 + <th>주소</th>
65 + <th>이동하기</th>
66 + </tr>
67 + <tbody id="map-data">
68 +
69 + </tbody>
70 + </table>
71 +
72 +</div>
73 + <script>
74 + function find(){
75 + var input= document.getElementById('inputText').value;
76 + var dataContainer=document.getElementById('map-data');
77 + var data=[];
78 + var strData = "<%= data %>";
79 + var splitData=strData.split(',');
80 + for(var i=0;i<splitData.length;i+=5){
81 + data.push([Number(splitData[i]),splitData[i+1],Number(splitData[i+2]),Number(splitData[i+3]),splitData[i+4],splitData[i+5]]);
82 + }
83 +
84 + for(var i=0;i<data.length;i++){
85 + if(data[i][1].indexOf(input)!=-1){
86 + var row = `<tr>
87 + <td> ${data[i][0]}</td>
88 + <td> ${data[i][1]}</td>
89 + <td> ${data[i][4]}</td>
90 + <td> ${data[i][5]}</td>
91 +
92 + <td> <input type="button" onclick="sendLink(${data[i][0]})" value="전송하기"> </td>
93 +
94 + </tr>`
95 + dataContainer.innerHTML+=row;
96 + }
97 + }
98 + }
99 + </script>
100 + </body>
101 +</html>
...\ No newline at end of file ...\ No newline at end of file
...@@ -6,6 +6,7 @@ var ejs = require('ejs'); ...@@ -6,6 +6,7 @@ var ejs = require('ejs');
6 6
7 7
8 var mapPage = fs.readFileSync('routes/mapPage.ejs', 'utf8'); 8 var mapPage = fs.readFileSync('routes/mapPage.ejs', 'utf8');
9 +var findPage = fs.readFileSync('routes/findPage.ejs','utf-8');
9 var dataNum = 0; 10 var dataNum = 0;
10 11
11 router.get('/mappage', (req, res) => { 12 router.get('/mappage', (req, res) => {
...@@ -37,6 +38,35 @@ router.get('/mappage', (req, res) => { ...@@ -37,6 +38,35 @@ router.get('/mappage', (req, res) => {
37 }); 38 });
38 }); 39 });
39 40
41 +router.get('/findpage', (req, res) => {
42 + connection.query('SELECT COUNT (*) AS cnt FROM SHOW_DATA', function (error, results, field) {
43 + if (error) {
44 + console.log(error);
45 + }
46 + console.log(results[0].cnt);
47 + dataNum = results[0].cnt;
48 + });
49 + ////
50 + connection.query('SELECT * FROM SHOW_DATA', function (error, results, field) {
51 + if (error) {
52 + console.log(error);
53 + } else {
54 + var show_list = [];
55 + for (var i = 0; i < dataNum; i++) {
56 + show_list.push([results[i].id, results[i].oper_name, results[i].latitude, results[i].longitude,results[i].start_day,results[i].where]);
57 + var page = ejs.render(findPage, {
58 + title: "show data",
59 + data: show_list,
60 + dataNum: dataNum,
61 + });
62 +
63 + }
64 + res.send(page);
65 + }
66 +
67 + });
68 +});
69 +
40 70
41 //루트 페이지 (메인페이지)에서 실행됨 : title 할당하고 main.html 띄워줌. 71 //루트 페이지 (메인페이지)에서 실행됨 : title 할당하고 main.html 띄워줌.
42 router.get('/', function (req, res, next) { 72 router.get('/', function (req, res, next) {
......