Querying multiple datasets

Hi everyone
I hope someone can help me. In my site, I have a counter which will display a running counter of the animals adopted (cats, dogs and total).
I have 2 datasets, Cats and Dogs
I need to return the count of cats and dogs that have the status of “Adopted”.
In the code below, I got it to work but only if I select from one dataset.

I need to query the cats dataset as well and then also get the Total cat and dog values added together.

My trouble is that if I don’t include all the variables inside the query scope, it doesn’t recognise it. So my question is:

How do I query the cats and dogs dataset to get the count of adopted for each and then also use both results to the total value.

I hope this makes sense.
Any help would be amazing!


import wixData from 'wix-data';

export function text32_viewportEnter(event) {
 //this is so that the counter only starts when the right box comes into view 
 
//In the query below I have included everything under the query to ensure the variables are recognised. But this is only from the one dataset. Need to do the same for cats
 
wixData.query("Listings") 
  .eq("status", "Adopted")
  .count()
  .then( (results) => {
 let Dogx = results; // Dogx is the count of total dogs adopted in the dog listing collection
 
let CatstartNum = 1;
let CatendNum = 5;
let DogstartNum = 1;
let DogendNum = 6+Dogx;// adding Dogx count to the historic num of dogs adopted
let TotstartNum = 1;
let TotendNum = DogendNum + CatendNum;
const duration =  50; // 1000 milliseconds 

$w.onReady(function () {
    setInterval(()=> {
        countUp();  
    }, duration);
});

function countUp(){ 
 if (CatstartNum <= CatendNum ){   
        $w('#text67').text =  CatstartNum.toLocaleString().toString();
        CatstartNum++;
    }
if (DogstartNum <= DogendNum){   
       $w('#text69').text =  DogstartNum.toLocaleString().toString();
       DogstartNum++;
    }

if (TotstartNum <= TotendNum ){   
       $w('#text75').text =  TotstartNum.toLocaleString().toString();
       TotstartNum++;
    }
}
})
}

Okay, so I have been playing like crazy! And I have figured out a solution. BUT I would love to hear what others think and if they have a better way of doing my convoluted coding better :grin:

import wixData from 'wix-data';


export function text32_viewportEnter(event) {
 //this is so that the counter only starts when the right box comes into view 
 
//In the query below I have included everything under the query to ensure the variables are recognised. And I used the async in the results of the first query and then the await for the second query.

wixData.query("CatListings")
  .eq("status", "Adopted")
  .count()
  .then(async (results) => {
 let x = results; // total adopted Cats

await wixData.query("Listings")
  .eq("status", "Adopted")
  .count()
  .then( (result) => {
 let y = result;  // total adopted Dogs

// the initial Dog and Cat end numbers are historic figures
let CatstartNum = 1;
let CatendNum = 5+x;
let DogstartNum = 1;
let DogendNum = 6+y;
let TotstartNum = 1;
let TotendNum = DogendNum + CatendNum;
const duration =  50; // 1000 milliseconds 


$w.onReady(function () {
    setInterval(()=> {
        countUp();  
    }, duration);
});

function countUp(){ 
 if (CatstartNum <= CatendNum ){   
        $w('#text67').text =  CatstartNum.toLocaleString().toString();
        CatstartNum++;
    }
if (DogstartNum <= DogendNum){   
       $w('#text69').text =  DogstartNum.toLocaleString().toString();
       DogstartNum++;
    }

if (TotstartNum <= TotendNum ){   
       $w('#text75').text =  TotstartNum.toLocaleString().toString();
       TotstartNum++;
    }
}
  })
  })
}