53 lines
2.3 KiB
JavaScript
53 lines
2.3 KiB
JavaScript
import React from 'react';
|
|
import logo from './../../logo.svg';
|
|
import './App.css';
|
|
import Container from '@material-ui/core/Container';
|
|
import Typography from '@material-ui/core/Typography';
|
|
import { Button, Paper } from '@material-ui/core';
|
|
|
|
function App() {
|
|
const client_id = "sau3e70wvs369jw1u25ex8g3cve599"
|
|
const redirect_uri = "https://" + encodeURI(window.location.href.split("/")[2]) + "/twitchadmin"
|
|
const twitchURL = "https://id.twitch.tv/oauth2/authorize?client_id="+ client_id +"&redirect_uri="+ redirect_uri +"&response_type=code&scope=user:read:broadcast"
|
|
|
|
return (
|
|
<Container className="App">
|
|
<Paper>
|
|
<img src={logo} className="App-logo" alt="logo" />
|
|
<Typography variant="h4" component="h1" gutterBottom>
|
|
Twitch Sings Tools
|
|
</Typography>
|
|
<Button variant="contained" color="primary" href={twitchURL}>
|
|
Log in with Twitch
|
|
</Button>
|
|
<Typography variant="h5" component="h2" gutterBottom>
|
|
Data about Twitch Sings <b>published</b> performances
|
|
</Typography>
|
|
<Typography component="p" gutterBottom>
|
|
This set of tools uses the standard twitch APIs to create a list of songs you have sung and singers you have sung with. <i>Note</i>: If twitch sings ever changes how they name published performances, this may get harder to do.
|
|
</Typography>
|
|
<Typography variant="h5" component="h2" gutterBottom>
|
|
Some insights
|
|
</Typography>
|
|
<Typography component="p" gutterBottom>
|
|
There's a "top 10 people you sing with" and a "top 10 songs you sing". There's actually not that much insight that can be drawn other than those without getting people involved :-)
|
|
</Typography>
|
|
<Typography variant="h5" component="h2" gutterBottom>
|
|
CSV Export!
|
|
</Typography>
|
|
<Typography component="p" gutterBottom>
|
|
You can bring the data into Excel, Google Sheets, Libre/OpenOffice, Lotus 1-2-3 or whatever, and analyse/graph to your hearts content!
|
|
</Typography>
|
|
<Typography variant="h5" component="h2" gutterBottom>
|
|
Chatbot
|
|
</Typography>
|
|
<Typography component="p" gutterBottom>
|
|
...Coming "Soon"(tm)
|
|
</Typography>
|
|
</Paper>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
export default App;
|