ps.js

var game = [
    {
        'Name': 'Dead by Daylight III',
        'Coast': 19.99
    },
    {
        'Name': 'Elden Ring',
        'Coast': 19.99
    },
    {
        'Name': 'Infliction',
        'Coast': 19.99
    },
    {
        'Name': 'Doom Eternal: Deluxe Edition',
        'Coast': 19.99
    },
    {
        'Name': 'Jumanji: The Video Game',
        'Coast': 19.99
    },
    {
        'Name': 'NHL 22',
        'Coast': 19.99
    },
    {
        'Name': 'Rainbow Six Siege',
        'Coast': 19.99
    },
    {
        'Name': 'FIFA 21',
        'Coast': 9.99
    },
    {
        'Name': 'Marvel Avengers',
        'Coast': 9.99
    },
    {
        'Name': 'Gear Club 2 Unlimited: Ultimate Edition',
        'Coast': 19.99
    },
    {
        'Name': 'Sniper Ghost Warrior Contracts 2: Elite Edition',
        'Coast': 19.99
    },
    {
        'Name': 'Hired Gun',
        'Coast': 19.99
    },
    {
        'Name': 'Matrix Awakens',
        'Coast': 0.00
    },
    {
        'Name': 'Active Neurons 3: Wonders of The World',
        'Coast': 19.99
    },
    {
        'Name': 'Twelve Minutes',
        'Coast': 19.99
    },
    {
        'Name': 'Doom Eternal: Year One Pass',
        'Coast': 19.99
    },
    {
        'Name': 'Maid of Sker',
        'Coast': 19.99
    },
    {
        'Name': 'Destiny 2',
        'Coast': 19.99
    },
    {
        'Name': 'Borderlands 3: Super Deluxe Edition',
        'Coast': 19.99
    },
    {
        'Name': 'Greed Fall',
        'Coast': 19.99
    },
    {
        'Name': 'Tennis World Tour 2: Complet Edition',
        'Coast': 19.99
    },
    {
        'Name': 'Knockout City: Season Three Hacked',
        'Coast': 14.99
    },
    {
        'Name': 'Bugsnacks',
        'Coast': 19.99
    },
    {
        'Name': 'Returnal: Digital Deluxe Edition',
        'Coast': 19.99
    },
    {
        'Name': "Hunster's Arena: Legends",
        'Coast': 19.99
    },
    {
        'Name': 'Battlefield 2042',
        'Coast': 19.99
    },
    {
        'Name': 'Guilty Gear: Strive',
        'Coast': 19.99
    },
    {
        'Name': 'Sherlock Holmes: Chapter One',
        'Coast': 19.99
    },
    {
        'Name': 'It Takes Two',
        'Coast': 19.99
    },
    {
        'Name': 'Ratchet & Clak: Сквозь Миры',
        'Coast': 19.99
    },
    {
        'Name': 'Resident Evil VII_L_AGE: Deluxe Edition',
        'Coast': 44.99
    },
    {
        'Name': 'Space Kabaam',
        'Coast': 19.99
    },
    {
        'Name': 'Final Fantasy XIV',
        'Coast': 19.99
    },
    {
        'Name': 'Infliction',
        'Coast': 19.99
    },
    {
        'Name': 'Greed Fall',
        'Coast': 19.99
    },
    {
        'Name': 'Nioh 2',
        'Coast': 19.99
    },
    {
        'Name': 'Tormented Souls',
        'Coast': 19.99
    },
    {
        'Name': "Assassin's Creed Valhalla",
        'Coast': 24.99
    },
    {
        'Name': 'Dirt 5',
        'Coast': 19.99
    },
    {
        'Name': 'Hades',
        'Coast': 19.99
    },
    {
        'Name': 'Diablo II Resurrected',
        'Coast': 19.99
    },
    {
        'Name': 'Grand Theft Auto: The Trilogy The Definitive Edition',
        'Coast': 39.99
    },
    {
        'Name': 'Fortnite',
        'Coast': 0.00
    },
    {
        'Name': 'Kid a Mnesia',
        'Coast': 19.99
    },
    {
        'Name': 'Monster Truck Championship',
        'Coast': 19.99
    },
    {
        'Name': 'Dirt 5',
        'Coast': 19.99
    },
    {
        'Name': 'Riders Republic',
        'Coast': 19.99
    },
    {
        'Name': 'Nioh Collection',
        'Coast': 19.99
    },
    {
        'Name': 'Battlefield 2042 Gold Edition',
        'Coast': 29.99
    },
    {
        'Name': 'The Dark pictures: Anthology',
        'Coast': 19.99
    },
    {
        'Name': 'Mortal Kombat 11',
        'Coast': 19.99
    },
    {
        'Name': 'Uncharted:  Наследие воров. Колекция',
        'Coast': 19.99
    },
    {
        'Name': 'Maquette',
        'Coast': 19.99
    },
    {
        'Name': 'Port Royale 4',
        'Coast': 19.99
    },
    {
        'Name': 'War Thunder',
        'Coast': 0.00
    },
    {
        'Name': 'Subnautica',
        'Coast': 19.99
    },
    {
        'Name': "Death's Door",
        'Coast': 19.99
    },
    {
        'Name': 'Elden Ring: Deluxe Edition',
        'Coast': 19.99
    },
    {
        'Name': "It Takes Two: Friend's Pass",
        'Coast': 19.99
    },
    {
        'Name': 'The Pedestrain',
        'Coast': 19.99
    },
    {
        'Name': 'Battle Operation 2',
        'Coast': 19.99
    },
    {
        'Name': 'Aeterna',
        'Coast': 19.99
    },
    {
        'Name': 'Among Us',
        'Coast': 19.99
    },
    {
        'Name': 'Far Cry 6',
        'Coast': 19.99
    },
    {
        'Name': 'The Persitences Enhanced',
        'Coast': 19.99
    },
    {
        'Name': 'Dark Alliange',
        'Coast': 19.99
    },
    {
        'Name': 'Человек-Паук: Майлз Моралес',
        'Coast': 29.99
    },
    {
        'Name': 'The Medium',
        'Coast': 19.99
    },
    {
        'Name': 'Legends of Taha: Arcadia',
        'Coast': 19.99
    },
    {
        'Name': 'Endless Fables: Shadow Within',
        'Coast': 19.99
    },
    {
        'Name': 'Darq',
        'Coast': 19.99
    },
    {
        'Name': 'Coastline Flight Simulator',
        'Coast': 19.99
    },
    {
        'Name': 'NBA 2K22',
        'Coast': 19.99
    },
    {
        'Name': 'Doom Eternal',
        'Coast': 19.99
    },
    {
        'Name': 'Observer: System Redux',
        'Coast': 19.99
    },
    {
        'Name': 'Heavenly Bodies',
        'Coast': 19.99
    },
    {
        'Name': 'Prey for the Gods',
        'Coast': 19.99
    },
    {
        'Name': 'Bouncy Bullets 2',
        'Coast': 19.99
    },
    {
        'Name': 'Littlenightmares II: Deluxe Edition',
        'Coast': 24.99
    },
    {
        'Name': 'Yakuza: Like a Dragon',
        'Coast': 19.99
    },
    {
        'Name': 'Resident Evil: VII_I_AGE',
        'Coast': 29.99
    },
    {
        'Name': 'Dojoran',
        'Coast': 19.99
    },
    {
        'Name': 'House of Ashes',
        'Coast': 19.99
    },
    {
        'Name': 'First Class: Trouble',
        'Coast': 19.99
    },
    {
        'Name': 'The Elder Scolls V: Skyrim',
        'Coast': 19.99
    },
    {
        'Name': 'Deathloop',
        'Coast': 19.99
    },
    {
        'Name': 'Returnal',
        'Coast': 19.99
    },
    {
        'Name': "Assassin's Creed: Вальгалла Gold Edition",
        'Coast': 34.99
    },
    {
        'Name': 'Dysco Elysium: The Final Cut',
        'Coast': 19.99
    },
    {
        'Name': "Demon's Souls" ,
        'Coast': 39.99
    },
    {
        'Name': 'Crsed: Foad',
        'Coast': 19.99
    },
    {
        'Name': 'Mortal Shell: Enhanced Edition',
        'Coast': 19.99
    },
    {
        'Name': 'The Elder Scrolls: Online Blackwood Collection',
        'Coast': 24.99
    },
    {
        'Name': 'The Elder Scrolls: Online',
        'Coast': 19.99
    },
    {
        'Name': 'Final Fantasy XIV: Online',
        'Coast': 19.99
    },
    {
        'Name': 'GhostRunner',
        'Coast': 19.99
    },
    {
        'Name': 'Tribes of Midgard',
        'Coast': 19.99
    },
    {
        'Name': 'Judgment',
        'Coast': 19.99
    },
    {
        'Name': 'Forspoken',
        'Coast': 19.99
    },
    {
        'Name': 'Rec Room',
        'Coast': 19.99
    }
];

for (var i = 0; i < game.length; i++) {
    makeMainDiv(i);
}

function makeMainDiv(i) {
    var mainDiv = document.createElement('div');
    mainDiv.setAttribute('id', 'tov-'+parseInt(i+1));
    mainDiv.style.width = '21%';
    mainDiv.style.minWidth = '200px';
    mainDiv.style.height = '50%';
    mainDiv.style.margin = 'auto';
    mainDiv.style.marginTop='5%';
    mainDiv.style.marginBottom='5%';
    mainDiv.style.padding = '0% 1% 0% 1%';
    mainDiv.style.display = 'block';
    mainDiv.style.border = '1px solid black';
    container = document.getElementById('container');
    container.append(mainDiv);
    makeImgDiv(i);
    makeNameDiv(i);
    makeBottomGameDiv(i);
}

function makeImgDiv(i) {
    var imgDiv = document.createElement('div');
    imgDiv.setAttribute('id', 'tov-image-'+parseInt(i+1));
    imgDiv.style.marginTop='10%';
    imgDiv.style.width='100%';
    imgDiv.style.height='17em';
    imgDiv.style.backgroundImage='url("img/PS/files/'+parseInt(i+1)+'.png")';
    imgDiv.style.backgroundRepeat='no-repeat';
    imgDiv.style.backgroundPosition='top center';
    imgDiv.style.backgroundSize='contain';
    mainDiv = document.getElementById('tov-'+parseInt(i+1));
    mainDiv.append(imgDiv);
}

function makeNameDiv(i) {
    var nameDiv = document.createElement('div');
    nameDiv.setAttribute('id', 'name-'+parseInt(i+1));
    nameDiv.style.overflow='auto';
    mainDiv = document.getElementById('tov-'+parseInt(i+1));
    nameDiv.style.height='8em';
    mainDiv.append(nameDiv);
    makeNameH1(i);
}

function makeNameH1(i) {
    nameH1=document.createElement('h1');
    nameDiv = document.getElementById('name-'+parseInt(i+1));
    nameH1.innerHTML = game[i].Name;
    nameH1.style.textAlign='center';
    nameDiv.append(nameH1);
}

function makeBottomGameDiv(i){
    var bottomGameDiv = document.createElement('div');
    bottomGameDiv.setAttribute('id', 'bottom-game-'+parseInt(i+1));
    bottomGameDiv.style.display='flex';
    
    mainDiv = document.getElementById('tov-'+parseInt(i+1));
    mainDiv.append(bottomGameDiv);
    makeCoastDiv(i);
    makeBuyDiv(i);
}

function makeCoastDiv(i){
    var coastDiv = document.createElement('div');
    coastDiv.setAttribute('id', 'coast-'+parseInt(i+1));
    coastDiv.style.flex='1';
    bottomGameDiv = document.getElementById('bottom-game-'+parseInt(i+1));
    bottomGameDiv.append(coastDiv);
    makeCoastH2(i);
}

function makeCoastH2(i) {
    coastH2=document.createElement('h2');
    coastDiv = document.getElementById('coast-'+parseInt(i+1));
    coastH2.innerHTML = '$'+game[i].Coast;
    coastH2.style.textAlign='center';
    coastDiv.append(coastH2);
}

function makeBuyDiv(i){
    var buyDiv = document.createElement('div');
    buyDiv.setAttribute('id', 'buy-'+parseInt(i+1));
    buyDiv.style.flex='1';
    buyDiv.style.margin='auto';
    bottomGameDiv = document.getElementById('bottom-game-'+parseInt(i+1));
    bottomGameDiv.append(buyDiv);
    makeA(i);
}

function makeA(i){
    var buyA=document.createElement('a');
    buyA.setAttribute('id', 'a-'+parseInt(i+1));
    buyA.setAttribute('href', '404.html');
    buyDiv = document.getElementById('buy-'+parseInt(i+1));
    buyDiv.append(buyA);
    makeButton(i);
}

function makeButton(i){
    var button = document.createElement('button');
    buyA = document.getElementById('a-'+parseInt(i+1));
    button.innerHTML = 'Купить в 1 клик';
    button.style.coolor='white';
    button.style.backgroundColor='#2b2d94';
    button.addEventListener("mouseover", changeDefOver);
    button.addEventListener("mouseout", changeDefOut);
    function changeDefOver(event){
        button.style.backgroundColor='#3435a0';
    }
    function changeDefOut(event){
        button.style.backgroundColor='#2b2d94';
    }
    button.style.color='white';
    buyA.append(button);
}