mirror of
https://github.com/jcreek/what-games-should-I-stream.git
synced 2026-07-12 18:33:46 +00:00
Restructured and converted to async functions.
This commit is contained in:
Josh Creek
+155
-81
@@ -1,104 +1,157 @@
|
||||
const app = document.getElementById('root');
|
||||
|
||||
const container = document.createElement('div');
|
||||
container.setAttribute('class', 'container');
|
||||
var clientID = 'xxxxxx'; // Hide this for github, it's my application's Client ID
|
||||
var topGames = []; // Holds roughly the top thousand games by viewers, although the viewer count per game is unavailable for some reason but this can be calculated by totalling the viewers from all streams for a particular game, if necessary
|
||||
var topStreams = []; // Need to get a lot more of these to get useful data, and compare using the game ids where they match the top games - N.B. will need to remove/ignore any duplicate streams as between pages the data can change as viewers leave and join streams
|
||||
|
||||
app.appendChild(container);
|
||||
|
||||
// !todo - Currently only getting top 100 games (a single page of results), need to get more for more accurate data analysi
|
||||
|
||||
function getTopGames(cursor) {
|
||||
console.log('--> getTopGames');
|
||||
async function getTopGamesAsync(){
|
||||
console.log('--> getTopGamesAsync');
|
||||
// See https://dev.twitch.tv/docs/api/reference/#get-top-games
|
||||
|
||||
var requestUrl = 'https://api.twitch.tv/helix/games/top?first=100';
|
||||
if(cursor.length > 0)
|
||||
{
|
||||
requestUrl += '&after=' + cursor;
|
||||
}
|
||||
var request = new Request(requestUrl, {
|
||||
headers: new Headers({
|
||||
'Client-ID': 'xxxxxxxxxxxxxxxxxxxxxxxxxxxx' // Hide this for github, it's my application's Client ID
|
||||
})
|
||||
});
|
||||
|
||||
// List to hold the top games, to be returned by the function
|
||||
var tempList = [];
|
||||
var tempCursor = '';
|
||||
var requestUrlBase = 'https://api.twitch.tv/helix/games/top?first=100';
|
||||
|
||||
fetch(request)
|
||||
.then(response => {
|
||||
return response.json()
|
||||
})
|
||||
.then(data => {
|
||||
var request1 = new Request(requestUrlBase, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response1 = await fetch(request1);
|
||||
let data1 = await response1.json();
|
||||
// Get the cursor
|
||||
console.log(data.pagination.cursor);
|
||||
tempCursor = data.pagination.cursor;
|
||||
|
||||
let cursor1 = await data1.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data.data.forEach(game => {
|
||||
data1.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
})
|
||||
.catch(err => {
|
||||
// Do something for an error here
|
||||
const errorMessage = document.createElement('marquee')
|
||||
errorMessage.textContent = `Gah, it's not working! Error is ` + err
|
||||
app.appendChild(errorMessage)
|
||||
})
|
||||
var request2 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response2 = await fetch(request2);
|
||||
let data2 = await response2.json();
|
||||
// Get the cursor
|
||||
let cursor2 = await data1.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data2.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
return { 'data': tempList, 'cursor': tempCursor };
|
||||
var request3 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response3 = await fetch(request3);
|
||||
let data3 = await response3.json();
|
||||
// Get the cursor
|
||||
let cursor3 = await data2.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data3.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request4 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response4 = await fetch(request4);
|
||||
let data4 = await response4.json();
|
||||
// Get the cursor
|
||||
let cursor4 = await data3.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data4.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request5 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response5 = await fetch(request5);
|
||||
let data5 = await response5.json();
|
||||
// Get the cursor
|
||||
let cursor5 = await data4.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data5.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request6 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response6 = await fetch(request6);
|
||||
let data6 = await response6.json();
|
||||
// Get the cursor
|
||||
let cursor6 = await data5.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data6.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request7 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response7 = await fetch(request7);
|
||||
let data7 = await response7.json();
|
||||
// Get the cursor
|
||||
let cursor7 = await data6.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data7.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request8 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response8 = await fetch(request8);
|
||||
let data8 = await response8.json();
|
||||
// Get the cursor
|
||||
let cursor8 = await data7.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data8.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request9 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response9 = await fetch(request9);
|
||||
let data9 = await response9.json();
|
||||
// Get the cursor
|
||||
let cursor9 = await data8.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data9.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
var request10 = new Request(requestUrlBase + '&after=' + cursor1, {headers: new Headers({'Client-ID': clientID})});
|
||||
let response10 = await fetch(request10);
|
||||
let data10 = await response10.json();
|
||||
// Get the cursor
|
||||
let cursor10 = await data9.pagination.cursor;
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data10.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
|
||||
|
||||
return tempList;
|
||||
}
|
||||
|
||||
async function getTopStreamsAsync(){
|
||||
console.log('--> getTopStreamsAsync');
|
||||
// See https://dev.twitch.tv/docs/api/reference/#get-streams
|
||||
|
||||
// List to hold the top streams, to be returned by the function
|
||||
var tempList = [];
|
||||
var requestUrlBase = 'https://api.twitch.tv/helix/streams?first=100';
|
||||
|
||||
// var request1 = new Request(requestUrlBase, {headers: new Headers({'Client-ID': clientID})});
|
||||
// let response1 = await fetch(request1);
|
||||
// let data1 = await response1.json();
|
||||
// // Get the cursor
|
||||
// let cursor1 = await data1.pagination.cursor;
|
||||
// // Get each stream from the returned JSON data and add it to the list
|
||||
// data1.data.forEach(stream => {
|
||||
// tempList.push(stream);
|
||||
// });
|
||||
|
||||
var request,response,data,cursor;
|
||||
|
||||
for (i = 0; i < 10; i++) {
|
||||
request = new Request(requestUrlBase + (cursor != undefined ? '&after=' + cursor : ''), {headers: new Headers({'Client-ID': clientID})});
|
||||
response = await fetch(request);
|
||||
data = await response.json();
|
||||
// Get the cursor
|
||||
cursor = await data.pagination.cursor;
|
||||
// Get each stream from the returned JSON data and add it to the list
|
||||
data.data.forEach(stream => {
|
||||
tempList.push(stream);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
var numberOfResultsToReturn = 1000;
|
||||
var topGames = [];
|
||||
|
||||
// Loop to get the right amount of data back
|
||||
var cursor1 = '';
|
||||
for (i = 0; i < (numberOfResultsToReturn / 100); i++) {
|
||||
console.log('--> loop ' + i);
|
||||
// Get back a list of 100 games and data.pagination.cursor as a string
|
||||
var returnedData = getTopGames(cursor1);
|
||||
console.log(returnedData);
|
||||
// Concatenate that list and save the next cursor
|
||||
topGames = topGames.concat(returnedData.data);
|
||||
cursor1 = returnedData.cursor;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function getTopStreams() {
|
||||
// See https://dev.twitch.tv/docs/api/reference/#get-streams
|
||||
var request = new Request('https://api.twitch.tv/helix/streams?first=100', {
|
||||
headers: new Headers({
|
||||
'Client-ID': 'eawzslliv2kz89gj58ul8tvy6p7fm3' // Hide this for github, it's my application's Client ID
|
||||
})
|
||||
});
|
||||
|
||||
// List to hold the top games, to be returned by the function
|
||||
var tempList = [];
|
||||
|
||||
fetch(request)
|
||||
.then(response => {
|
||||
return response.json()
|
||||
})
|
||||
.then(data => {
|
||||
// Get each game from the returned JSON data and add it to the list
|
||||
data.data.forEach(game => {
|
||||
tempList.push(game);
|
||||
});
|
||||
})
|
||||
.catch(err => {
|
||||
// Do something for an error here
|
||||
const errorMessage = document.createElement('marquee')
|
||||
errorMessage.textContent = `Gah, it's not working! Error is ` + err
|
||||
app.appendChild(errorMessage)
|
||||
})
|
||||
|
||||
return tempList;
|
||||
}
|
||||
|
||||
@@ -106,6 +159,27 @@ function getTopStreams() {
|
||||
|
||||
|
||||
|
||||
|
||||
// Get back a list of the most popular games by number of viewers
|
||||
topGames = getTopGamesAsync();
|
||||
|
||||
topStreams = getTopStreamsAsync();
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// Display logic
|
||||
const container = document.createElement('div');
|
||||
container.setAttribute('class', 'container');
|
||||
|
||||
app.appendChild(container);
|
||||
|
||||
|
||||
|
||||
// finalData.forEach(game => {
|
||||
// const card = document.createElement('div');
|
||||
// card.setAttribute('class', 'card');
|
||||
|
||||
Reference in New Issue
Block a user