Merry Go Round Script doubts

[DarkSkies]

Since I was tired that my sad pets won't get happy with 1 or 2 rides, I decided to make a script to attack the problem.

This is my first script in JS so please bare with me lol

Anyway, I've already gotten to make it refresh back and forth according to the Start/Stop buttons, at least in Chrome with Tampermonkey (haven't tested on others yet).

Buuut my ultimate goal is to auto stop when pet is finally happy. Here is where I'm stuck now.

Questions:

1. I tried a fetch to get the mood of the chosen pet which on console get it right, but outside of my function I only get undefined (apparently I'm having problems with returning + async + fetch taking time maybe + I'm a noob trying sorry haha). So any hints about how to get my mood variable outside of my function?

2. Since I couldn't use LocalStorage to save the input.Click() because of object type I had to copy paste twice the block for filling the combobox of pet names (block in sendPet function). Any advice on how to improve this? I hated copypasting.

3. After solving point 1 I'll move onto mood evaluation, so that's missing for now.

Error:

Code here

Please log in to view spoilers.

Thanks for reading. I'm burn out now but I'll continue tomorrow with whatever you can suggest me

[Nyu]

1:

To get the mood you can use this inside the getMood function.

const response = await fetch(`https://www.neopets.com/quickref.phtml`);
const text = await response.text();
const div = document.createElement('div');
div.innerHTML = text;
return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText

Looks like you're returning the promise, not the value, you can try on your browser console to see what this one returns vs what the current one does


2:

One thing you can do is save as string and then convert to your desired type, i do this on my Battledome fighter script actually, the weapons and abilities are saved as a json that i save as a string and parse as json again.
Now, if all you can do is refactor, just put it in another function and call it:

if(document.URL.indexOf("worlds/roo/merrygoround.phtml") != -1) {
        auxFlag = parseInt(localStorage.getItem("isFlag"));


        if (auxFlag == 1){
            hidestart();


            counter = parseInt(localStorage.getItem("Rounds"));
            counter++;
            localStorage.setItem("Rounds", counter);
            auxPet = localStorage.getItem("thePet");
            sendPet(auxPet);
        }
        else{
            // Get list of inputs values (names) whose parent is a list item
            createOptions(petname)// We call the new function


            // add startButton onClick
            startButton.addEventListener("click", () => {
                const selectedPet = petChoice.selectedIndex;
                const chosenPetname = petChoice.options[selectedPet].value;
                localStorage.setItem("thePet", chosenPetname);
                if (selectedPet != 0) {
                    //while(flag == 1){
                    flag = 1;
                    localStorage.setItem("isFlag", flag);
                    counter = 1;
                    localStorage.setItem("Rounds", counter);
                    sendPet(chosenPetname);
                    //}
                }
            });


        }


        // add stopButton onClick
        stopButton.addEventListener("click", () => { stopall() });
    }


(...)



    function sendPet(petname){
        // Get list of inputs values (names) whose parent is a list item
        createOptions(petname) // We call the new function


        // Select radio button
        for (const input of petNameInputs) {
            if (input.value == petname) {
                input.click();
            }
        }


        timeout1 = setTimeout(function () { roundForm[0].submit();},5000);
    }

//This is the new function
    function createOptions(petname) {
        const inputList = document.querySelectorAll("li > input");
        for (const input of inputList) {
            // petname
            const name = input.value;
            // build names list
            if (!petNamesList.includes(name)) {
                const option = document.createElement("option");
                option.value = name;
                option.text = name;
                petChoice.add(option);
                petNameInputs.push(input);
                petNamesList.push(name);
            }
        }
    }

I didnt test this btw, just a general idea

[DarkSkies]

1:

To get the mood you can use this inside the getMood function.

const response = await fetch(`https://www.neopets.com/quickref.phtml`);
const text = await response.text();
const div = document.createElement('div');
div.innerHTML = text;
return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText

Looks like you're returning the promise, not the value, you can try on your browser console to see what this one returns vs what the current one does


2:

One thing you can do is save as string and then convert to your desired type, i do this on my Battledome fighter script actually, the weapons and abilities are saved as a json that i save as a string and parse as json again.
Now, if all you can do is refactor, just put it in another function and call it:

if(document.URL.indexOf("worlds/roo/merrygoround.phtml") != -1) {
        auxFlag = parseInt(localStorage.getItem("isFlag"));


        if (auxFlag == 1){
            hidestart();


            counter = parseInt(localStorage.getItem("Rounds"));
            counter++;
            localStorage.setItem("Rounds", counter);
            auxPet = localStorage.getItem("thePet");
            sendPet(auxPet);
        }
        else{
            // Get list of inputs values (names) whose parent is a list item
            createOptions(petname)// We call the new function


            // add startButton onClick
            startButton.addEventListener("click", () => {
                const selectedPet = petChoice.selectedIndex;
                const chosenPetname = petChoice.options[selectedPet].value;
                localStorage.setItem("thePet", chosenPetname);
                if (selectedPet != 0) {
                    //while(flag == 1){
                    flag = 1;
                    localStorage.setItem("isFlag", flag);
                    counter = 1;
                    localStorage.setItem("Rounds", counter);
                    sendPet(chosenPetname);
                    //}
                }
            });


        }


        // add stopButton onClick
        stopButton.addEventListener("click", () => { stopall() });
    }


(...)



    function sendPet(petname){
        // Get list of inputs values (names) whose parent is a list item
        createOptions(petname) // We call the new function


        // Select radio button
        for (const input of petNameInputs) {
            if (input.value == petname) {
                input.click();
            }
        }


        timeout1 = setTimeout(function () { roundForm[0].submit();},5000);
    }

//This is the new function
    function createOptions(petname) {
        const inputList = document.querySelectorAll("li > input");
        for (const input of inputList) {
            // petname
            const name = input.value;
            // build names list
            if (!petNamesList.includes(name)) {
                const option = document.createElement("option");
                option.value = name;
                option.text = name;
                petChoice.add(option);
                petNameInputs.push(input);
                petNamesList.push(name);
            }
        }
    }

I didnt test this btw, just a general idea

Thanks a lot for the advices Nyu! I'll give it a test tomorrow and let you know my results

[DarkSkies]

Testing a bit more, I'm getting the following problem on the await lines:

@(you need an account to see links) do you know if I need to update or do sth about babel-eslint? I've read a bit about it and found how to edit the custom file on TM though I'm not sure if I should install a package first?

[Nyu]

Testing a bit more, I'm getting the following problem on the await lines:

@(you need an account to see links) do you know if I need to update or do sth about babel-eslint? I've read a bit about it and found how to edit the custom file on TM though I'm not sure if I should install a package first?

Sorry! I forgot about that part.
Just add "async" to the start of the function and that should fix it.
Try this c:

    async function getMood(petname){
        const response = await fetch(`https://www.neopets.com/quickref.phtml`);
        const text = await response.text();
        const div = document.createElement('div');
        div.innerHTML = text;
        return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText
    }

If you want to use await, the function must be async.

[Praise_the_Sun]

Hey folks, wondering if you both landed on a final version of this script? My depressed pet is making me ya know... depressed haha

[Nyu]

Hey folks, wondering if you both landed on a final version of this script? My depressed pet is making me ya know... depressed haha

@(you need an account to see links) is still working on it, I guess she'll post it on the scripts section when it's done c:

[DarkSkies]

Yes I'm on it, I'm just still having problem with the fetch thing not returning any value out of local part

I tried this:

// Nyu's part but still getting Promise outside of function

moodPet = getMood(auxPet);


async function getMood(petname){
        const response = await fetch("https://www.neopets.com/quickref.phtml");
        // Get HTML page as text
        const text = await response.text();
        const div = document.createElement('div');
        div.innerHTML = text;

        // Get mood info
        console.log(div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText);
        return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText
    }

And then this other one:

const parser=new DOMParser;
let t;
.........

moodPet = asyncCall(auxPet);

    // Me trying again but getting undefined outside of function
    function getMood(petname,t){
        fetch("https://www.neopets.com/quickref.phtml").then(response=>response.text()).
        then(response=>parser.parseFromString(response,"text/html")).
        then(response=>{const t=response.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`);
        return t?t.textContent:0});
    }

async function asyncCall(petname) {
        console.log('calling');
        const result = await getMood(petname,t);
        console.log(result);
        console.log(t);
        return result;

[Nyu]

Try again with this

moodPet = await getMood(auxPet);


async function getMood(petname){
        const response = await fetch("https://www.neopets.com/quickref.phtml");
        // Get HTML page as text
        const text = await response.text();
        const div = document.createElement('div');
        div.innerHTML = text;


        // Get mood info
        console.log(div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText);
        return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText
    }

moodPet should save the mood

[DarkSkies]

Try again with this

moodPet = await getMood(auxPet);


async function getMood(petname){
        const response = await fetch("https://www.neopets.com/quickref.phtml");
        // Get HTML page as text
        const text = await response.text();
        const div = document.createElement('div');
        div.innerHTML = text;


        // Get mood info
        console.log(div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText);
        return div.querySelector(`#${petname}_details .pet_stats tr:nth-child(7) td`).innerText
    }

moodPet should save the mood

I'm sorry to keep bothering, the eslint error came back again. Could it be possible that my TM is outdated or sth?



Full code

Please log in to view spoilers.