From 323adb209be7e11a238ceb39bdd57eae28a2b6de Mon Sep 17 00:00:00 2001 From: Gregorio Date: Sun, 20 Jan 2019 18:31:46 +0100 Subject: [PATCH] aggiornata top bar --- src/TopBar.js | 48 +++++------ src/reccomenders/fvitali.js | 164 +++++++++++++++++++++++++++++++----- 2 files changed, 164 insertions(+), 48 deletions(-) diff --git a/src/TopBar.js b/src/TopBar.js index 6d598fc..227358b 100644 --- a/src/TopBar.js +++ b/src/TopBar.js @@ -9,6 +9,7 @@ import { } from 'react-bootstrap'; //eslint-disable-next-line import { Link, withRouter } from 'react-router-dom'; import './css/TopBar.css'; +import './reccomenders/fvitali' // import PropTypes from "prop-types"; class TopBar extends Component { @@ -42,47 +43,37 @@ class TopBar extends Component {
{ // notazione moderna javascript per indicare function(response){} - // function(response){} == response => {} - console.log(response); - console.info(response.data); +import React from 'react'; +import { Col, ListGroup, Card, CardDeck } from 'react-bootstrap'; // eslint-disable-line no-unused-vars +import axios from 'axios'; // eslint-disable-line no-unused-vars +import { Link } from 'react-router-dom'; // eslint-disable-line no-unused-vars +/*eslint no-console: ["error", { allow: ["warn", "error", "info"] }] */ + +class fvitali extends React.Component { + constructor(props) { + super(props); + this.state = { + error: null, + isLoaded: false, + items: [], + headers: null + }; + this.getThumbnails = this.getThumbnails.bind(this); + } + + componentDidMount() { + axios.get('http://site1825.tw.cs.unibo.it/TW/globpop', { + 'params':{ + 'id':this.props.videoID + } + }).then( + response => { + //this.shuffleArray(response.data); + //this.getThumbnails(response.data); + console.info ('a',response.data); + this.setState({ + isLoaded: true, + items:response.data, + }); + }, + // Note: it's important to handle errors here + // instead of a catch() block so that we don't swallow + // exceptions from actual bugs in components. + error => { + console.error(error); + this.setState({ + isLoaded: true, + error + }); + } + ); + } + + // METODI + getThumbnails(videoItems) { + let idToLookFor = videoItems.map(item => item.videoID); + let finalChunk = (videoItems.length % 50) + 100; + axios + .all([ + // chain 3 parallel get + axios.get('https://www.googleapis.com/youtube/v3/videos', { + params: { + part: 'snippet', + id: idToLookFor.slice(0, 50).toString(), + key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + fields: 'items(id,snippet/thumbnails/medium)' + } + }), + axios.get('https://www.googleapis.com/youtube/v3/videos', { + //chain multiple get into promises + params: { + part: 'snippet', + id: idToLookFor.slice(50, 100).toString(), + key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + fields: 'items(id,snippet/thumbnails/medium)' + } + }), + axios.get('https://www.googleapis.com/youtube/v3/videos', { + //chain multiple get into promises + params: { + part: 'snippet', + id: idToLookFor.slice(100, finalChunk).toString(), + key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig', + fields: 'items(id,snippet/thumbnails/medium)' + } + }) + ]) + .then( + axios.spread((res1, res2, res3) => { + let allres = [].concat( + res1.data.items, + res2.data.items, + res3.data.items + ); + allres.map(resCurrentValue => { + Object.defineProperty( + videoItems.find(videoItem => { + return videoItem.videoID === resCurrentValue.id; + }), + 'thumbnail', + { value: resCurrentValue.snippet.thumbnails.medium.url } + ); + }); + this.setState({ + isLoaded: true, + items: videoItems + }); + }) + ); + } + + shuffleArray(videoarray) { + for (let i = videoarray.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [videoarray[i], videoarray[j]] = [videoarray[j], videoarray[i]]; // eslint-disable-line no-param-reassign + } + // Durstenfeld shuffle. + // https://en.wikipedia.org/wiki/Fisher%E2%80%93Yates_shuffle#The_modern_algorithm + } + + render() { + const { error, isLoaded, items, headers } = this.state; + if (error) { + return ( + + Error: {error.message} -- Cannot get {error.config.url} + + ); + } else if (!isLoaded) { + return ( + + +

Loading...

+ + + ); + } else { + return ( + + {items.reccomender}{items.site}{items.lastWatched} + {items.recommended.map(raccomandato=>(
  • {raccomandato.videoID.toString()}
    • ))} + +     + ); + } + } +} + +export default fvitali; - }, -// Note: it's important to handle errors here -// instead of a catch() block so that we don't swallow -// exceptions from actual bugs in components. - error => { - console.error(error); - } -); -export default fvitali; \ No newline at end of file