ye.js

var catalog = {}

fetch('https://cartoonbloxcatalog.vercel.app/catalog.json')
  .then(response => response.json())
  .then(data => {
    catalog = data
    main()
  })
  .catch(error => console.error(error));
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.16.0/firebase-app.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.16.0/firebase-analytics.js";
import { getDatabase, onValue, set, child, get, ref, update } from "https://www.gstatic.com/firebasejs/9.16.0/firebase-database.js";
import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword, onAuthStateChanged, signOut } from "https://www.gstatic.com/firebasejs/9.16.0/firebase-auth.js";

const firebaseConfig = {
    apiKey: "AIzaSyDAHg9cdl6bPzRcxUJQ1ZyAcuVdkLtnNKg",
    authDomain: "cartoon-blox-7b5f2.firebaseapp.com",
    databaseURL: "https://cartoon-blox-7b5f2-default-rtdb.europe-west1.firebasedatabase.app",
    projectId: "cartoon-blox-7b5f2",
    storageBucket: "cartoon-blox-7b5f2.appspot.com",
    messagingSenderId: "917283704157",
    appId: "1:917283704157:web:e8bad4e48594bd243fecb4",
    measurementId: "G-LR6W5LY1F6"
};

const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
const database = getDatabase(app);
const auth = getAuth();

function main() {

const queryString = window.location.search;
const queryStringWithoutQuestionMark = queryString.substring(1);

var theData = ''
var theDataName = ''
var theDataDatabaseName = ''

var userId = '';

setTimeout(function () {
    userId = auth.currentUser.uid

    if (queryStringWithoutQuestionMark == "") {
        theDataName = 'Hair'
        theData = catalog.data[1].hair
        theDataDatabaseName = 'hair'
        finish()
    }

    if (queryStringWithoutQuestionMark == "") { } else {
        if (queryStringWithoutQuestionMark == "faces") {
            theDataName = 'Faces'
            theData = catalog.data[2].faces
            theDataDatabaseName = 'face'
        }
        if (queryStringWithoutQuestionMark == "shirts") {
            theDataName = 'Shirts'
            theData = catalog.data[3].shirts
            theDataDatabaseName = 'shirt'
        }
        if (queryStringWithoutQuestionMark == "pants") {
            theDataName = 'Pants'
            theData = catalog.data[4].pants
            theDataDatabaseName = 'pants'
        }
        if (queryStringWithoutQuestionMark == "hair") {
            theDataName = 'Hair'
            theData = catalog.data[1].hair
            theDataDatabaseName = 'hair'
        }
        if (queryStringWithoutQuestionMark == "accessories") {
            theDataName = 'Hats'
            theData = catalog.data[5].accessories
            theDataDatabaseName = 'hat'
        }
        finish()
    }
}, 2000)

function finish() {
    const display = document.getElementById('editor')
    const dbRef = ref(database);
    get(child(dbRef, `users/${userId}/inventory/${theDataName}/`)).then((snapshot) => {
        if (snapshot.exists()) {
            const data = snapshot.val();
            for (let dataPiece in data) {
                const index = dataPiece; // Store dataPiece in a separate variable
                console.log(index);
                const product = document.createElement('div');
                product.className = 'product';
    
                const img = document.createElement('img');
                img.src = theData[index].image;
                product.appendChild(img);
    
                product.appendChild(document.createElement('br'));
    
                const nameLink = document.createElement('a');
                nameLink.textContent = theData[index].name;
                product.appendChild(nameLink);
    
                display.appendChild(product);
    
                product.addEventListener('click', function() {
                    use(index);
                });
            }
        } else {
            console.log("No data available");
        }
    });    
}

function use(id) {
    update(ref(database, 'users/' + userId),{
        [window.sussy]: id
    }).then((res) => {console.log(res, "OK!")}).catch((err)=>{console.log("ERR!", err)})
}

  window.use = use;
}