조인천 / Youtube_MPL

Go to a project
Toggle navigation Toggle navigation pinning
조인천
d98526ea 1 parent 50c377ec

api하이퍼링크

Inline Side-by-side
Showing 12 changed files with 323 additions and 29 deletions
...@@ -7,8 +7,10 @@ ...@@ -7,8 +7,10 @@
7 var express = require('express') 7 var express = require('express')
8 , routes = require('./routes') 8 , routes = require('./routes')
9 , todo = require('./routes/todo') 9 , todo = require('./routes/todo')
10 + , login =require('./routes/login')
10 , http = require('http') 11 , http = require('http')
11 - , path = require('path'); 12 + , path = require('path')
13 + , fs = require('fs');
12 14
13 var app = express(); // 어플리케이션 생성 15 var app = express(); // 어플리케이션 생성
14 var port = 3000; // 어플리케이션 포트 16 var port = 3000; // 어플리케이션 포트
...@@ -35,7 +37,21 @@ app.configure('development', function(){ // 개발 버전 ...@@ -35,7 +37,21 @@ app.configure('development', function(){ // 개발 버전
35 }); 37 });
36 38
37 // 라우팅 39 // 라우팅
38 -app.get('/', routes.index); 40 +app.get('/Vlist', routes.index);
41 +app.get('/',function(req,res){
42 + fs.readFile('./views/login.html',function(error,data){
43 + res.writeHead(200, {'Content-Type': 'text/html'});
44 + res.end(data);
45 + })
46 +});
47 +app.get('/signup',function(req,res){
48 + fs.readFile('./views/signup.html',function(error,data){
49 + res.writeHead(200,{'Content-Type':'text/html'});
50 + res.end(data);
51 + })
52 +})
53 +app.get('/LogInForm',login.LogInForm);
54 +app.post('/SignUpForm',login.SignUpForm);
39 app.get('/list', todo.list); 55 app.get('/list', todo.list);
40 app.post('/add', todo.add); 56 app.post('/add', todo.add);
41 app.post('/complete', todo.complete); 57 app.post('/complete', todo.complete);
......
1 +$(document).ready(function(){
2 +
3 + // 로그인 처리
4 + $('#login-submit').click(function(e) {
5 + if ($("#userid").val() == '') {
6 + alert('아이디를 입력하세요');
7 + $("#userid").focus();
8 + return false;
9 + }
10 +
11 + if ($("#password").val() == '') {
12 + alert('비밀번호를 입력하세요');
13 + $("#password").focus();
14 + return false;
15 + }
16 + var Info={
17 + 'userId': $('#userid').val(),
18 + 'password' : $('#password').val()
19 + }
20 + $.ajax('/LogInForm',{
21 + 'method': 'GET',
22 + 'data': {
23 + 'Info' : Info
24 + },
25 + 'success': function(list){
26 + list=JSON.parse(list).list;
27 + for (var i=0, len=list.length; i < len; i++){
28 + if (list[i].userId==Info['userId']){
29 + if (list[i].password==Info['password']){
30 + location.href='/Vlist';
31 + }
32 + }
33 + }
34 + }
35 + })
36 +})
37 + $('#makeInfo').click(function(e){
38 + location.href='/signup';
39 + })
40 +});
1 +$(function() {
2 + // 로그인 처리
3 + $('#submit').click(function(e) {
4 + if ($("#fname").val() == '') {
5 + alert('이름을 입력하세요');
6 + $("#fname").focus();
7 + return false;
8 + }
9 + if ($("#email").val()== ''){
10 + alert('아이디를 입력하세요.')
11 + $('#email').focus();
12 + return false;
13 + }
14 + if ($("#ssnein").val()==''){
15 + alert("API키를 입력하세요");
16 + $("#ssnein").focus();
17 + return false;
18 + }
19 + if ($("#passwd").val() == '') {
20 + alert('비밀번호를 입력하세요');
21 + $("#passwd").focus();
22 + return false;
23 + }
24 + if ($("#passwdcheck").val() != $("#passwd").val()){
25 + alert("비밀번호 불일치");
26 + $("#passwdcheck").focus();
27 + return false;
28 + }
29 +
30 + $.ajax('/SignUpForm',{
31 + 'method': 'Post',
32 + 'data': {
33 + 'fname': $('#fname').val(),
34 + 'userId': $('#email').val(),
35 + 'API':$('#ssnein').val(),
36 + 'password' : $('#passwd').val(),
37 + },
38 + 'success': function(e){
39 + location.href='/login';
40 + }
41 + })
42 +})
43 +});
...\ No newline at end of file ...\ No newline at end of file
...@@ -3,7 +3,6 @@ $(document).ready(function () { ...@@ -3,7 +3,6 @@ $(document).ready(function () {
3 $.ajax('/list', { 3 $.ajax('/list', {
4 'success': function (list) { 4 'success': function (list) {
5 var trs = ''; 5 var trs = '';
6 -
7 list = JSON.parse(list).list; 6 list = JSON.parse(list).list;
8 7
9 for(var i = 0, len = list.length; i < len; i++) { // 테이블 내용 만들기 8 for(var i = 0, len = list.length; i < len; i++) { // 테이블 내용 만들기
...@@ -23,10 +22,23 @@ $(document).ready(function () { ...@@ -23,10 +22,23 @@ $(document).ready(function () {
23 get_list(); 22 get_list();
24 23
25 $('.form-inline button').click(function () { // 새로운 할 일 추가하기 24 $('.form-inline button').click(function () { // 새로운 할 일 추가하기
25 + var $getVal = $('#new_todo').val();
26 + var $getVal2 = $('#count').val();
27 + if ($getVal==""){
28 + alert("검색어를 입력하세요");
29 + $("#new_todo").focus();
30 + return;
31 + }
32 + if ($getVal2==""){
33 + alert("갯수를 입력하세요");
34 + $("#count").focus();
35 + return;
36 + }
26 $.ajax('/add', { 37 $.ajax('/add', {
27 'method': 'POST', 38 'method': 'POST',
28 'data': { 39 'data': {
29 - 'contents': $('#new_todo').val() 40 + 'contents': $('#new_todo').val(),
41 + 'counts' : $('#count').val()
30 }, 42 },
31 'success': get_list 43 'success': get_list
32 }); 44 });
...@@ -40,6 +52,7 @@ $(document).ready(function () { ...@@ -40,6 +52,7 @@ $(document).ready(function () {
40 }, 52 },
41 'success': get_list 53 'success': get_list
42 }); 54 });
55 + alert("다운로드가 완료되었습니다.");
43 }); 56 });
44 57
45 $('tbody').on('click', '.btn-danger', function () { // 선택한 할 일 삭제하기 58 $('tbody').on('click', '.btn-danger', function () { // 선택한 할 일 삭제하기
......
1 +var fs = require('fs');
2 +var request = require('request');
3 +
4 +exports.LogInForm=function(req,res){
5 + fs.exists('./user_list.json', function (exists) { // ToDo 목록 존재 확인
6 + if(exists) {
7 + fs.readFile('./user_list.json', {
8 + 'encoding': 'utf8'
9 + }, function (err, list) {
10 + console.log(list);
11 + res.json(list);
12 + });
13 + } else {
14 + var list = { // 기본 ToDo 목록 형식
15 + 'list': []
16 + };
17 +
18 + fs.writeFile('./user_list.json', JSON.stringify(list), function (err) { // todo_list.json 파일 쓰기
19 + res.json(list);
20 + });
21 + }
22 + });
23 +};
24 +
25 +exports.SignUpForm=function(req,res){
26 + fs.readFile('./user_list.json',{
27 + 'encoding':'utf-8'
28 + },function(err,data){
29 + data=JSON.parse(data);
30 + var Info={
31 + 'fname': req.body.fname,
32 + 'userId': req.body.userId,
33 + 'API':req.body.API,
34 + 'password' : req.body.password,
35 + }
36 + data.list.push(Info);
37 + fs.writeFile('./user_list.json',JSON.stringify(data),function(err){
38 + res.json(true);
39 + });
40 + }
41 + )
42 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -28,20 +28,21 @@ exports.list = function(req, res){ // ToDo 목록 가져오기 ...@@ -28,20 +28,21 @@ exports.list = function(req, res){ // ToDo 목록 가져오기
28 28
29 29
30 30
31 +
31 exports.add = function(req, res1){ // 새로운 ToDo 항목 추가하기 32 exports.add = function(req, res1){ // 새로운 ToDo 항목 추가하기
32 33
33 //유튜브 api 이용 검색부분 34 //유튜브 api 이용 검색부분
34 35
36 + console.log(req.body);
35 var optionParams = { 37 var optionParams = {
36 q:req.body.contents, 38 q:req.body.contents,
37 part:"snippet", 39 part:"snippet",
38 - key:"AIzaSyCgGa6aM7taXs4bajtYukbc_EQAKTLVTNc", 40 + key:"AIzaSyCTR9nHa9PheDMJO9O91Oj8HRJcu81bP_M",
39 type:"video", 41 type:"video",
40 - maxResults:5, 42 + maxResults: Number(req.body.counts),
41 regionCode:"KR", 43 regionCode:"KR",
42 order:"viewCount" 44 order:"viewCount"
43 }; 45 };
44 -
45 optionParams.q = encodeURI(optionParams.q); 46 optionParams.q = encodeURI(optionParams.q);
46 47
47 var url="https://www.googleapis.com/youtube/v3/search?"; 48 var url="https://www.googleapis.com/youtube/v3/search?";
...@@ -51,38 +52,36 @@ exports.add = function(req, res1){ // 새로운 ToDo 항목 추가하기 ...@@ -51,38 +52,36 @@ exports.add = function(req, res1){ // 새로운 ToDo 항목 추가하기
51 52
52 //url의마지막에 붙어있는 & 정리 53 //url의마지막에 붙어있는 & 정리
53 url=url.substr(0, url.length-1); 54 url=url.substr(0, url.length-1);
54 - 55 + var data;
55 request(url, function(err, res, body){ 56 request(url, function(err, res, body){
57 + // console.log(body)
56 58
57 - fs.readFile('./todo_list.json', { 59 + //json형식을 서버로 부터 받음
58 - 'encoding': 'utf8' 60 + data2=JSON.parse(body).items;
59 - }, function (err, data1) { 61 + fs.readFile('./todo_list.json',{
60 - data1 = JSON.parse(data1); 62 + 'encoding':'utf8'
61 - data1.list=[]; 63 + },function(err,data){
62 - var data=JSON.parse(body).items; 64 + data= JSON.parse(data);
63 - for(var content in data){ 65 + for (var content in data2){
64 - //youtube downloader에 videoId 넘기면 됨.
65 var todo = { // 기본 ToDo 항목 형식 66 var todo = { // 기본 ToDo 항목 형식
66 'contents': '', 67 'contents': '',
67 'videoId':'', 68 'videoId':'',
68 'complete': false 69 'complete': false
69 }; 70 };
70 - console.log(data[content].snippet.title+" : "+data[content].id.videoId); 71 + var a=data2[content].snippet.title;
71 - todo.contents = data[content].snippet.title; 72 + console.log(a+" : "+data2[content].id.videoId);
72 - todo.videoId = data[content].id.videoId; 73 + todo.contents = a;
73 - data1.list.push(todo); 74 + todo.videoId = data2[content].id.videoId;
74 - } // 새로운 ToDo 항목 추가 75 + data.list.push(todo);
75 - 76 + fs.writeFile('./todo_list.json',JSON.stringify(data),function(err){
76 - fs.writeFile('./todo_list.json', JSON.stringify(data1), function (err) {
77 res1.json(true); 77 res1.json(true);
78 }); 78 });
79 + }
79 }); 80 });
80 - //json형식을 서버로 부터 받음
81 -
82 }); 81 });
83 }; 82 };
84 83
85 -exports.complete = function(req, res){ // 선택한 ToDo 항목 다운로드 하기 84 +exports.complete = function(req, res){ // 선택한 ToDo 항목 완료하기
86 fs.readFile('./todo_list.json', { 85 fs.readFile('./todo_list.json', {
87 'encoding': 'utf8' 86 'encoding': 'utf8'
88 }, function (err, data) { 87 }, function (err, data) {
...@@ -98,11 +97,15 @@ exports.complete = function(req, res){ // 선택한 ToDo 항목 다운로드 하 ...@@ -98,11 +97,15 @@ exports.complete = function(req, res){ // 선택한 ToDo 항목 다운로드 하
98 console.log('filename : '+ info.filename); 97 console.log('filename : '+ info.filename);
99 console.log('size : '+info.size); 98 console.log('size : '+info.size);
100 }); 99 });
101 - video.pipe(fs.createWriteStream(data.list[req.body.index].contents+'.mp4')); 100 + var a= data.list[req.body.index].contents
101 + var regExp = /[\{\}\[\]\/?.,;:|\)*~`!^\-_+<>@\#$%&\\\=\(\'\"]/gi;
102 + a=a.replace(regExp,"");
103 + video.pipe(fs.createWriteStream(a+'.mp4'));
102 console.log(data.list[req.body.index].contents); 104 console.log(data.list[req.body.index].contents);
103 fs.writeFile('./todo_list.json', JSON.stringify(data), function (err) { 105 fs.writeFile('./todo_list.json', JSON.stringify(data), function (err) {
104 res.json(true); 106 res.json(true);
105 }); 107 });
108 + return;
106 }); 109 });
107 }; 110 };
108 111
......
1 -{"list":[{"contents":"손흥민 잉글랜드무대 첫 해트트릭,,,!!! 평점 10점받은 경기 ● 토트넘 vs 밀월 ● 하이라이트","videoId":"wbv5bUErdX0","complete":false},{"contents":"손흥민에게 해축갤 손흥민 드립 모음을 보여주었닼ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ l 슛포러브 Shoot for Love","videoId":"UFhdG30qVQc","complete":false},{"contents":"월클 손흥민의 런던 일상 최초 공개합니다!!! 역시 이러니 월클일수밖에... l 슛포러브 Shoot for Love","videoId":"9aSKkd2PAfw","complete":false},{"contents":"KNUCKLEBALL CHALLENGE WITH SON HEUNG-MIN (손흥민) ⚽☄","videoId":"m1te3mCVGBQ","complete":false},{"contents":"우리가 원했던 경기력 !!! 손흥민 멀티골, 기성용 탈압박 ● 대한민국 vs 콜롬비아 ● 하이라이트","videoId":"9dQ02l7YlQI","complete":false}]}
...\ No newline at end of file ...\ No newline at end of file
1 +{"list":[{"contents":"[MV] Samuel(사무엘) _ Sixteen (Feat. Changmo)(식스틴 (Feat. 창모))","videoId":"NMPg8xVcjVs","complete":false},{"contents":"창모 (CHANGMO) - 아름다워 (Beautiful) (OFFICIAL AUDIO)","videoId":"ywwU5ka1fBs","complete":false},{"contents":"[MV] HYOLYN, CHANGMO(효린, 창모) _ BLUE MOON (Prod. GroovyRoom)","videoId":"GeJAee3m3Ik","complete":false}]}
...\ No newline at end of file ...\ No newline at end of file
......
1 +{"list":[{"fname":"김경훈","userId":"kkh115505@naver.com","API":"abcdefg","password":"1234"},{"fname":"조인천","userId":"dlscjs5362@naver.com","API":"AIzaSyCTR9nHa9PheDMJO9O91Oj8HRJcu81bP_M","password":"asd"}]}
...\ No newline at end of file ...\ No newline at end of file
...@@ -12,7 +12,10 @@ ...@@ -12,7 +12,10 @@
12 <div class="form-group"> 12 <div class="form-group">
13 <input type="text" class="form-control" id="new_todo" placeholder="유튜브명"> 13 <input type="text" class="form-control" id="new_todo" placeholder="유튜브명">
14 </div> 14 </div>
15 - <button type="button" class="btn btn-primary">추가</button> 15 + <div class ="form-group">
16 + <input type="number"class="form-control" id="count" placeholder ="갯수">
17 + </div>
18 + <button type="button" class="btn btn-primary">검색</button>
16 </form> 19 </form>
17 <table class="table"> <!-- ToDo 목록 --> 20 <table class="table"> <!-- ToDo 목록 -->
18 <thead> 21 <thead>
......
1 +<!------ Include the above in your HEAD tag ---------->
2 +
3 +<!doctype html>
4 +<html lang="en">
5 +<head>
6 + <!-- Required meta tags -->
7 + <meta charset="utf-8">
8 + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
9 + <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
10 + <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
11 + <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
12 + <!-- Fonts -->
13 + <link rel="dns-prefetch" href="https://fonts.gstatic.com">
14 + <link href="https://fonts.googleapis.com/css?family=Raleway:300,400,600" rel="stylesheet" type="text/css">
15 +
16 + <link rel="stylesheet" href="/stylesheets/style.css">
17 + <!-- Bootstrap CSS -->
18 + <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
19 + <title>로그인</title>
20 +</head>
21 +<body>
22 +<main class="login-form">
23 + <div class="cotainer">
24 + <div class="row justify-content-center">
25 + <div class="col-md-8">
26 + <div class="card">
27 + <div class="card-header">Login</div>
28 + <div class="card-body">
29 + <form action="" method="">
30 + <div class="form-group row">
31 + <label for="userid" class="col-md-4 col-form-label text-md-right">E-Mail Address</label>
32 + <div class="col-md-6">
33 + <input type="text" id="userid" class="form-control" name="userid" required autofocus>
34 + </div>
35 + </div>
36 +
37 + <div class="form-group row">
38 + <label for="password" class="col-md-4 col-form-label text-md-right">Password</label>
39 + <div class="col-md-6">
40 + <input type="password" id="password" class="form-control" name="password" required>
41 + </div>
42 + </div>
43 + <div class="col-md-6 offset-md-4">
44 + <button type="submit" id="login-submit" class="btn btn-primary">
45 + 로그인
46 + </button>
47 + <button type="button" id="makeInfo" class="btn btn-primary">
48 + 회원가입하기
49 + </button>
50 + </a>
51 + </div>
52 + </div>
53 + </form>
54 + </div>
55 + </div>
56 + </div>
57 + </div>
58 + </div>
59 +
60 +</main>
61 +</body>
62 +<script src="/javascripts/login.js"></script>
63 +</html>
...\ No newline at end of file ...\ No newline at end of file
1 +<!doctype html>
2 +<html lang="en">
3 +<head>
4 +<meta charset="utf-8">
5 +<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6 +<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
7 +<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
8 +<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
9 +<!------ Include the above in your HEAD tag ---------->
10 +<title>회원가입 페이지</title>
11 +</head>
12 +<form class="form-horizontal">
13 +<fieldset>
14 +
15 +<!-- Form Name -->
16 +<legend>새로운 사용자 등록</legend>
17 +
18 +<!-- Text input-->
19 +<div class="form-group">
20 + <label class="col-md-4 control-label" for="fname">이름</label>
21 + <div class="col-md-5">
22 + <input id="fname" name="fname" type="text" placeholder="이름을 입력하세요." class="form-control input-md" required="">
23 + </div>
24 +</div>
25 +
26 +<!-- Text input-->
27 +<div class="form-group">
28 + <label class="col-md-4 control-label" for="email">아이디</label>
29 + <div class="col-md-5">
30 + <input id="email" name="email" type="eamil" placeholder="이메일을 입력하세요." class="form-control input-md" required="">
31 + </div>
32 +</div>
33 +
34 +<!-- Text input-->
35 +<div class="form-group">
36 + <label class="col-md-4 control-label" for="ssnein">YouTube Api Key</label>
37 + <div class="col-md-5">
38 + <input id="ssnein" name="ssnein" type="text" placeholder="YouTube Api Key" class="form-control input-md" required="">
39 + <a href="https://developers.google.com/youtube/v3/getting-started?hl=ko">Youtube API 키 받으러 가기</a>
40 + </div>
41 +</div>
42 +<!-- Text input-->
43 +<div class="form-group">
44 + <label class="col-md-4 control-label" for="passwd">비밀번호</label>
45 + <div class="col-md-5">
46 + <input id="passwd" name="passwd" type="password" placeholder="비밀번호를 입력하세요." class="form-control input-md" required="">
47 + </div>
48 +</div>
49 +
50 +<div class="form-group">
51 + <label class="col-md-4 control-label" for="passwdcheck">비밀번호확인</label>
52 + <div class="col-md-5">
53 + <input id="passwdcheck" name="passwdcheck" type="password" placeholder="비밀번호를 입력하세요." class="form-control input-md" required="">
54 + </div>
55 + </div>
56 +
57 +<div class="form-group">
58 +<label class="col-md-4 control-label" for="submit"></label>
59 + <div class="col-md-4">
60 + <label class="checkbox-inline" for="submit">
61 + <input class="btn btn-success" type="submit" name="submit" id="submit" value="새로운 계정 생성하기">
62 + </label>
63 + </div>
64 +</div>
65 +
66 +</fieldset>
67 +</form>
68 +
69 +<script src="/javascripts/signup.js"></script>
70 +</html>
...\ No newline at end of file ...\ No newline at end of file