Tutorials

Fake Ads

HTML

CSS

/* Fake Ads - nirixan.neocities.org */
// Array of ads to randomly choose to replace the closed ad with
const adArray = [
    '/Images/Sky_Piercer_Ad_1.gif',
    '/Images/Discreet_Energy_Ad_1.gif',
    '/Images/Infinity_Express_Ad_1.gif'
]

const adCloseArray = [
    '/Images/Ad_Closed.jpg',
    '/Images/Chrome_Dino_Game.gif'
]

// Ad Close Button
document.addEventListener('DOMContentLoaded', function () {
    var adButtons = document.querySelectorAll('.adButton');

// Randomly assign a starting ad image on load
    const adImages = document.querySelectorAll('.fake-ad');
    adImages.forEach((img) => {
        // Create a new random index for each image
        const randIndex = Math.floor(Math.random() * adArray.length);
        img.src = adArray[randIndex];
    });

adButtons.forEach(function (adBut) {
        adBut.addEventListener('click', function () {
            console.log("Ad Close Button Clicked");

// Triggers if no ad is found
            var adContainer = adBut.closest('.ad-container');
            if (!adContainer) return;
            var adImg = adContainer.querySelector('.fake-ad');
            if (!adImg) return;

// Save original source
            var originalSrc = adImg.src;

// Save current displayed size
            var currentWidth = adImg.clientWidth;
            var currentHeight = adImg.clientHeight;

// Set size for ad closed image so it matches that of the closed ad
            adImg.style.width = currentWidth + 'px';
            adImg.style.height = currentHeight + 'px';

// Hide the button
            adBut.classList.remove('visible');
            adBut.classList.add('hidden');

const closeImg = adCloseArray[Math.floor(Math.random() * adCloseArray.length)];

// Set closed ad image src
            adImg.src = closeImg;

var randomDelay = Math.floor((Math.random() * 7000) + 3000); // Closes the ad for randomly between 0 and 7 sec + at least 3 sec
            console.log("Ad closed for " + randomDelay + " ms");

// Normalizes the ad file's url
            function getFilename(url) {
                return url.substring(url.lastIndexOf('/') + 1);
            }

// Tries to set the closed ad to a randomly chosen different one
            setTimeout(function () {
                let tries = 0; // Initializes tries (try is a reserved word so don't use that)
                const maxTries = 10; // 10 should be enough to ensure randomness but technically can still fail to get a different one
                let chosenAd = originalSrc;
                const originalFilename = getFilename(originalSrc);

while (tries < maxTries) {
                    const randAd = adArray[Math.floor(Math.random() * adArray.length)];
                    const randFilename = getFilename(randAd);

if (randFilename !== originalFilename) {
                        chosenAd = randAd;
                        console.log("Try: " + (tries + 1) + " Ad chosen: " + randAd);
                        break;
                    } else {
                        console.log("Failed Ad Pick. Try: " + (tries + 1));
                        tries++;
                    }
                }

if (chosenAd === originalSrc) {
                    console.log("No different ad found after " + maxTries + " tries. Using original ad.");
                }

/*
                Sets ad size again to make sure newly chosen ad stays the same size as the original for visual consistency
                This can cause stretching or shrinking if the chosen ad is a different size from the original so comment these out if that happens
                */
                //adImg.style.width = currentWidth + 'px';
                //adImg.style.height = currentHeight + 'px';

// Sets ad source to new ad
                adImg.src = chosenAd;

// Show the button again
                adBut.classList.remove('hidden');
                adBut.classList.add('visible');

console.log("Ad restored. Ad: " + adImg.src);
            }, randomDelay);

});
    });
});