sco/tecnologiabanana
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

package.json fix

Browse Source
This commit is contained in:
Giampiero Galeazzi
2018-12-12 19:34:59 +01:00
parent 8b54f673ee
commit 7fc2732651
3 changed files with 0 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
-4
View File
@@ -3,12 +3,8 @@
"version": "0.1.0",
"private": true,
"dependencies": {
<<<<<<< HEAD
"axios": "latest",
=======
"axios": "^0.18.0",
"body-parser": "^1.18.3",
>>>>>>> 5ff198adc326a86bc0742f4beeb603992ad7ed5c
"bootstrap": "^4.1.3",
"express": "^4.16.4",
"lodash-id": "^0.14.0",
src/GeneralTab.css
-6
View File
@@ -1,6 +0,0 @@
.fade {
opacity: 200;
/* -webkit-transition: opacity .15s linear; */
-o-transition: opacity .15s linear;
/* transition: opacity .15s linear; */
}
src/GeneralTab.js
-139
View File
@@ -1,139 +0,0 @@
import React, { Component } from 'react';
//import './App.css';
import './GeneralTab.css';
import 'bootstrap/dist/css/bootstrap.css';
import {Tab,Tabs,ListGroup,ListGroupItem} from 'react-bootstrap';
import axios from "axios";
import Card from "react-bootstrap/lib/Card";
import Linkify from 'react-linkify';
import VideoPlayer from './VideoPlayer';
class GeneralTab extends Component {
constructor() {
super();
this.state = {
comments: [],
info : []
};
}
componentDidMount(){
//Richiesta per ottenere i commenti del video
axios.get('https://www.googleapis.com/youtube/v3/commentThreads', {
params: {
'part': 'snippet',
'videoId': this.state.videoId, //Da sostituire con variabile
'order': 'relevance',
'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig'
}
}).then(
response => {
this.setState({
comments: response.data.items,
});
},
error => {
console.error(error);
}
)
//Richiesta per ottenere le informazioni sul video(Descrizione,dati tecnici,ecc...)
axios.get('https://www.googleapis.com/youtube/v3/videos', {
params: {
'part' : 'snippet,contentDetails,statistics',
'id' : this.state.videoId, //Da sostituire con variabile
'key': 'AIzaSyA21Odw9UdfiOJnxvA_eDfOW0OxuUfHKig'
}
}).then(
response => {
this.setState({
info : response.data.items,
});
},
error => {
console.error(error);
}
)
}
render() {
return (
<Tabs defaultActiveKey={1} id="tabs" animation={0}>
<Tab eventKey={1} title="Video">
<div>
{this.state.info.map(function(item,index){
return(
<div key={index}>
<h1 style={{margin : '1rem'}}>{item.snippet.title}</h1>
<ListGroup style = {{display : 'inline-block',marginLeft : '2rem',marginTop : '1rem',maxWidth: ' 50rem'}}>
<ListGroupItem><h5>ID Video</h5>{item.id}</ListGroupItem>
<ListGroupItem><h5>Publish Time</h5>{item.snippet.publishedAt.replace(/(\d+)-(\d+)-(\d+)T(\d+):(\d+):(\d+).000Z/,function(match,p1,p2,p3,p4,p5,p6){
return(p3+'/'+p2+'/'+p1+' - '+p4+':'+p5+':'+p6);
})}
</ListGroupItem>
<ListGroupItem><h5>Channel Name</h5>{item.snippet.channelTitle}</ListGroupItem>
<ListGroupItem><h5>Description</h5><Linkify>{item.snippet.description}</Linkify></ListGroupItem>
<ListGroupItem><h5>Tags</h5>{item.snippet.tags.map(function(element,index){
return(
<span key={index} style={{margin : '0.5rem',textDecoration : 'underline'}}>{element}</span>
)
})}</ListGroupItem>
</ListGroup>
</div>
)
}
)}
</div>
</Tab>
<Tab eventKey={2} title="Tecnical Informations" >
<div>
{this.state.info.map(function (item,index) {
return(
<div key={index}>
<h1 style={{margin : '1rem'}}>{item.snippet.title}</h1>
<ListGroup style = {{display : 'inline-block',marginLeft : '2rem',marginTop : '1rem'}}>
<ListGroupItem><h5>Duration</h5>{item.contentDetails.duration.replace(/(PT(\d+)H(\d+)M(\d+)S)|(PT(\d+)M(\d+)S)/,function(match,p1,p2,p3,p4,p5,p6,p7){
if(p1) return(p2+':'+p3+':'+p4);
else return(p6+':'+p7);})}
</ListGroupItem>
<ListGroupItem><h5>Definition</h5>{item.contentDetails.definition}</ListGroupItem>
<ListGroupItem><h5>Dimension</h5>{item.contentDetails.dimension}</ListGroupItem>
<ListGroupItem><h5>Views</h5>{item.statistics.viewCount}</ListGroupItem>
<ListGroupItem><h5>Likes</h5>{item.statistics.likeCount}</ListGroupItem>
<ListGroupItem><h5>Dislikes</h5>{item.statistics.dislikeCount}</ListGroupItem>
</ListGroup>
</div>
)
})}
</div>
</Tab>
<Tab eventKey={3} title="Comment">
<ul>
{this.state.comments.map(function (item,index) {
return(
<div key={index}>
<Card style = {{width: '40rem',fontSize : 'medium',margin : '1em',borderRadius : '1rem'}}>
<Card.Body>
<Card.Title><Card.Img src={item.snippet.topLevelComment.snippet.authorProfileImageUrl} style={{width : '5rem', height : '5rem',padding : '1rem'}} />{item.snippet.topLevelComment.snippet.authorDisplayName}</Card.Title>
<Card.Text>
<Linkify>
{item.snippet.topLevelComment.snippet.textDisplay}
</Linkify>
</Card.Text>
</Card.Body>
</Card>
</div>
)
})}
</ul>
</Tab>
<Tab eventKey={4} title="Wikipedia">
<div>
</div>
</Tab>
</Tabs>
);
}
}
export default GeneralTab;