'use-strict'; var model = { items: [ { name: 'woods', number: 10 },// 0 { name: 'food', number: 10 }, { name: 'water', number: 10 }, { name: 'cloth', number: 30 }, // 3 { name: 'fences', number: 0, set: [['woods', 5]], get: [['defences', 1],['comfort', 2]] }, // 4 { name: 'waterclt', number: 0, set: [['woods', 50],['cloth', 20]], get: [['comfort', 10]], }, // 5 { name: 'torch', number: 0, set: [['woods', 10], []], get: [['defense', 2], ['comfort', 10]] }, // 6 { name: 'trap', number: 0, set: [['woods', 20]], get: [['defense', 5],['comfort', 10]] } ], player: { woods: 10, food: 10, money: 100, defense: 10, comfort: 0, }, ID: ['story'], }; var startView = { init: () => { this.startButton = document.getElementById('start-button'); this.startButton.addEventListener('click', () => storyView.init()); }, }; var storyView = { init: () => { txt = document.getElementById('story'); this.storyButton = document.getElementById('story-button'); this.storyButton.style.display = 'block'; this.storyButton.addEventListener('click', () => homeView.init()); for (stp = 0; stp < 2; stp++) { document.getElementsByClassName('start')[stp].style.display = 'none'; } txt.innerHTML = 'Its been two weeks after \'those\' thing show up and cause my whole live ruined , my whole family .... die one by one ..... and all i can do is just stand beside them helplessly ,seing them been eaten and become one of them ....... \'Run for your live\' this selfish action make me regret leaving them behind without trying to protect them ..... Now i wonder why i didn\'t stay there and die with all of them as i will not suffer this much and strugle to live in a world with those who suppose to lay down in a hard wodden box burried underground ...'; } }; const alertView = { init: () => { this.alertElem = document.getElementById('alert'); this.alertTitleElem = document.getElementById('alert-title'); this.alertTextElem = document.getElementById('alert-text'); this.alertButtonElem = document.getElementById('alert-button'); this.alertButtonElem.addEventListener('click', () => { this.alertElem.style.display = 'none'; }); }, render: (title, text, can, sub = 'Submit') => { this.alertElem.style.display = 'flex'; let box, cancel, submit; this.alertTitleElem.innerHTML = title; this.alertTextElem.innerHTML = text; this.alertButtonElem.innerHTML = sub; } } var homeView = { init: () => { this.forestElem = document.getElementsByClassName('forest'); this.homeElem = document.getElementsByClassName('home'); this.residentElem = document.getElementsByClassName('resident')[0]; this.navbarElem = document.getElementsByClassName('navbar'); this.navbarHomeElem = document.getElementById('navbar-home'); this.navbarForestElem = document.getElementById('navbar-forest'); this.navbarResidentElem = document.getElementById('navbar-resident'); this.fencesElem = document.getElementById('fences'); this.campfireElem = document.getElementById('campfire'); this.trapElem = document.getElementById('trapup'); this.watercollectorElem = document.getElementById('watercollectorbtn'); this.navbarHomeElem.addEventListener('click', () => homeView.render()); this.navbarForestElem.addEventListener('click', () => forestView.init()); this.navbarResidentElem.addEventListener('click', () => residentView.init()); homeView.render(); for (stp = 0; stp < 2; stp++) { document.getElementsByClassName('story')[stp].style.display = 'none'; } document.getElementsByTagName('a')[1].style.display = 'none'; document.getElementsByTagName('a')[2].style.display = 'none'; alertView.render('INTRODUCTION', 'Well here I am in a dark lonely house. What can I do to continue live in this terrible world?!'); watercltup = document.getElementById('watercollectorbtn'); campfire = document.getElementById('campfire'); crafttxt = document.getElementById('craft'); fencesup = document.getElementById('fences'); trapup = document.getElementById('trapup'); woodsnum = document.getElementById('woods'); foodsnum = document.getElementById('foods'); waternum = document.getElementById('water'); verteidigungtext = document.getElementById('verteidigung'); trapnum = document.getElementById('trap'); clothnum = document.getElementById('cloth'); torch = document.getElementById('torch'); watercltnum = document.getElementById('watercollecter'); setInterval(() => { woodsnum.innerHTML = 'Woods : ' + model.items[0].number; woods++; }, 5500); // 5.5 seconds setInterval(function () { foodsnum.innerHTML = 'Foods : ' + --model.food; waternum.innerHTML = 'Water : ' + --model.water; }, 120000); setInterval(() => { model.items.forEach(item => { `${item.name}`.innerHTML = `${item.name}` + item.number; }); }, 1000); // make a food generator with trap setInterval(() => { if (model.trap > 0) { model.food = model.food + (model.trap * 1); foodsnum.innerHTML = 'Foods : ' + model.food; } if (model.waterclt > 0) { model.water = model.water + (model.waterclt * 1); waternum.innerHTML = 'Water : ' + model.water; } }, 20000); // 2 minute // make the trap broke once a while setInterval(() => { var num = Math.floor(Math.random() * 2); if (model.trap > 0 && num > 0) { model.trap--; alertView.render('DESTROYED', 'One of your trap is broken.'); model.comfort -= 10; } }, 40000); // 4 Minutes // Wald freischalten setTimeout(() => { alertView.render( 'FOREST', 'While you`re wandering near your window you found out that there`s a forest near your safe house'); alertView.render('FOREST', 'Hmm... I think I can find many woods there'); document.getElementsByTagName('a')[1].style.display = 'inline'; }, 30000); // 30 Seconds // Resident freischalten setTimeout(() => { alertView.render('RESIDENT', 'While you`re collecting some woods you saw some abandoned house near your safe house. Maybe i can find some food and water there .....oh and some cloth i guess'); document.getElementsByTagName('a')[2].style.display = 'inline'; }, 100000); // 1 Minute }, render: () => { this.forestElem[0].style.display = 'none'; this.homeElem[0].style.display = 'none'; this.residentElem.style.display = 'home'; for (stp = 0; stp < 4; stp++) { this.homeElem[stp].style.display = 'block'; } this.navbarElem[0].style.display = 'flex'; this.fencesElem.addEventListener('click', () => octopus.buildItem(model.items[4])); this.fencesElem.style.display = 'block'; this.campfireElem.addEventListener('click', () => octopus.buildItem(model.items[6])); this.campfireElem.style.display = 'block'; this.trapElem.addEventListener('click', () => octopus.buildItem(model.items[7])); this.trapElem.style.display = 'block'; this.watercollectorElem.addEventListener('click', () => octopus.buildItem(model.items[5])); this.watercollectorElem.style.display = 'block'; } }; const infoView = { init: () => { alertView.render({ title: 'Credits', text: 'I created the project with ValentinHacker and LeonLit \n The images are from Evolve Wallpapers', type: 'info', confirmButtonText: 'CLOSE' }); } }; var signinView = { init: () => { // Andere Szenen aublenden document.getElementsByClassName('forest')[0].style.display = 'none'; document.getElementsByClassName('resident')[0].style.display = 'none'; document.getElementsByClassName('home')[0].style.display = 'none'; for (stp = 0; stp < 3; stp++) { document.getElementsByClassName('signin')[stp].style.display = 'inline-block'; } }, }; var createUser = { init: () => { alertView.render({ title: 'In work', text: 'Sorry this feature isn\'t avaible now please stay turned!', type: 'info', confirmButtonText: 'Okay' }); } }; var forestView = { init: () => { document.getElementsByClassName('home')[0].style.display = 'none'; document.getElementById('forestlist').style.display = 'block'; for (stp = 0; stp < 3; stp++) { document.getElementsByClassName('forest')[stp].style.display = 'block'; } crafttxt = document.getElementById('craft'); crafttxt.style.display = 'none'; for (stp = 0; stp < 2; stp++) { document.getElementsByClassName('home')[stp].style.display = 'none'; } for (stp = 0; stp < document.getElementsByClassName('upgrade').length; stp++) { document.getElementsByClassName('upgrade')[stp].style.display = 'none'; } for (stp = 0; stp < 4; stp++) { document.getElementsByClassName('resident')[stp].style.display = 'none'; } } } var forestsearchView = { init: () => { if (document.getElementsByTagName('progress')[0].value == 0) { var woodstxt = document.getElementById('woods'); var residenttext = document.getElementById('residenttxt'); var collectwoodbtn = document.getElementById('forestsearchbtn'); collectwoodbtn.style.opacity = '0.5'; var collectthing = setInterval(function () { if (document.getElementsByTagName('progress')[0].value <= 100) { document.getElementsByTagName('progress')[0].value++; } if (document.getElementsByTagName('progress')[0].value == 100) { collectwoodbtn.style.opacity = '1'; alertView.render({ title: 'Finished', text: 'You finished searching in the forest', type: 'success', confirmButtonText: 'Okay!' }) if (woodstxt.style.display == 'none' && residenttext.style.display == 'none') { collectwoodbtn.style.display = 'block'; } document.getElementsByTagName('progress')[0].value = 0; clearInterval(collectthing); var ranfood = Math.round(Math.random() * (5 - 1) + 1); var ranwoods = Math.round(Math.random() * (20 - 10) + 10); var ranwater = Math.round(Math.random() * (5 - 1) + 1); var rancloth = Math.round(Math.random() * (6 - 2) + 2); model.food += ranfood; model.water += ranwater; model.woods += ranwoods; model.cloth += rancloth; } }, 500); } } } var residentView = { init: () => { document.getElementsByClassName('home')[0].style.display = 'none'; var searchbtn = document.getElementById('residentsearchbtn'); document.getElementById('residentlist').style.display = 'block'; crafttxt = document.getElementById('craft'); crafttxt.style.display = 'none'; for (stp = 0; stp < 2; stp++) { document.getElementsByClassName('home')[stp].style.display = 'none'; } for (stp = 0; stp < 4; stp++) { document.getElementsByClassName('forest')[stp].style.display = 'none'; } for (stp = 0; stp < 4; stp++) { document.getElementsByClassName('resident')[stp].style.display = 'block'; } } } var searchresidentView = { init: () => { if (document.getElementsByTagName('progress')[1].value == 0) { var woodstxt = document.getElementById('woods'); resourcetxt = document.getElementById('forestlist'); var searchbtn = document.getElementById('residentsearchbtn'); searchbtn.style.opacity = '0.5'; var collectthing = setInterval(() => { if (document.getElementsByTagName('progress')[1].value <= 100) { document.getElementsByTagName('progress')[1].value++; } if (document.getElementsByTagName('progress')[1].value == 100) { searchbtn.style.opacity = '1'; alertView.render('Finished', 'You finish searching the resident near your safe house.'); if (woodstxt.style.visibility == 'hidden' && resourcetxt.style.visibility == 'hidden') { searchbtn.style.display = 'block'; } document.getElementsByTagName('progress')[1].value = 0; clearInterval(collectthing); var ranfood = Math.round(Math.random() * (8 - 3) + 3); var ranwoods = Math.round(Math.random() * (20 - 10) + 10); var ranwater = Math.round(Math.random() * (10 - 5) + 5); var rancloth = Math.round(Math.random() * (15 - 5) + 5); model.food += ranfood; model.water += ranwater; model.woods += ranwoods; model.cloth += rancloth; } }, 500); } } } var octopus = { init: () => { startView.init(); alertView.init(); }, money: () => { alertView.render('FAILED', 'You haven\'t enough requierments') }, buildItem: (item) => { let check = item.set.every(elem => { console.log(model.player[`${elem[0]}`] - elem[1]) return 0 <= (model.player[`${elem[0]}`] - elem[1]); }); if(check){ item.set.forEach(elem => { model.player[`${elem[0]}`] -= elem[1]; }); item.set.forEach(elem => { model.player[`${elem[0]}`] += elem[1]; }); item.number++; } else { console.log('sth went wrong') } }, }; onload = () => octopus.init();

Survival Game v.2.0 [Game]