diff --git a/README b/README deleted file mode 100644 index e69de29..0000000 diff --git a/README.md b/README.md new file mode 100644 index 0000000..789ce9e --- /dev/null +++ b/README.md @@ -0,0 +1,44 @@ +# Valomy (Valorant Overlay) + +**Valomy** is a stream overlay for Valorant, it shows you automatically thanks to the Valorant api your rank and statistics of the account connected on Valorant + +**Steps to set up the overlay on your stream :** + +- You must first download the project + Download Project + +- Once installed you must install the npm install packages (You must have Node installed) + npm install + +- You need to go to the settings.json file to change your region, the available regions are as follows : + + - eu, ap, na, kr, latam, br + all regions available + +- You can start the script with the command npm run serve + npm run serve + +- You can go to the following address to see if you have access to your overlay : http://localhost:3000 + Page of Localhost:3000 + +- Now we will add the overlay to the stream (Streamlabs, OBS, Twitch Studio etc.) + + - You go to your broadcast software + - You add a new source to your scene of type "Browser Source" + - Then you put the url localhost in the url of the "Browser Source" : http://localhost:3000 + - Put the dimensions 1920x1080 + + On your broadcast platform + + Adding a new source to your scene + + Add localhost url + +**Result :** + +Demonstration of the overlay + +**Information :** + +The overlay every 4mins will change the way it is displayed, every 4 mins it will display only the rank. +If the overlay does not find your account it will default to Soracle#Anemy's profile, until it finds your profile. (You have to be connected to the Riot Client at least for it to find you) diff --git a/public/js/checkPlayerData.js b/public/js/checkPlayerData.js index 0d710a4..a727c77 100644 --- a/public/js/checkPlayerData.js +++ b/public/js/checkPlayerData.js @@ -1,6 +1,6 @@ -async function searchPlayerbySubject(subject) { +async function searchPlayerbySubject(subject, region) { let mmr = await fetch( - `https://api.henrikdev.xyz/valorant/v2/by-puuid/mmr/eu/${subject}` + `https://api.henrikdev.xyz/valorant/v2/by-puuid/mmr/${region}/${subject}` ); let mmrJson = mmr.status == 200 ? await mmr.json() : "N.A"; diff --git a/routes/index.js b/routes/index.js index 6e563cb..eadf60f 100644 --- a/routes/index.js +++ b/routes/index.js @@ -219,6 +219,7 @@ router.get("/", async function (req, res, next) { res.render("index", { title: "Valomy", subjectPlayer: subjectPlayer, + regionPlayer: settings.region, }); }); diff --git a/views/index.html b/views/index.html deleted file mode 100644 index 51fcbd5..0000000 --- a/views/index.html +++ /dev/null @@ -1,181 +0,0 @@ - - - - - - - - Overlay - Valomy - - - - - -
-
-
-
-
- Radiant -
-
-
- Radiant -
-
-
-

1.2 KDA

-

175 Wins

-

1910 Elo

-
-
-
-
-
- - - - \ No newline at end of file diff --git a/views/index.pug b/views/index.pug index 3338874..bdf7ad7 100644 --- a/views/index.pug +++ b/views/index.pug @@ -6,6 +6,7 @@ block content let subject = !{JSON.stringify(subjectPlayer)}; let dataPlayer; let infosPlayerData; + let region = !{JSON.stringify(regionPlayer)}; async function updateSubjectPlayer() { try { @@ -21,7 +22,7 @@ block content async function updateDisplay() { try { - let resultDataPlayer = await searchPlayerbySubject(subject.subjectPlayer || subject) + let resultDataPlayer = await searchPlayerbySubject(subject.subjectPlayer || subject, region) dataPlayer = resultDataPlayer.data let nametagPlayer = dataPlayer.name + "#" + dataPlayer.tag @@ -32,14 +33,25 @@ block content // Update Display let last_season = dataPlayer.by_season[Object.keys(dataPlayer.by_season)[Object.keys(dataPlayer.by_season).length - 1]] + + if(dataPlayer.current_data.elo != null) { - document.querySelector('.overlay-background').style.backgroundImage = `url(${infosPlayerData.card.wide})` - document.querySelector('.rank-user').src = dataPlayer.current_data.images.small - document.querySelector('.rank-user').alt = dataPlayer.current_data.currenttierpatched - document.querySelector('.rank-name span').textContent = dataPlayer.current_data.currenttierpatched - document.querySelector('.stats p:nth-of-type(1)').textContent = `${infosPlayerData.account_level} Lvl` - document.querySelector('.stats p:nth-of-type(2)').textContent = `${dataPlayer.current_data.elo} Elo` - document.querySelector('.stats p:nth-of-type(3)').textContent = `${last_season.wins} Wins` + document.querySelector('.overlay-background').style.backgroundImage = `url(${infosPlayerData.card.wide})` + document.querySelector('.rank-user').src = dataPlayer.current_data.images.small + document.querySelector('.rank-user').alt = dataPlayer.current_data.currenttierpatched + document.querySelector('.rank-name span').textContent = dataPlayer.current_data.currenttierpatched + document.querySelector('.stats p:nth-of-type(1)').textContent = `${infosPlayerData.account_level} Lvl` + document.querySelector('.stats p:nth-of-type(2)').textContent = `${dataPlayer.current_data.elo} Elo` + document.querySelector('.stats p:nth-of-type(3)').textContent = `${last_season.wins} Wins` + } else { + document.querySelector('.overlay-background').style.backgroundImage = `` + document.querySelector('.rank-user').src = "https://media.valorant-api.com/competitivetiers/03621f52-342b-cf4e-4f86-9350a49c6d04/0/smallicon.png" + document.querySelector('.rank-user').alt = "UNRANKED" + document.querySelector('.rank-name span').textContent = "UNRANKED" + document.querySelector('.stats p:nth-of-type(1)').textContent = `${infosPlayerData.account_level} Lvl` + document.querySelector('.stats p:nth-of-type(2)').textContent = `N/A Elo` + document.querySelector('.stats p:nth-of-type(3)').textContent = `N/A Wins` + } } catch (error) { console.error(error) }