From 24bc8f5e1eabd5e65042d9a440ca9c99247d0e53 Mon Sep 17 00:00:00 2001 From: Guillaume Dorce Date: Thu, 10 Oct 2024 23:13:21 +0200 Subject: [PATCH] use api status --- public/index.html | 5 +- public/scripts/infos.js | 245 --------------------------------------- public/scripts/script.js | 136 ++++++++++++++++++++++ public/scripts/twitch.js | 11 -- 4 files changed, 138 insertions(+), 259 deletions(-) delete mode 100644 public/scripts/infos.js create mode 100644 public/scripts/script.js delete mode 100644 public/scripts/twitch.js diff --git a/public/index.html b/public/index.html index 93de5ed..94067b3 100644 --- a/public/index.html +++ b/public/index.html @@ -43,10 +43,9 @@ - - + - \ No newline at end of file + diff --git a/public/scripts/infos.js b/public/scripts/infos.js deleted file mode 100644 index 11dee9d..0000000 --- a/public/scripts/infos.js +++ /dev/null @@ -1,245 +0,0 @@ -// Fonction pour obtenir l'access token Twitch -async function getAccessToken() { - const clientId = 'z2tcrq9oeynzf4ijgzhv6br5feoprr'; - const clientSecret = 'ybm8e512lrsylqqkl78ow08nv3jgx9'; - const url = `https://id.twitch.tv/oauth2/token?client_id=${clientId}&client_secret=${clientSecret}&grant_type=client_credentials`; - - const response = await fetch(url, { method: 'POST' }); - const data = await response.json(); - return data.access_token; -} - -// Fonction pour obtenir les informations utilisateur et le statut du stream -async function getUserInfoAndStreamStatus(username, accessToken, clientId) { - const userUrl = `https://api.twitch.tv/helix/users?login=${username}`; - const userResponse = await fetch(userUrl, { - headers: { - 'Authorization': `Bearer ${accessToken}`, - 'Client-ID': clientId, - }, - }); - - if (userResponse.status !== 200) { - console.error('Erreur lors de la récupération des informations utilisateur.'); - return null; - } - - const userData = await userResponse.json(); - if (userData.data.length === 0) { - console.error('Utilisateur non trouvé.'); - return null; - } - - const userId = userData.data[0].id; - const profileImageUrl = userData.data[0].profile_image_url; - const displayName = userData.data[0].display_name; - - const streamUrl = `https://api.twitch.tv/helix/streams?user_id=${userId}`; - const streamResponse = await fetch(streamUrl, { - headers: { - 'Authorization': `Bearer ${accessToken}`, - 'Client-ID': clientId, - }, - }); - - const streamData = await streamResponse.json(); - let streamType = 'offline'; - - if (streamData.data.length > 0) { - streamType = streamData.data[0].type; - } - - return { - profileImageUrl, - displayName, - streamType, - }; -} - -// Lire le fichier streamers.json depuis le localStorage -function readStreamersFile() { - const fileContent = localStorage.getItem('streamers'); - return fileContent ? JSON.parse(fileContent) : { streamers: [] }; -} - -// Sauvegarder dans streamers.json dans le localStorage -function saveStreamersFile(streamersData) { - localStorage.setItem('streamers', JSON.stringify(streamersData, null, 2)); -} - -// Vérifier et ajouter les streamers manquants -async function updateMissingStreamers(usernames) { - let streamersData = readStreamersFile(); - - const currentStreamers = streamersData.streamers.map(streamer => streamer.username); - - const missingUsernames = usernames.filter(username => !currentStreamers.includes(username)); - - if (missingUsernames.length === 0) { - console.log("Tous les streamers sont déjà présents."); - return; - } - - console.log(`Les streamers suivants sont manquants: ${missingUsernames.join(', ')}`); - - const accessToken = await getAccessToken(); - const clientId = 'z2tcrq9oeynzf4ijgzhv6br5feoprr'; - - for (const username of missingUsernames) { - const data = await getUserInfoAndStreamStatus(username, accessToken, clientId); - if (data) { - streamersData.streamers.push({ - username: username, - displayName: data.displayName, - profileImageUrl: data.profileImageUrl, - streamType: data.streamType - }); - } - } - - saveStreamersFile(streamersData); - console.log("Les streamers manquants ont été ajoutés."); -} - -// Fonction pour afficher les streamers -async function displayStreamers(usernames) { - const accessToken = await getAccessToken(); - const clientId = 'z2tcrq9oeynzf4ijgzhv6br5feoprr'; - - const streamersData = readStreamersFile(); - const onlineStreamers = []; - const offlineStreamers = []; - - for (const username of usernames) { - const streamerInfo = streamersData.streamers.find(streamer => streamer.username === username); - - if (streamerInfo && streamerInfo.streamType === 'live') { - onlineStreamers.push(streamerInfo); - } else { - offlineStreamers.push(streamerInfo); - } - } - - // Trier les streamers par nom - onlineStreamers.sort((a, b) => a.displayName.localeCompare(b.displayName)); - offlineStreamers.sort((a, b) => a.displayName.localeCompare(b.displayName)); - - // Mettre à jour le nombre de streamers en ligne et hors ligne - document.getElementById('onlineCount').textContent = onlineStreamers.length; - document.getElementById('offlineCount').textContent = offlineStreamers.length; - - const onlineContainer = document.getElementById('onlineStreamers'); - const offlineContainer = document.getElementById('offlineStreamers'); - - // Réinitialiser les conteneurs - onlineContainer.innerHTML = ''; - offlineContainer.innerHTML = ''; - - if (onlineStreamers.length > 0) { - // Supprimer le texte de chargement - const loaderText = document.getElementById('loadertext'); - if (loaderText) { - loaderText.style.display = 'none'; - } - } else { - // Ajouter le texte de chargement si aucun streamer en ligne - const loaderText = document.getElementById('loadertext'); - if (loaderText) { - loaderText.textContent = "Il n'y a aucun streamer en ligne actuellement"; - loaderText.style.display = 'block'; - } - } - - onlineStreamers.forEach(data => { - const profileLink = `https://twitch.tv/${data.displayName}`; - - const image = document.createElement('img'); - image.src = data.profileImageUrl; - image.alt = data.displayName; - image.className = 'streamer-image'; - - const liveIndicator = document.createElement('div'); - liveIndicator.className = 'live-indicator'; - liveIndicator.style.display = 'block'; - - const name = document.createElement('div'); - name.className = 'streamer-name'; - name.textContent = data.displayName; - - const link = document.createElement('a'); - link.href = profileLink; - link.target = '_blank'; - link.appendChild(image); - link.appendChild(liveIndicator); - - const infoDiv = document.createElement('div'); - infoDiv.className = 'streamer-info'; - infoDiv.appendChild(link); - infoDiv.appendChild(name); - - onlineContainer.appendChild(infoDiv); - }); - - // Réinitialiser et remplir le conteneur des streamers hors ligne - if (offlineStreamers.length === 0) { - // Ajouter le texte de chargement si aucun streamer hors ligne - const loaderText = document.getElementById('loadertext'); - if (loaderText) { - loaderText.textContent = "Il n'y a aucun streamer hors ligne actuellement"; - loaderText.style.display = 'block'; - } - } else { - // Supprimer le texte de chargement - const loaderText = document.getElementById('loadertext'); - if (loaderText) { - loaderText.style.display = 'none'; - } - } - - offlineStreamers.forEach(data => { - const profileLink = `https://twitch.tv/${data.displayName}`; - - const image = document.createElement('img'); - image.src = data.profileImageUrl; - image.alt = data.displayName; - image.className = 'streamer-image'; - image.classList.toggle('offline', data.streamType !== 'live'); - - const liveIndicator = document.createElement('div'); - liveIndicator.className = 'live-indicator'; - liveIndicator.style.display = 'none'; - - const name = document.createElement('div'); - name.className = 'streamer-name'; - name.textContent = data.displayName; - - const link = document.createElement('a'); - link.href = profileLink; - link.target = '_blank'; - link.appendChild(image); - link.appendChild(liveIndicator); - - const infoDiv = document.createElement('div'); - infoDiv.className = 'streamer-info'; - infoDiv.appendChild(link); - infoDiv.appendChild(name); - - offlineContainer.appendChild(infoDiv); - }); - - if (onlineStreamers.length > 0) { - // Supprimer le texte "aucun streamer en ligne" et le texte de chargement - const loaderText = document.getElementById('onlineLoaderText'); - if (loaderText) { - loaderText.style.display = 'none'; - } - } else { - // Ajouter le texte "aucun streamer en ligne" - const loaderText = document.getElementById('onlineLoaderText'); - if (loaderText) { - loaderText.textContent = "Il n'y a aucun streamer en ligne actuellement"; - loaderText.style.display = 'block'; // Assurez-vous que le texte est visible - } - } - -} diff --git a/public/scripts/script.js b/public/scripts/script.js new file mode 100644 index 0000000..584dcd0 --- /dev/null +++ b/public/scripts/script.js @@ -0,0 +1,136 @@ +async function getStreamersStatus() { + const data = await fetch('/api/status'); + const streamers = await data.json(); + const onlineStreamers = streamers.filter(streamer => streamer.status === 'live'); + const offlineStreamers = streamers.filter(streamer => streamer.status === 'offline'); + return { onlineStreamers, offlineStreamers }; +} + +async function displayStreamers() { + const { onlineStreamers: onlineStreamers, offlineStreamers: offlineStreamers } = await getStreamersStatus(); + + // Trier les streamers par nom + onlineStreamers.sort((a, b) => a.name.localeCompare(b.name)); + offlineStreamers.sort((a, b) => a.name.localeCompare(b.name)); + + // Mettre à jour le nombre de streamers en ligne et hors ligne + document.getElementById('onlineCount').textContent = onlineStreamers.length; + document.getElementById('offlineCount').textContent = offlineStreamers.length; + + const onlineContainer = document.getElementById('onlineStreamers'); + const offlineContainer = document.getElementById('offlineStreamers'); + + // Réinitialiser les conteneurs + onlineContainer.innerHTML = ''; + offlineContainer.innerHTML = ''; + + if (onlineStreamers.length > 0) { + // Supprimer le texte de chargement + const loaderText = document.getElementById('loadertext'); + if (loaderText) { + loaderText.style.display = 'none'; + } + } else { + // Ajouter le texte de chargement si aucun streamer en ligne + const loaderText = document.getElementById('loadertext'); + if (loaderText) { + loaderText.textContent = "Il n'y a aucun streamer en ligne actuellement"; + loaderText.style.display = 'block'; + } + } + + onlineStreamers.forEach(data => { + const profileLink = `https://twitch.tv/${data.name}`; + + const image = document.createElement('img'); + image.src = data.profilePicture; + image.alt = data.name; + image.className = 'streamer-image'; + + const liveIndicator = document.createElement('div'); + liveIndicator.className = 'live-indicator'; + liveIndicator.style.display = 'block'; + + const name = document.createElement('div'); + name.className = 'streamer-name'; + name.textContent = data.name; + + const link = document.createElement('a'); + link.href = profileLink; + link.target = '_blank'; + link.appendChild(image); + link.appendChild(liveIndicator); + + const infoDiv = document.createElement('div'); + infoDiv.className = 'streamer-info'; + infoDiv.appendChild(link); + infoDiv.appendChild(name); + + onlineContainer.appendChild(infoDiv); + }); + + // Réinitialiser et remplir le conteneur des streamers hors ligne + if (offlineStreamers.length === 0) { + // Ajouter le texte de chargement si aucun streamer hors ligne + const loaderText = document.getElementById('loadertext'); + if (loaderText) { + loaderText.textContent = "Il n'y a aucun streamer hors ligne actuellement"; + loaderText.style.display = 'block'; + } + } else { + // Supprimer le texte de chargement + const loaderText = document.getElementById('loadertext'); + if (loaderText) { + loaderText.style.display = 'none'; + } + } + + offlineStreamers.forEach(data => { + const profileLink = `https://twitch.tv/${data.name}`; + + const image = document.createElement('img'); + image.src = data.profilePicture; + image.alt = data.name; + image.className = 'streamer-image'; + image.classList.toggle('offline', data.streamType !== 'live'); + + const liveIndicator = document.createElement('div'); + liveIndicator.className = 'live-indicator'; + liveIndicator.style.display = 'none'; + + const name = document.createElement('div'); + name.className = 'streamer-name'; + name.textContent = data.name; + + const link = document.createElement('a'); + link.href = profileLink; + link.target = '_blank'; + link.appendChild(image); + link.appendChild(liveIndicator); + + const infoDiv = document.createElement('div'); + infoDiv.className = 'streamer-info'; + infoDiv.appendChild(link); + infoDiv.appendChild(name); + + offlineContainer.appendChild(infoDiv); + }); + + if (onlineStreamers.length > 0) { + // Supprimer le texte "aucun streamer en ligne" et le texte de chargement + const loaderText = document.getElementById('onlineLoaderText'); + if (loaderText) { + loaderText.style.display = 'none'; + } + } else { + // Ajouter le texte "aucun streamer en ligne" + const loaderText = document.getElementById('onlineLoaderText'); + if (loaderText) { + loaderText.textContent = "Il n'y a aucun streamer en ligne actuellement"; + loaderText.style.display = 'block'; // Assurez-vous que le texte est visible + } + } + +} + +displayStreamers(); diff --git a/public/scripts/twitch.js b/public/scripts/twitch.js deleted file mode 100644 index dc8625a..0000000 --- a/public/scripts/twitch.js +++ /dev/null @@ -1,11 +0,0 @@ -console.log("twitch.js chargé"); - -const usernames = ['rubylium__', 'lukkstv', 'havvenfr', 'olmanntv', 'nina_asmr', 'krw_aka', 'leetgamer54', 'coshiho', 'soramicia', 'entocraft', 'steakfritees_', 'dancyy_', 'tchoupyy_', 'thesollann']; - -(async function() { - // Vérifier et ajouter les streamers manquants dans streamers.json - await updateMissingStreamers(usernames); - - // Une fois que tout est à jour, afficher les streamers - displayStreamers(usernames); -})();