From 0340f45cd7356f1632f9bdc578bb9ef99ea7211a Mon Sep 17 00:00:00 2001 From: matteo Date: Tue, 19 Feb 2019 23:28:59 +0100 Subject: [PATCH] aggiunto similarity artist e poplocaleassoluta --- node-entry.js | 3 + src/Suggestion.js | 4 + src/TopBar.js | 4 +- src/VideoPlayer.js | 4 +- src/Wikipedia.js | 56 +++++++------ src/reccomenders/Search.js | 2 +- src/reccomenders/fvitali.js | 3 +- src/reccomenders/popLocaleAss.js | 114 +++++++++++++++++++++++++++ src/reccomenders/similarityArtist.js | 112 ++++++++++++++++++++++++++ 9 files changed, 274 insertions(+), 28 deletions(-) create mode 100644 src/reccomenders/popLocaleAss.js create mode 100644 src/reccomenders/similarityArtist.js diff --git a/node-entry.js b/node-entry.js index c93c72e..afc04f9 100644 --- a/node-entry.js +++ b/node-entry.js @@ -62,6 +62,9 @@ low(new FileAsync(__dirname + '/db.json')) // production // GET /videotrack app.get('/videotrack', (req, res) => { + res.set({ + 'Access-Control-Allow-Origin': '*' + }); const videos = db.get('videos'); req.query.id ? res.send(videos.getById(req.query.id).value()) : res.send(videos.value()) }); diff --git a/src/Suggestion.js b/src/Suggestion.js index 483309b..a8854af 100644 --- a/src/Suggestion.js +++ b/src/Suggestion.js @@ -7,6 +7,8 @@ import Search from './reccomenders/Search'; import fvitali from './reccomenders/fvitali'; import popGlobaleAssoluta from './reccomenders/popGlobaleAssoluta'; import Recent from './reccomenders/Recent'; +import similarityArtist from './reccomenders/similarityArtist'; +import popLocaleAss from './reccomenders/popLocaleAss'; // and so on.. @@ -40,7 +42,9 @@ class Suggestion extends Component { + + {/* lasciare questo per ultimo */} diff --git a/src/TopBar.js b/src/TopBar.js index e85f4f1..b0d4992 100644 --- a/src/TopBar.js +++ b/src/TopBar.js @@ -42,7 +42,7 @@ class TopBar extends Component { Related { - + Artist @@ -54,7 +54,7 @@ class TopBar extends Component { } { - + Assoluta diff --git a/src/VideoPlayer.js b/src/VideoPlayer.js index 99520f6..f398eca 100644 --- a/src/VideoPlayer.js +++ b/src/VideoPlayer.js @@ -86,9 +86,11 @@ class VideoPlayer extends React.Component { .then( videoIdWatched => { // post request to local db + let reason = new URLSearchParams(this.props.location.search).get("ref"); axios .post('http://site1854.tw.cs.unibo.it/videotrack', { - id: videoIdWatched.toString() + id: videoIdWatched.toString(), + reason: reason || undefined }) .then( response => console.info(response.data), diff --git a/src/Wikipedia.js b/src/Wikipedia.js index b91d055..6a91828 100644 --- a/src/Wikipedia.js +++ b/src/Wikipedia.js @@ -41,6 +41,8 @@ class Wikipedia extends Component { return ( {`${value}`}) case "P2581": return ({`${value}`}) + case "P1827": + return ({`${value}`}) default: return(`${value}`) } @@ -87,18 +89,18 @@ class Wikipedia extends Component { } findWikiPage = () => { - let wikiquery = `${'undefined' === typeof this.props.title ? this.props.title2.trim() : this.props.title.trim()} (${'undefined' === typeof this.props.artist ? this.props.artist2.trim() : this.props.artist.trim()} song)`; - console.info(wikiquery) + let wikiquery = `${'undefined' === typeof this.props.title ? ('undefined' === typeof this.props.title2 ? this.props.artist2 : this.props.title2) : this.props.title.trim()} ${'undefined' === typeof this.props.title && 'undefined' === typeof this.props.title2 ? "" : `(${'undefined' === typeof this.props.artist ? this.props.artist2.trim() : this.props.artist.trim()} song)`}`; return wikijs() .find(wikiquery) .then(res => { - console.info(res, 'a'); - return Promise.all([res.fullInfo(), res.summary()]); + // return Promise.all([res.fullInfo(), res.links(), res.backlinks()]); + return Promise.all([res.fullInfo()]); }) // find by props.title (props.artist song) .then(wikipediaRes => this.setState({ wikipedia: { - "desc": wikipediaRes[1], "info": wikipediaRes[0].general + // ,"links": wikipediaRes[1], + // "backlinks": wikipediaRes[2] }, wikipediakeys: Object.keys(wikipediaRes[0].general), isWikiLoaded: true @@ -107,7 +109,7 @@ class Wikipedia extends Component { componentDidMount() { const musicbrainzBaseUrl = "https://musicbrainz.org/ws/2"; // more readable - // let timerId1; + let timerId1; axios.get(wdk.getReverseClaims('P1651', this.props.videoId)) // P1651 is youtube_video_id property .then(wikidataP1651Res => { if (wikidataP1651Res.data.results.bindings.length) { // got a match @@ -154,7 +156,7 @@ class Wikipedia extends Component { else { //oof axios.get(`${musicbrainzBaseUrl}/work`, { params: { - 'query': 'undefined' === typeof this.props.title ? 'undefined' === typeof this.props.title2 ? this.props.artist2 : this.props.title2 : this.props.title, + 'query': 'undefined' === typeof this.props.title ? ('undefined' === typeof this.props.title2 ? this.props.artist2 : this.props.title2) : this.props.title, 'limit': 1, 'offset': 0, 'fmt': 'json' @@ -180,7 +182,7 @@ class Wikipedia extends Component { else if (musicbrainzWorkRes.data.relations.find(currentRel => currentRel.type === "wikidata")) { // found wikidata on music brainz let wikidataUrl = musicbrainzWorkRes.data.relations.find(currentRel => currentRel.type === "wikidata"); let wikidataEntityRegEx = new RegExp("[^/]+$"); // match last part of url https://regex101.com/r/0wCQHY/1 - this.getWikidataPage(wikidataEntityRegEx.exec(wikidataUrl.url.resource)) //.then(() => this.setState({ isWikiLoaded: true })); + this.getWikidataPage(wikidataEntityRegEx.exec(wikidataUrl.url.resource)) } else { // oof this.findWikiPage() @@ -189,16 +191,27 @@ class Wikipedia extends Component { ) }) } - - }).finally(() => { - // let tmp = JSON.parse(localStorage['currentVideoInfo']); - // tmp.id = this.props.videoId; - // tmp.artist = this.state.wikipedia.info.artist; - // tmp.genre = this.state.wikidataQ[this.state.wikidata.claims["P136"][0].mainsnak.datavalue.value.id].labels.en.value; - // console.info(tmp) - // // localStorage.setItem('currentVideoInfo',JSON.stringify(tmp)); - this.setState({ isLoaded: true }) - }); + return new Promise ((resolve,reject) => { + timerId1 = window.setInterval(()=>{ + if(this.state.wikipedia + && this.state.wikidataQ && this.state.wikidata) + resolve({ + artist: this.state.wikipedia.info.artist.toString(), + genre: this.state.wikidataQ[this.state.wikidata.claims["P136"][0].mainsnak.datavalue.value.id].labels.en.value.toString() + }) + }, 700) + }) + }).then((res) => { + let tmp = JSON.parse(localStorage['currentVideoInfo']); + window.clearInterval(timerId1); + tmp = { + id: this.props.videoId.toString(), + artist: res.artist, + genre: res.genre + } + localStorage.setItem('currentVideoInfo',JSON.stringify(tmp)); + }) + .finally(()=>this.setState({ isLoaded: true })); } @@ -225,8 +238,6 @@ class Wikipedia extends Component { ; } else { return ( - // <> - // {isWikiLoaded && wikipedia.desc} {isWikiLoaded && @@ -244,9 +255,9 @@ class Wikipedia extends Component { ${key[1].labels.en ? key[1].labels.en.value : ""} `}
{ - typeof wikidata.claims[key[0]][0].mainsnak.datavalue.value === "string" ? + typeof wikidata.claims[key[0]][0].mainsnak.datavalue.value === "string" ? // wikidata external this.getExternalLink(key[0],wikidata.claims[key[0]][0].mainsnak.datavalue.value) : - typeof wikidata.claims[key[0]][0].mainsnak.datavalue.value.id === "string" ? + typeof wikidata.claims[key[0]][0].mainsnak.datavalue.value.id === "string" ? // wikidata Q <> {`${this.state.wikidataQ[wikidata.claims[key[0]][0].mainsnak.datavalue.value.id].labels.en ? this.state.wikidataQ[wikidata.claims[key[0]][0].mainsnak.datavalue.value.id].labels.en.value : @@ -277,7 +288,6 @@ class Wikipedia extends Component { }
- // ); } } diff --git a/src/reccomenders/Search.js b/src/reccomenders/Search.js index 65e3c44..6d0a48c 100644 --- a/src/reccomenders/Search.js +++ b/src/reccomenders/Search.js @@ -106,7 +106,7 @@ class Search extends React.Component { return {this.state.error.message} -- {this.state.error.response.data.error.errors[0].reason} ; } else if (!this.state.isLoaded) { return -
+
; } else { return ( diff --git a/src/reccomenders/fvitali.js b/src/reccomenders/fvitali.js index 6063a3c..c80b062 100644 --- a/src/reccomenders/fvitali.js +++ b/src/reccomenders/fvitali.js @@ -117,7 +117,8 @@ class fvitali extends React.Component { key={item.videoID} as="li" className="media mx-5 my-1 suggItem" to={{ - pathname: '/video/' + item.videoID, + pathname: `/video/${item.videoID}`, + search: '?ref=fvitali587' }}> { + this.getThumbnailsNames(res.data.sort((a, b) => a.timesWatched - b.timesWatched).reverse()); + } + ,error=>this.setState({error})) + } + + // shouldComponentUpdate(nextProps, nextState) { + + // } + + // componentDidUpdate(prevProps, prevState) { + // if (prevProps.match.params !== this.props.match.params) { + // this.setState({ isLoaded: false }) + // } + // } + + // componentWillUnmount() { + + // } + + getThumbnailsNames(reccomended) { + let idToLookFor = reccomended.map(item => item.id); + axios.get('https://www.googleapis.com/youtube/v3/videos', { + params: { + part: 'snippet', + id: idToLookFor.toString(), + key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + fields: 'items(id,snippet/thumbnails/medium,snippet/title,snippet/description)' + } + }) + + .then( + res1 => { + res1.data.items.map(resCurrentValue => + Object.defineProperties( + reccomended.find(videoItem => { + return videoItem.id === resCurrentValue.id; + }), + { + 'thumbnail': + { value: resCurrentValue.snippet.thumbnails.medium.url }, + 'name': + {value: resCurrentValue.snippet.title}, + 'description': + {value: resCurrentValue.snippet.description } + }) + ); + this.setState({ + isLoaded: true, + items: reccomended + }); + }) + } + + + render() { + if (this.state.error) { + return {this.state.error.message} -- {this.state.error.response.data.error.errors[0].reason} ; + } else if (!this.state.isLoaded) { + return +
+ ; + } else { + return ( +
    { + this.state.items.map(item => ( + + {'Thumbnail + +
    {item.name}
    +

    {item.description.substring(0,200)}

    +

    Visto: {item.timesWatched} volte
    + Reccomender: popLocaleAss

    +     + + )) + }
+ ); + } + } +} + +export default popLocaleAss; \ No newline at end of file diff --git a/src/reccomenders/similarityArtist.js b/src/reccomenders/similarityArtist.js new file mode 100644 index 0000000..82b5d4b --- /dev/null +++ b/src/reccomenders/similarityArtist.js @@ -0,0 +1,112 @@ +import React from 'react'; +import axios from 'axios'; +import { Link } from 'react-router-dom'; +import { Col, Media } from 'react-bootstrap'; +import { reject } from 'q'; + +class similarityArtist extends React.Component { + + state = { + isLoaded: false, + error: null, + res: null + } + + // static getDerivedStateFromProps(nextProps, prevState) { + + // } + + componentDidMount() { + let timerId1; + let promise = new Promise ((resolve,reject) => { + timerId1 = window.setInterval(()=>{ + if(localStorage['lastId'] === JSON.parse(localStorage['currentVideoInfo']).id) + resolve(true) + },1000) + }) + promise.then(()=>{ + window.clearInterval(timerId1); + this.setState({artist: JSON.parse(localStorage['currentVideoInfo']).artist}) + axios.get('https://www.googleapis.com/youtube/v3/search', { + params: { + 'part': 'snippet', + 'q': JSON.parse(localStorage['currentVideoInfo']).artist, + 'videoEmbeddable': 'true', + 'type': 'video', + 'maxResults': 15, + 'topicId': '/m/04rlf, /m/02jjt', + 'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig' + } + }).then( + res => + this.setState({ + res: res.data, + isLoaded: true + }) + , + error => this.setState({ + error + }) + ) + }) + + } + + // shouldComponentUpdate(nextProps, nextState) { + + // } + + // componentDidUpdate(prevProps, prevState) { + // if (prevProps.match.params !== this.props.match.params) { + // this.setState({ isLoaded: false }) + // } + // } + + // componentWillUnmount() { + + // } + + + + render() { + if (this.state.error) { + return {this.state.error.message} -- {this.state.error.response.data.error.errors[0].reason} ; + } else if (!this.state.isLoaded) { + return +
+ ; + } else { + return ( + <> +

Artist Similarity: {this.state.artist}

+
    { + this.state.res.items.map(item => ( + + {'Thumbnail + +
    {item.snippet.title}
    +

    {item.snippet.description}

    +

    Reccomender: similarityArtist

    +     + + )) + }
+ + ); + } + } +} + +export default similarityArtist; \ No newline at end of file