mocc a mammt

This commit is contained in:
Gregorio
2019-03-04 14:19:03 +01:00
parent 546396c7cc
commit 4d5e96a0e8
+25 -31
View File
@@ -3,6 +3,7 @@ import { Col, Media, Card } from 'react-bootstrap'; // eslint-disable-line no-un
import axios from 'axios'; // eslint-disable-line no-unused-vars
import { Link } from 'react-router-dom'; // eslint-disable-line no-unused-vars
import moment from "moment";
var _ = require('lodash');
class popGlobaleAssoluta extends React.Component {
state = {
@@ -14,7 +15,7 @@ class popGlobaleAssoluta extends React.Component {
componentDidMount() {
// let listSiti = ['1828', '1829', '1838', '1839', '1846', '1822', '1847', '1831', '1827', '1848', '1824', '1830', '1836', '1850', '1849', '1851', '1861', '1823', '1863', '1834', '1904', '1906', '1901', '1862', '1859', '1841', '1905', '1864', '1840', '1860', '1858', '1835', '1911', '1913', '1826', '1855', '1907', '1912', '1903', '1915', '1854', '1910'];
let listSiti = ['1828', '1838', '1839', '1846', '1831', '1827', '1823', '1863', '1834', '1901'];//, '1859', '1841', '1905', '1864', '1860', '1858', '1913', '1855', '1912', '1915', '1854', '1910'];
let listSiti = ['1828', '1838','1839', '1846', '1831', '1827', '1823', '1863', '1834', '1901'];//, '1859', '1841', '1905', '1864', '1860', '1858', '1913', '1855', '1912', '1915', '1854', '1910'];
Promise.all(
listSiti.map(
el => fetch(`http://site${el}.tw.cs.unibo.it/globpop?id=${this.props.match.params.id}`)
@@ -26,42 +27,35 @@ class popGlobaleAssoluta extends React.Component {
/* do something with res here... */
console.log(res)
let tmp = res.map(x => x.recommended);
// console.log( )
let tmp2 =tmp.filter(el=>el.length > 0).map(el => el.map(el1 => el1.videoID || el1.videoId) )
console.log(tmp2)
//let tmp2 =tmp.filter(el=>el.length > 0).map(el => el.map(el1 => el1.videoID || el1.videoId) )
console.log(...tmp)
this.getThumbnailsNames(tmp);
});
}
// METODI
getThumbnailsNames(reccomended) {
let idToLookFor = reccomended.map(item => item.videoID);
console.log(reccomended)
let tmp2 =reccomended.filter(el=>el.length > 0).map(el => el.map(el1 => el1.videoID || el1.videoId) )
let idToLookFor =[].concat(...tmp2);
idToLookFor.filter(el=>el.videoID !== undefined || el.videoId !== undefined)
axios.get('https://www.googleapis.com/youtube/v3/videos', {
params: {
part: 'snippet',
id: idToLookFor.toString(),
id: _.uniq(idToLookFor).slice(0,50).toString(),
key: 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig',
fields: 'items(id,snippet/thumbnails/medium,snippet/title)'
fields: 'items(id,snippet/thumbnails/high,snippet/title)'
}
})
.then(
res1 => {
res1.data.items.map(resCurrentValue => {
Object.defineProperties(
reccomended.find(videoItem => {
return videoItem.videoID === resCurrentValue.id;
}),
{
'thumbnail':
{ value: resCurrentValue.snippet.thumbnails.medium.url },
'name':
{ value: resCurrentValue.snippet.title }
});
});
this.setState({
isLoaded: true,
items: reccomended
items: res1.data.items,
isLoaded: true,
});
console.log(res1)
})
}
@@ -93,14 +87,14 @@ class popGlobaleAssoluta extends React.Component {
search: "?ref=popGlobaleAssoluta"
}}
>
<Card.Img
src={item.thumbnail}
alt={'Thumbnail of ' + item.name}
<Card.Img
src={item.snippet.thumbnails.high.url}
alt={'Thumbnail of ' + item.snippet.title}
/>
<Card.ImgOverlay>
<Card.Title className="bg-dark d-inline text-white">
{item.name}<br />
{item.lastSelected}<br />
{item.snippet.title}<br />
{item.snippet.channelTitle}<br />
<span>Reccomender: popGlobaleAssoluta</span>
</Card.Title>
</Card.ImgOverlay>
@@ -125,12 +119,12 @@ class popGlobaleAssoluta extends React.Component {
width={240}
height={120}
className="align-self-center mr-3 img-fluid"
src={item.thumbnail}
alt={'Thumbnail of ' + item.name}
src={item.snippet.thumbnails.high.url}
alt={'Thumbnail of ' + item.snippet.title}
/>
<Media.Body>
{item.name}<br />
{item.lastSelected} <br />
<h5>{item.snippet.title}</h5>
<p> {item.snippet.channelTitle}</p>
<p>Reccomender: popGlobaleAssoluta</p>
</Media.Body>
</Link>