From 146e59fbedb0a7fab5720cc47a8c2c6d5fd34073 Mon Sep 17 00:00:00 2001 From: matteo Date: Thu, 14 Feb 2019 15:03:45 +0100 Subject: [PATCH 1/2] cambiata api key --- apikey | 2 +- node-entry.js | 2 +- src/VideoInfo.js | 20 +++--- src/VideoList.js | 18 +++--- src/areainfo/Wikipedia.js | 16 +++-- src/reccomenders/Random.js | 2 +- src/reccomenders/Related.js | 2 +- src/reccomenders/Search.js | 90 ++++++++++++++++++-------- src/reccomenders/fvitali.js | 2 +- src/reccomenders/popGlobaleAssoluta.js | 2 +- 10 files changed, 97 insertions(+), 59 deletions(-) diff --git a/apikey b/apikey index 8b9e5dd..761981b 100644 --- a/apikey +++ b/apikey @@ -1 +1 @@ -AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig \ No newline at end of file +'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' \ No newline at end of file diff --git a/node-entry.js b/node-entry.js index 8e18cbd..ecb6307 100644 --- a/node-entry.js +++ b/node-entry.js @@ -1,5 +1,5 @@ process.env['NODE_ENV'] = 'production'; -process.env.APIKEY = 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig'; +'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' = 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg'; const express = require('express'); const compression = require('compression') const bodyParser = require('body-parser'); diff --git a/src/VideoInfo.js b/src/VideoInfo.js index 64c9b9b..438e8e6 100644 --- a/src/VideoInfo.js +++ b/src/VideoInfo.js @@ -8,8 +8,6 @@ import Card from "react-bootstrap/lib/Card"; import moment from 'moment'; import momentDurationFormat from 'moment-duration-format'; //eslint-disable-line no-unused-vars import './css/VideoInfo.scss'; - - const ytclear = require('@c0b41/ytclear'); class VideoInfo extends React.Component { @@ -79,39 +77,35 @@ class VideoInfo extends React.Component { }), ]).then(axios.spread((responseA1,responseA2)=>{ console.log(responseA1.data, responseA2.data); - })) }), error => { } ); } - - getInfoComments() { return axios.all([ axios.get('https://www.googleapis.com/youtube/v3/videos', { //Richiesta per tutte le info sul video params: { 'part': 'snippet,contentDetails,statistics,topicDetails', 'id': this.state.videoId, - 'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' // process.env.APIKEY in production + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' // 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' in production } }), axios.get('https://www.googleapis.com/youtube/v3/commentThreads', { //Richiesta per ottenere i commenti del video params: { 'part': 'snippet', 'videoId': this.state.videoId, 'order': 'relevance', - 'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' // process.env.APIKEY in production + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' // 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' in production } })]) .then(axios.spread((videosResponse, commentThreadResponse) => { - this.isArtistOrTitle(ytclear(videosResponse.data.items[0].snippet.title).split('-')); + // this.isArtistOrTitle(ytclear(videosResponse.data.items[0].snippet.title).split('-')); this.setState({ VideoDetails: videosResponse.data.items[0], comments: commentThreadResponse.data.items, others: { - artist: null, - title: videosResponse.data.items[0].snippet.title + title2: ytclear(videosResponse.data.items[0].snippet.title).split('-')[1] }, isLoaded: true }); @@ -127,6 +121,11 @@ class VideoInfo extends React.Component { static getDerivedStateFromProps(nextProps, prevState) { if(nextProps.videoId !== prevState.videoId) return { videoId: nextProps.videoId }; + else if(nextProps.location.state) + return { others: { + artist: nextProps.location.state.artist, + title: nextProps.location.state.title + }} return null; } componentDidMount() { @@ -208,6 +207,7 @@ class VideoInfo extends React.Component { diff --git a/src/VideoList.js b/src/VideoList.js index 05e7f7c..c6f50a0 100644 --- a/src/VideoList.js +++ b/src/VideoList.js @@ -47,7 +47,7 @@ class VideoList extends React.Component { params: { part: 'snippet', id: idToLookFor.slice(0, 50).toString(), - key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', // process.env.APIKEY in production + key: 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', // 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' in production fields: 'items(id,snippet/thumbnails/medium)' } }), @@ -56,7 +56,7 @@ class VideoList extends React.Component { params: { part: 'snippet', id: idToLookFor.slice(50, 100).toString(), - key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', // process.env.APIKEY in production + key: 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', // 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' in production fields: 'items(id,snippet/thumbnails/medium)' } }), @@ -65,7 +65,7 @@ class VideoList extends React.Component { params: { part: 'snippet', id: idToLookFor.slice(100, finalChunk).toString(), - key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', // process.env.APIKEY in production + key: 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', // 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' in production fields: 'items(id,snippet/thumbnails/medium)' } }) @@ -126,12 +126,12 @@ class VideoList extends React.Component { {/* {item.artist} - {item.title} {item.videoID} {item.category} */} { - if (this.state.wikidata.claims.P435) { + if (this.state.wikidata.claims.P435) { // p435 == musicbrainzWorkId axios.get(`${musicbrainzBaseUrl}/work/${this.state.wikidata.claims.P435[0].mainsnak.datavalue.value}`, { // get musicbrainz info params: { 'inc': 'artist-rels url-rels', @@ -105,7 +107,7 @@ class Wikipedia extends Component { else { //oof axios.get(`${musicbrainzBaseUrl}/work`, { params: { - 'query': this.state.props.title.trim(), + 'query': 'undefined' === typeof this.state.props.title ? this.state.props.title2 : this.state.props.title, 'limit': 1, 'offset': 0, 'fmt': 'json' @@ -131,7 +133,7 @@ class Wikipedia extends Component { this.getWikidataPage(wikidataEntityRegEx.exec(a.url.resource)) //.then(() => this.setState({ isWikiLoaded: true })); } else { // oof - wikijs().find(this.state.props.title).then(data => console.log('asd', data)) // find by props.title + wikijs().find('undefined' === typeof this.state.props.title? this.state.props.title2.trim(): this.state.props.title.trim()).then(data => console.log('asd', data)) // find by props.title } }) ) @@ -145,13 +147,13 @@ class Wikipedia extends Component { return { props: { videoId: nextProps.videoId, - artist: nextProps.artist, - title: nextProps.title }, isWikiLoaded: false, isWDataLoaded: false, isMBLoaded: false, - isLoaded: false + isLoaded: false, + wikidatakeys: null, + wikipediakeys: null }; return null } diff --git a/src/reccomenders/Random.js b/src/reccomenders/Random.js index 46989cb..6b28da8 100644 --- a/src/reccomenders/Random.js +++ b/src/reccomenders/Random.js @@ -31,7 +31,7 @@ class RecommenderRandom extends Component{ 'type' : 'video', //che contiene tutti i generi di musica 'maxResults': '21', 'pageToken' : pageToken, - 'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' // process.env.APIKEY in production + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' } }).then( response => { diff --git a/src/reccomenders/Related.js b/src/reccomenders/Related.js index 17305cf..890f8d1 100644 --- a/src/reccomenders/Related.js +++ b/src/reccomenders/Related.js @@ -33,7 +33,7 @@ class Related extends Component { 'relatedToVideoId' : this.state.videoId, 'type' : 'video', 'maxResults' : '21', - 'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' // process.env.APIKEY in production + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' } }).then( response => { diff --git a/src/reccomenders/Search.js b/src/reccomenders/Search.js index 0fd41bc..4d5cf64 100644 --- a/src/reccomenders/Search.js +++ b/src/reccomenders/Search.js @@ -1,10 +1,13 @@ import React from 'react'; import axios from 'axios'; +import { Card, Col } from 'react-bootstrap'; class Search extends React.Component { state = { query: '', + isLoaded: false, + error: null, res: null } @@ -16,6 +19,26 @@ class Search extends React.Component { componentDidMount() { console.log('called didmo'); + if (new RegExp("[0-9A-Za-z_-]{10}[048AEIMQUYcgkosw]").test(this.state.query.toString())) + axios.get('https://www.googleapis.com/youtube/v3/videos', { + params: { + 'part': 'id', + 'id': this.state.query, + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', + 'field': 'pageInfo/resultsPerPage' + } + }).then( + res => { + res.data.pageInfo.resultsPerPage ? + this.props.history.push('/video/' + this.state.query) : + this.youtubeSearch() + }, + error => { + console.error(error) + } + ) + else + this.youtubeSearch(); } // shouldComponentUpdate(nextProps, nextState) { @@ -24,26 +47,30 @@ class Search extends React.Component { componentDidUpdate(prevProps, prevState) { console.log('called didup'); - if(new RegExp("[0-9A-Za-z_-]{10}[048AEIMQUYcgkosw]").test(this.state.query.toString())) - axios.get('https://www.googleapis.com/youtube/v3/videos',{ - params: { - 'part':'id', - 'id': this.state.query, - 'key': process.env.APIKEY ? process.env.APIKEY : 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', - 'field': 'pageInfo/resultsPerPage' - } - }).then( - res => { - res.data.pageInfo.resultsPerPage ? - this.props.history.push('/video/' + this.state.query) : - this.youtubeSearch() - }, - error => { - console.error(error) - } - ) - else - this.youtubeSearch(); + if (prevState.query !== this.props.match.params.query) + if (new RegExp("[0-9A-Za-z_-]{10}[048AEIMQUYcgkosw]").test(this.state.query.toString())) + axios.get('https://www.googleapis.com/youtube/v3/videos', { + params: { + 'part': 'id', + 'id': this.state.query, + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', + 'field': 'pageInfo/resultsPerPage' + } + }).then( + res => { + res.data.pageInfo.resultsPerPage ? + this.props.history.push('/video/' + this.state.query) : + this.youtubeSearch() + }, + error => { + console.error(error) + this.setState({ + error + }) + } + ) + else + this.youtubeSearch(); } // componentWillUnmount() { @@ -59,13 +86,14 @@ class Search extends React.Component { 'type': 'video', 'maxResults': 30, 'topicId': '/m/04rlf, /m/02jjt', - 'key': process.env.APIKEY ? process.env.APIKEY : 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' + 'key': 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' } }).then( res => { console.log(res.data); this.setState({ - res: res.data + res: res.data, + isLoaded: true }) }, error => { console.error(error) } @@ -73,11 +101,19 @@ class Search extends React.Component { } render() { - return ( -
- {this.state.query} keyword -
- ); + if (this.state.error) { + return Error: {this.state.error.message}; + } else if (!this.state.isLoaded) { + return Loading...; + } else { + return ( + + {this.state.res.data.items.map(item => ( + + ))} + + ); + } } } diff --git a/src/reccomenders/fvitali.js b/src/reccomenders/fvitali.js index 09fa81e..c8ba67b 100644 --- a/src/reccomenders/fvitali.js +++ b/src/reccomenders/fvitali.js @@ -57,7 +57,7 @@ class fvitali extends React.Component { params: { part: 'snippet', id: idToLookFor.toString(), - key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + key: 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', fields: 'items(id,snippet/thumbnails/medium,snippet/title)' } }) diff --git a/src/reccomenders/popGlobaleAssoluta.js b/src/reccomenders/popGlobaleAssoluta.js index cc9b921..45ac2ef 100644 --- a/src/reccomenders/popGlobaleAssoluta.js +++ b/src/reccomenders/popGlobaleAssoluta.js @@ -48,7 +48,7 @@ class popGlobaleAssoluta extends React.Component { params: { part: 'snippet', id: idToLookFor.toString(), - key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + key: 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg', fields: 'items(id,snippet/thumbnails/medium,snippet/title)' } }) From 18b0dbcc39d6f5e0da6bcf63e252bb67ecbba38f Mon Sep 17 00:00:00 2001 From: matteo Date: Thu, 14 Feb 2019 17:01:45 +0100 Subject: [PATCH 2/2] fixed errors and warnings --- dev.js | 87 ++++++++++++++++++++++++++++++++++++++ node-entry.js | 61 +++++++++++++++----------- src/App.js | 9 ++-- src/VideoInfo.js | 4 +- src/VideoList.js | 46 ++++++++++---------- src/VideoPlayer.js | 4 +- src/areainfo/Suggestion.js | 2 +- src/areainfo/Wikipedia.js | 16 +++---- 8 files changed, 165 insertions(+), 64 deletions(-) create mode 100644 dev.js diff --git a/dev.js b/dev.js new file mode 100644 index 0000000..b607da5 --- /dev/null +++ b/dev.js @@ -0,0 +1,87 @@ +process.env['NODE_ENV'] = 'production'; +const express = require('express'); +const compression = require('compression') +const bodyParser = require('body-parser'); +const low = require('lowdb'); +const lodashId = require('lodash-id'); +const FileAsync = require('lowdb/adapters/FileAsync'); +const app = express(); // app is an instance of express + +app.use(compression()); // enables gzip compression +app.use(bodyParser.urlencoded({ extended: false })) // parse application/x-www-form-urlencoded +app.use(bodyParser.json()) // parse application/json + + +// Create database instance and start server +// const adapter = new FileAsync(__dirname + '/db.json'); +low(new FileAsync(__dirname + '/db.json')) // production + .then(db => { + db._.mixin(lodashId); + // DATABASE ROUTES + + // ============== + + app.post('/test', (req, res) => { + // "reason": { + // "fitali": req.body.reason.toString() === "fvitali" ? 1:0, + // "": req.body.reason.toString() === "" ? 1:0, + // "": req.body.reason.toString() === "" ? 1:0, + // } + // try { + // let test = table.updateById(req.body.id, { }) + // } + // catch(e) { + // } + res.send(req.body); + }); + + // ============== + + // GET /globpop + app.get('/globpop', (req, res) => { + req.query.id ? res.send(req.query.id) : res.status(400).send('Bad Request'); + }); + + // OPTIONS /videotrack + app.options('/videotrack', (req, res) => { + res.set({ + 'Access-Control-Allow-Origin': '*', + 'Access-Control-Allow-Methods': 'POST, GET, OPTIONS', + 'Access-Control-Allow-Headers': 'Content-Type', + 'Access-Control-Max-Age': 600 + }) + res.status(200).end(); + }) + + // GET /videotrack + app.get('/videotrack', (req, res) => { + const videos = db.get('videos'); + req.query.id ? res.send(videos.getById(req.query.id).value()) : res.send(videos.value()) + }); + + // POST /videotrack + app.post('/videotrack', (req, res) => { + const videos = db.get('videos'); + const row = videos.getById(req.body.id); + if (row.value()) { + row + .update('timesWatched', (n) => ++n) + .update('lastWatched', () => new Date().toISOString()) + .write() + .then(output => res.send(output)) + } else { + let newRow = { + "id": req.body.id.toString(), + "timesWatched": 1, + "lastWatched": new Date().toISOString(), + } + videos.push(newRow).last().write().then(output => res.send(output)) + } + }); + + // Set db default values + return db.defaults({ videos: [] }).write(); + }) + .then(() => { + app.listen(8000, () => console.log('listen on 8000')); // bind to port 8000 as required from specs + }); diff --git a/node-entry.js b/node-entry.js index ecb6307..d02724f 100644 --- a/node-entry.js +++ b/node-entry.js @@ -1,5 +1,5 @@ process.env['NODE_ENV'] = 'production'; -'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' = 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg'; +//'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg' = 'AIzaSyBYSHhu7AwZqT1JK3x4G8Yzs7iRqoS_QUg'; const express = require('express'); const compression = require('compression') const bodyParser = require('body-parser'); @@ -13,8 +13,8 @@ app.use(bodyParser.urlencoded({ extended: false })) // parse application/x-www-f app.use(bodyParser.json()) // parse application/json -app.get('/a', (req, res) => { -res.send(process.env); +app.get('/a', (req, res) => { + res.send(process.env); }); @@ -26,14 +26,14 @@ low(new FileAsync(__dirname + '/db.json')) // production db._.mixin(lodashId); // DATABASE ROUTES -// ============== + // ============== - app.post('/test',(req,res)=>{ - // "reason": { - // "fitali": req.body.reason.toString() === "fvitali" ? 1:0, - // "": req.body.reason.toString() === "" ? 1:0, - // "": req.body.reason.toString() === "" ? 1:0, - // } + app.post('/test', (req, res) => { + // "reason": { + // "fitali": req.body.reason.toString() === "fvitali" ? 1:0, + // "": req.body.reason.toString() === "" ? 1:0, + // "": req.body.reason.toString() === "" ? 1:0, + // } // try { // let test = table.updateById(req.body.id, { }) // } @@ -42,39 +42,50 @@ low(new FileAsync(__dirname + '/db.json')) // production res.send(req.body); }); -// ============== + // ============== - // GET /videotrack/:id? + // GET /globpop app.get('/globpop', (req, res) => { - req.query.id ? res.send(req.query.id):res.status(400).send('Bad Request'); + req.query.id ? res.send(req.query.id) : res.status(400).send('Bad Request'); }); - // GET /videotrack/:id? - app.get('/videotrack/:id?', (req, res) => { + // OPTIONS /videotrack + app.options('/videotrack', (req, res) => { + res.set({ + 'Access-Control-Allow-Origin': '*', + 'Access-Control-Allow-Methods': 'POST, GET, OPTIONS', + 'Access-Control-Allow-Headers': 'Content-Type', + 'Access-Control-Max-Age': 600 + }) + res.status(200).end(); + }) + + // GET /videotrack + app.get('/videotrack', (req, res) => { const videos = db.get('videos'); - req.params.id ? res.send(videos.getById(req.params.id).value()) : res.send(videos.value()) + req.query.id ? res.send(videos.getById(req.query.id).value()) : res.send(videos.value()) }); // POST /videotrack app.post('/videotrack', (req, res) => { - const videos = db.get('videos'); - const row = videos.getById(req.body.id); - if(row.value()) { + const videos = db.get('videos'); + const row = videos.getById(req.body.id); + if (row.value()) { row - .update('timesWatched',(n) => ++n) - .update('lastWatched',() => new Date().toISOString()) - .write() - .then(output => res.send(output)) + .update('timesWatched', (n) => ++n) + .update('lastWatched', () => new Date().toISOString()) + .write() + .then(output => res.send(output)) } else { let newRow = { - "id": req.body.id.toString(), + "id": req.body.id.toString(), "timesWatched": 1, "lastWatched": new Date().toISOString(), } videos.push(newRow).last().write().then(output => res.send(output)) } }); - + // Set db default values return db.defaults({ videos: [] }).write(); }) diff --git a/src/App.js b/src/App.js index 021c2d6..3d7aa03 100644 --- a/src/App.js +++ b/src/App.js @@ -61,8 +61,8 @@ static getDerivedStateFromProps(nextProps, prevState) { xs="12" lg={this.state.isInfoToggled ? { span: 5, order: 1 } : { span: 3, order: 1 }} className="p-0 p-sm-0" - style={{ 'overflow': "auto", 'max-height': this.state.playerHeight }} > -
+ style={{ 'overflow': "auto", 'maxHeight': this.state.playerHeight }} > +