9 changed files with 261 additions and 0 deletions
@ -0,0 +1,8 @@ |
|||||||
|
# Default ignored files |
||||||
|
/shelf/ |
||||||
|
/workspace.xml |
||||||
|
# Datasource local storage ignored files |
||||||
|
/dataSources/ |
||||||
|
/dataSources.local.xml |
||||||
|
# Editor-based HTTP Client requests |
||||||
|
/httpRequests/ |
||||||
@ -0,0 +1,9 @@ |
|||||||
|
<?xml version="1.0" encoding="UTF-8"?> |
||||||
|
<module type="WEB_MODULE" version="4"> |
||||||
|
<component name="NewModuleRootManager"> |
||||||
|
<content url="file://$MODULE_DIR$" /> |
||||||
|
<orderEntry type="inheritedJdk" /> |
||||||
|
<orderEntry type="sourceFolder" forTests="false" /> |
||||||
|
<orderEntry type="library" name="tailwindcss" level="application" /> |
||||||
|
</component> |
||||||
|
</module> |
||||||
@ -0,0 +1,10 @@ |
|||||||
|
<component name="InspectionProjectProfileManager"> |
||||||
|
<profile version="1.0"> |
||||||
|
<option name="myName" value="Project Default" /> |
||||||
|
<inspection_tool class="SpellCheckingInspection" enabled="false" level="TYPO" enabled_by_default="false"> |
||||||
|
<option name="processCode" value="true" /> |
||||||
|
<option name="processLiterals" value="true" /> |
||||||
|
<option name="processComments" value="true" /> |
||||||
|
</inspection_tool> |
||||||
|
</profile> |
||||||
|
</component> |
||||||
@ -0,0 +1,6 @@ |
|||||||
|
<?xml version="1.0" encoding="UTF-8"?> |
||||||
|
<project version="4"> |
||||||
|
<component name="JavaScriptLibraryMappings"> |
||||||
|
<file url="PROJECT" libraries="{tailwindcss}" /> |
||||||
|
</component> |
||||||
|
</project> |
||||||
@ -0,0 +1,8 @@ |
|||||||
|
<?xml version="1.0" encoding="UTF-8"?> |
||||||
|
<project version="4"> |
||||||
|
<component name="ProjectModuleManager"> |
||||||
|
<modules> |
||||||
|
<module fileurl="file://$PROJECT_DIR$/.idea/idle-build-up.iml" filepath="$PROJECT_DIR$/.idea/idle-build-up.iml" /> |
||||||
|
</modules> |
||||||
|
</component> |
||||||
|
</project> |
||||||
@ -0,0 +1,50 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en"> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8"> |
||||||
|
<title>Idle Buildup</title> |
||||||
|
<link rel="stylesheet" href="https://bootswatch.com/4/darkly/bootstrap.min.css"> |
||||||
|
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css"> |
||||||
|
<link rel="stylesheet" href="css/app.css"> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div id="root" class="container mt-2"> |
||||||
|
<div class="row"> |
||||||
|
<div class="col-md-12"> |
||||||
|
<h1 style="font-size: 42pt">{{ this.getAmountFormatted() }}</h1> |
||||||
|
<hr> |
||||||
|
<h3>Buildings owned</h3> |
||||||
|
<ul class="list-group"> |
||||||
|
<li class="list-group-item" v-for="building in buildings" v-if="building.isOwned"> |
||||||
|
<div class="float-right"> |
||||||
|
<a href="javascript:" @click="buyUpgrade(building)"><i class="fas fa-arrow-up text-success"></i> Upgrade for {{ building.price }}</a> |
||||||
|
</div> |
||||||
|
{{ building.name }} (Level {{ building.level }}) earning {{ building.amount.toFixed(2) }} every {{ building.intervalInSeconds.toFixed(2) }} seconds.<br/> |
||||||
|
<div class="progress"> |
||||||
|
<div class="progress-bar progress-bar-striped" role="progressbar" :style="'width: ' + building.loader + '%;'" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"> |
||||||
|
{{ building.loader }} % |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
|
||||||
|
<hr> |
||||||
|
<h3>Buildings to buy</h3> |
||||||
|
<ul class="list-group"> |
||||||
|
<li class="list-group-item" v-for="building in buildings" v-if="!building.isOwned"> |
||||||
|
<div class="float-right"> |
||||||
|
<a href="javascript:" @click="buyBuilding(building)"><i class="fas fa-shopping-basket text-success"></i> Buy for {{ building.price }}</a> |
||||||
|
</div> |
||||||
|
{{ building.name }} could earn {{ building.amount }} every {{ building.intervalInSeconds }} seconds.<br/> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<script src="https://kit.fontawesome.com/b54a4cceff.js" crossorigin="anonymous"></script> |
||||||
|
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> |
||||||
|
<script src="js/MoneyManager.js"></script> |
||||||
|
<script src="js/app.js"></script> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,34 @@ |
|||||||
|
class MoneyManager { |
||||||
|
constructor(startMoney = null) { |
||||||
|
this.money = startMoney ?? this.getSavedMoney(); |
||||||
|
return this.saveMoney(); |
||||||
|
} |
||||||
|
|
||||||
|
saveMoney() { |
||||||
|
localStorage.setItem('money', String(this.money)); |
||||||
|
return this.getSavedMoney(); |
||||||
|
} |
||||||
|
|
||||||
|
getSavedMoney() { |
||||||
|
this.money = Number(localStorage.getItem('money') ?? 0); |
||||||
|
return this.money; |
||||||
|
} |
||||||
|
|
||||||
|
add(amount = 0) { |
||||||
|
this.money += amount; |
||||||
|
return this.saveMoney(); |
||||||
|
} |
||||||
|
|
||||||
|
sub(amount = 0) { |
||||||
|
this.money -= amount; |
||||||
|
return this.saveMoney(); |
||||||
|
} |
||||||
|
|
||||||
|
getAmount() { |
||||||
|
return this.money; |
||||||
|
} |
||||||
|
|
||||||
|
getAmountFormatted() { |
||||||
|
return Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR'}).format(this.money); |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,136 @@ |
|||||||
|
let game = new Vue({ |
||||||
|
el: '#root', |
||||||
|
data: { |
||||||
|
money: 0, |
||||||
|
buildings: [ |
||||||
|
{ |
||||||
|
name: 'TestBuilding', |
||||||
|
intervalInSeconds: 10, |
||||||
|
amount: 1000, |
||||||
|
level: 0, |
||||||
|
price: 100, |
||||||
|
isOwned: false |
||||||
|
} |
||||||
|
], |
||||||
|
loadedIntervals: [] |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.money = this.getSavedMoney(); |
||||||
|
this.saveMoney(); |
||||||
|
|
||||||
|
this.reloadBuildings(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
saveMoney() { |
||||||
|
localStorage.setItem('money', String(this.money)); |
||||||
|
return this.getSavedMoney(); |
||||||
|
}, |
||||||
|
|
||||||
|
getSavedMoney() { |
||||||
|
this.money = Number(localStorage.getItem('money') ?? 0); |
||||||
|
return this.money; |
||||||
|
}, |
||||||
|
|
||||||
|
add(amount = 0) { |
||||||
|
this.money += amount; |
||||||
|
return this.saveMoney(); |
||||||
|
}, |
||||||
|
|
||||||
|
sub(amount = 0) { |
||||||
|
this.money -= amount; |
||||||
|
return this.saveMoney(); |
||||||
|
}, |
||||||
|
|
||||||
|
getAmount() { |
||||||
|
return this.money; |
||||||
|
}, |
||||||
|
|
||||||
|
getAmountFormatted() { |
||||||
|
return Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR'}).format(this.money); |
||||||
|
}, |
||||||
|
|
||||||
|
reloadBuildings() { |
||||||
|
this.killIntervals(); |
||||||
|
|
||||||
|
let game = this; |
||||||
|
this.buildings.forEach((building) => { |
||||||
|
if (building.isOwned) { |
||||||
|
this.loadedIntervals.push( |
||||||
|
setInterval(() => { |
||||||
|
game.add(building.amount); |
||||||
|
}, building.intervalInSeconds * 1000) |
||||||
|
); |
||||||
|
|
||||||
|
this.loadedIntervals.push( |
||||||
|
setInterval(() => { |
||||||
|
if (building.loader < 100) { |
||||||
|
building.loader += 10; |
||||||
|
} else { |
||||||
|
building.loader = 10; |
||||||
|
} |
||||||
|
|
||||||
|
game.$forceUpdate() |
||||||
|
}, building.intervalInSeconds / 10 * 1000) |
||||||
|
) |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
killIntervals() { |
||||||
|
this.buildings.forEach((building) => { |
||||||
|
building.loader = 0; |
||||||
|
}); |
||||||
|
|
||||||
|
this.loadedIntervals.forEach((interval) => { |
||||||
|
clearInterval(interval) |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
buyBuilding(building) { |
||||||
|
if (this.money >= building.price) { |
||||||
|
this.sub(building.price); |
||||||
|
building.isOwned = true; |
||||||
|
|
||||||
|
this.upgradeBuilding(building, true); |
||||||
|
this.saveBuildings(); |
||||||
|
} else { |
||||||
|
alert('Not enough money'); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
buyUpgrade(building) { |
||||||
|
if (this.money >= building.price) { |
||||||
|
this.sub(building.price); |
||||||
|
this.upgradeBuilding(building) |
||||||
|
} else { |
||||||
|
alert('Not enough money'); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
upgradeBuilding(building, first = false) { |
||||||
|
this.killIntervals(); |
||||||
|
|
||||||
|
building.level++; |
||||||
|
building.price *= 1.25; |
||||||
|
|
||||||
|
if (first === false) { |
||||||
|
building.intervalInSeconds *= 0.95; |
||||||
|
} |
||||||
|
|
||||||
|
this.reloadBuildings(); |
||||||
|
this.saveBuildings(); |
||||||
|
}, |
||||||
|
|
||||||
|
saveBuildings() { |
||||||
|
localStorage.setItem('buildings', JSON.stringify(this.buildings)); |
||||||
|
}, |
||||||
|
|
||||||
|
loadBuildings: function () { |
||||||
|
let savedBuildings = JSON.parse(localStorage.getItem('buildings')); |
||||||
|
|
||||||
|
if (savedBuildings.length > 0) { |
||||||
|
this.buildings = savedBuildings; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
}); |
||||||
Loading…
Reference in new issue