[SOLVED] Display BSC Contract Info

The BSC contract function that I am calling returns a bunch of data combined…in hindsight, we probably should’ve just made events for all of them. Is there any way to break them apart and display them on the frontend using Moralis and Web3?

The function is called viewRewardsAndLiqudityInfo
and these are the lines that are returned on BSC Scan:

budsAccumulationFromRewardsFee|uint256 : 357403654000000000
sumOfAllHOLDRBalances|uint256 : 12578631093100000000
theCurrentRewardsCycle|uint256 : 2
lengthOfRewardsCycle|uint256 : 604800
budsAccumulationFromLiquidityFee|uint256 : 205507100800000000
lastTimeDividendsWereReleased|uint256 : 0
dividendsClaimableNow|uint256 : 0
dividendsLeftFromReservedSupplyForHOLDRs|uint256 : 176689800000000000000

Is there a way for me to break them apart and display them by lines on the frontend?

1 Like

can you also paste the link to bsc scan from where you got this result?

Sorry, I forgot to add that in!

let contractAbi = [{"inputs":[],"name":"viewRewardsAndLiquidityInfo","outputs":[{"internalType":"uint256","name":"budsAccumulationFromRewardsFee","type":"uint256"},{"internalType":"uint256","name":"sumOfAllHOLDRBalances","type":"uint256"},{"internalType":"uint256","name":"theCurrentRewardsCycle","type":"uint256"},{"internalType":"uint256","name":"lengthOfRewardsCycle","type":"uint256"},{"internalType":"uint256","name":"budsAccumulationFromLiquidityFee","type":"uint256"},{"internalType":"uint256","name":"lastTimeDividendsWereReleased","type":"uint256"},{"internalType":"uint256","name":"dividendsClaimableNow","type":"uint256"},{"internalType":"uint256","name":"dividendsLeftFromReservedSupplyForHOLDRs","type":"uint256"}],"stateMutability":"view","type":"function"}];
const options = {
  contractAddress: "0x058cdF0fF70f19629D4F50faC03610302e746e58",
  functionName: "viewRewardsAndLiquidityInfo",
  abi: contractAbi,
};
x = await Moralis.executeFunction(options)

=>

budsAccumulationFromLiquidityFee: "205507100800000000"
budsAccumulationFromRewardsFee: "357403654000000000"
dividendsClaimableNow: "0"
dividendsLeftFromReservedSupplyForHOLDRs: "176689800000000000000"
lastTimeDividendsWereReleased: "0"
lengthOfRewardsCycle: "604800"
sumOfAllHOLDRBalances: "12578631093100000000"
theCurrentRewardsCycle: "2"

Ah, so if I just modify the output, I can break down the information bit by bit and have them displayed on the frontend? Dude, you need a tip jar lol

you can access that info directly with x.budsAccumulationFromRewardsFee for example => '357403654000000000'

I tried a few times to paste codes directly into VS Code, but any time I do that, I get an error in the console
For example, I copied your code:

let contractAbi = [{"inputs":[],"name":"viewRewardsAndLiquidityInfo","outputs":[{"internalType":"uint256","name":"budsAccumulationFromRewardsFee","type":"uint256"},{"internalType":"uint256","name":"sumOfAllHOLDRBalances","type":"uint256"},{"internalType":"uint256","name":"theCurrentRewardsCycle","type":"uint256"},{"internalType":"uint256","name":"lengthOfRewardsCycle","type":"uint256"},{"internalType":"uint256","name":"budsAccumulationFromLiquidityFee","type":"uint256"},{"internalType":"uint256","name":"lastTimeDividendsWereReleased","type":"uint256"},{"internalType":"uint256","name":"dividendsClaimableNow","type":"uint256"},{"internalType":"uint256","name":"dividendsLeftFromReservedSupplyForHOLDRs","type":"uint256"}],"stateMutability":"view","type":"function"}];
const options = {
  contractAddress: "0x058cdF0fF70f19629D4F50faC03610302e746e58",
  functionName: "viewRewardsAndLiquidityInfo",
  abi: contractAbi,
};
x = await Moralis.executeFunction(options)

Console error: Uncaught SyntaxError: await is only valid in async functions and the top level bodies of modules.

So then I tried to make it into an async function:

async function totalRewards(){
    let contractAbi = [{"inputs":[],
    "name":"viewRewardsAndLiquidityInfo",
    "outputs":[
        {"internalType":"uint256","name":"budsAccumulationFromRewardsFee","type":"uint256"},
        {"internalType":"uint256","name":"sumOfAllHOLDRBalances","type":"uint256"},
        {"internalType":"uint256","name":"theCurrentRewardsCycle","type":"uint256"},
        {"internalType":"uint256","name":"lengthOfRewardsCycle","type":"uint256"},
        {"internalType":"uint256","name":"budsAccumulationFromLiquidityFee","type":"uint256"},
        {"internalType":"uint256","name":"lastTimeDividendsWereReleased","type":"uint256"},
        {"internalType":"uint256","name":"dividendsClaimableNow","type":"uint256"},
        {"internalType":"uint256","name":"dividendsLeftFromReservedSupplyForHOLDRs","type":"uint256"}
        ],"stateMutability":"view","type":"function"}];
    const options = {
    contractAddress: "0x058cdF0fF70f19629D4F50faC03610302e746e58",
    functionName: "viewRewardsAndLiquidityInfo",
    abi: contractAbi,
    };  
    x = await Moralis.executeFunction(options)
}

And I went to the console, I typed in await Moralis.executeFunction (options)
and I get console error: Uncaught ReferenceError: options is not defined
at :1:31

Sorry if I’m making newbie mistakes lol I’ve been trying to piece together info from this forum and docs to get what I want done.

you have to be on bsc network in metamaks and you also have to use latest Moralis SDK version.

for me it worked fine by pasting that code directly in browser console

I have this line in my html file:
<script src="https://unpkg.com/moralis/dist/moralis.js"></script>

Is that what you mean by latest SDK version? I double checked and made sure to change my Metamask back to BSC network. Earlier when I was testing other Moralis codes, I had changed networks. But once I switched back to BSC, it still shows “options not defined.”

Thanks for your patience in helping me figure this out!

I pasted this code directly into the web console and I get the error:
Uncaught Error: Missing web3 instance, make sure to call Moralis.enable() or Moralis.authenticate()

I tried using const web3 = await Moralis.enable(); at the very top of my main.js file, then I get the error about await must be in async…etc

I think maybe it’s the SDK version you were talking about, but I’m so confused on what I’m supposed to do to be on the latest version?

you have the right Moralis SDK version

you can also add this line: web3 = await Moralis.enable();
I tested in a page that was already doing this.

1 Like

Is there a way that I can set up a page that has the web3 enabled line to cover the whole page? whenever I put the line const web3 = await Moralis.enable(); by itself in the js file, console shows an error of “await must be inside async function”

this works:

<!DOCTYPE html>
<html lang="en">
<body>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/web3.min.js"></script>
    <script src="https://unpkg.com/moralis/dist/moralis.js"></script>
    <script>
async function totalRewards(){
    web3 = await Moralis.enable();
    let contractAbi = [{"inputs":[],
    "name":"viewRewardsAndLiquidityInfo",
    "outputs":[
        {"internalType":"uint256","name":"budsAccumulationFromRewardsFee","type":"uint256"},
        {"internalType":"uint256","name":"sumOfAllHOLDRBalances","type":"uint256"},
        {"internalType":"uint256","name":"theCurrentRewardsCycle","type":"uint256"},
        {"internalType":"uint256","name":"lengthOfRewardsCycle","type":"uint256"},
        {"internalType":"uint256","name":"budsAccumulationFromLiquidityFee","type":"uint256"},
        {"internalType":"uint256","name":"lastTimeDividendsWereReleased","type":"uint256"},
        {"internalType":"uint256","name":"dividendsClaimableNow","type":"uint256"},
        {"internalType":"uint256","name":"dividendsLeftFromReservedSupplyForHOLDRs","type":"uint256"}
        ],"stateMutability":"view","type":"function"}];
    const options = {
    contractAddress: "0x058cdF0fF70f19629D4F50faC03610302e746e58",
    functionName: "viewRewardsAndLiquidityInfo",
    abi: contractAbi,
    };  
    x = await Moralis.executeFunction(options)
    return x;
}             
  x = totalRewards()
  x.then(
        function(value) {console.log(value);},
        function(error) {console.log(error);}
      );
    </script>
</body>
</html>
1 Like

Thanks for your help on that! I managed to get it into the frontend html file as well.
Now I have a new issue lol…

I tried using these codes to test out getting BNB balance as well as all bep20 tokens, and they worked.

async function userBNB(){
// get BSC native balance for a given address
const optionsBNB = { chain: "bsc"};
const balance = await Moralis.Web3API.account.getNativeBalance(optionsBNB);
console.log(balance)
}

async function userBudsBalance(){
    const chainOptions = { chain: 'bsc' }
    const balances = await Moralis.Web3API.account.getTokenBalances(chainOptions);
    console.log(balances);
}

But I saw this snippet in the forum:

And so I attempted to add to my code:

async function userBudsBalance(){
    const chainOptions = { chain: 'bsc', address: "0xa...96eE1" } // used an address that has a bunch of bep20 tokens
    const balances = await Moralis.Web3API.account.getTokenBalances(chainOptions);
    //const tokenAddress =  "0x720b40cd711df11e62dfd0c88797da100d5f09e6"; // 420 Contract Address
    //const tokenAddress =  "0x058cdF0fF70f19629D4F50faC03610302e746e58"; // Buds Contract Address
    //const tokenBalance = balance.find((token) => token.token_address === tokenAddress);
    console.log(balances);
}

I tried it with two different token’s contract addresses, because I don’t currently have Buds in the wallet, but I do have 420 tokens. In both cases, I got a console error that “balance is not defined” and it was pointing to the line const tokenBalance. I also tried replacing token with the token name but it didn’t work. Maybe it’s because 420 Token has a space in the name and I don’t know how to properly format it for javascript to read. Or maybe I’m just completely missing something, like I usually do lol. Any help I can get from you would be amazing! By the way, are you on Github? I am planning on using the dapp I code for my token project to use, I’d like to credit you somehow. Really grateful for all your help.

it looks like you used balance.find instead of balances.find.

So console.log shows the balances fine for BNB & the specific token. I tried them using these codes:

BNB:

async function userBNB(){
// get BSC native balance for a given address
const optionsBNB = { chain: "bsc"};
const balance = await Moralis.Web3API.account.getNativeBalance(optionsBNB);
console.log(balance)
return balance;
}

/* I'm not actually sure if I need this section below, but I just did it
because you previously helped me with another set of codes and they worked. */

const balance = userBNB()

    balance.then(
        function(value) {console.log(value);},
        function(error) {console.log(error);}
    );

Specific Token, in this case 420 Token

async function userBudsBalance(){
    const chainOptions = { chain: 'bsc', address: "0xaF88...96eE1" }
    const balances = await Moralis.Web3API.account.getTokenBalances(chainOptions);
    const tokenAddress =  "0x720b40cd711df11e62dfd0c88797da100d5f09e6"; // 420 Contract Address
    // const tokenAddress =  "0x058cdF0fF70f19629D4F50faC03610302e746e58"; // Buds Contract Address
    const tokenBalance = balances.find((token) => token.token_address === tokenAddress);
    console.log(tokenBalance.balance); // I changed the log so it'd only show the balance
    return tokenBalance.balance;
}

const tokenBalance = userBudsBalance()

    tokenBalance.then(
        function(value) {console.log(value);},
        function(error) {console.log(error);}
      );

Then I tried to get it to show up in the frontend html:

document.getElementById("budsBalance").innerHTML = tokenBalance.balance;

and I got the error undefined. I’ve tried other options like balance, userBNB, userBudsBalance, they came back undefined or just shows the entire function on the frontend.

please help lol and thank you for your patience

maybe this works for you:

const tokenBalance = userBudsBalance()

    tokenBalance.then(
        function(value) {
               console.log(value);
               document.getElementById("budsBalance").innerHTML = value;},
        function(error) {console.log(error);}
      );
1 Like

You sir, are a rock star! Thank you!

funny that none of the video tutorials had this line, I ahd the same error and I tyhink this will fix it (let’s see…)