Merge pull request #2 from Soraclee/dev

Fix region and add Readme

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
+  <img alt="Download Project" src="https://i.ibb.co/v30PX60/image.png">
+
+- Once installed you must install the <code>npm install</code> packages (You must have Node installed)
+  <img src="https://i.ibb.co/HDYgmhK/image.png" alt="npm install">
+
+- You need to go to the <code>settings.json</code> file to change your region, the available regions are as follows :
+
+  - eu, ap, na, kr, latam, br
+    <img src="https://i.ibb.co/p226tSV/image.png" alt="all regions available">
+
+- You can start the script with the command <code>npm run serve</code>
+  <img src="https://i.ibb.co/cTwTsLX/image.png" alt="npm run serve">
+
+- You can go to the following address to see if you have access to your overlay : http://localhost:3000
+  <img src="https://i.ibb.co/7KgmsQc/image.png" alt="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
+
+    <img alt="On your broadcast platform" src="https://i.ibb.co/JnNjkWY/image.png">
+
+    <img alt="Adding a new source to your scene" src="https://i.ibb.co/L0vft4D/image.png">
+
+    <img alt="Add localhost url " src="https://i.ibb.co/ryXpQ4y/image.png">
+
+**Result :**
+
+<img alt="Demonstration of the overlay" src="https://i.ibb.co/98xLLCx/image.png">
+
+**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)

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";

routes/index.js

@@ -219,6 +219,7 @@ router.get("/", async function (req, res, next) {
   res.render("index", {
     title: "Valomy",
     subjectPlayer: subjectPlayer,
+    regionPlayer: settings.region,
   });
 });
 

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)
             }