const places = [ "forest", "castle", "farm", "island", "school", "prison", "restaurant", "mountain", "Tokyo", "boat", "house", "Chicago", "desert", "mall", "space", ] const characters = [ "knight", "wizard", "detective", "student", "grandmother", "teacher", "chef", "viking", "cat", "monster", "dog", "ninja", "ghost", "pirate", "doctor", ] const objects = [ "wand", "sword", "book", "knife", "feather", "rock", "bag", "glasses", "necklace", "nugget", "phone", "lamp", "cup", "laptop", "headset", ] const columnplaces = document.querySelector('#places') const columncharacters = document.querySelector('#characters') const columnobjects = document.querySelector('#objects') const buttonstartgame = document.querySelector('#startgame') function GenerateNewList(list) { const items = [] for (let i = 0; i < 1000; i++) { items.push(list[Math.floor(Math.random() * list.length)]) } return items } function UpdateColumn(column, list) { const items = GenerateNewList(list) column.innerHTML = items.join('
') } function DoScroll(column, top, divider, currentTop) { const newTop = currentTop + (top/divider) column.scrollTo({ top: newTop, behavior: 'smooth' }) if (newTop < top) { window.setTimeout(function () { DoScroll(column, top, divider, newTop) }, 200) } } function StartGame() { columnplaces.scrollTo(0, 0) columncharacters.scrollTo(0, 0) columnobjects.scrollTo(0, 0) window.setTimeout(function () { UpdateColumn(columnplaces, places) UpdateColumn(columncharacters, characters) UpdateColumn(columnobjects, objects) DoScroll(columnplaces, 10040, 15, 0) DoScroll(columncharacters, 10040, 20, 0) DoScroll(columnobjects, 10040, 25, 0) }, 10) } buttonstartgame.addEventListener('click', StartGame)