<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< title > Idle Gathering< / 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 = "https://cdnjs.cloudflare.com/ajax/libs/izitoast/1.4.0/css/iziToast.min.css" / >
< link rel = "stylesheet" href = "css/app.css" >
< meta content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no" name = "viewport" >
< / head >
< body >
< div id = "root" class = "container mt-2" >
< div class = "row" >
< div class = "col-md-12" >
< div class = "alert alert-warning" >
This game is in an early state of development, resources could be resetted everytime and bugs may appear. Also not every building is balanced yet.
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "card" >
< a class = "card-header" data-toggle = "collapse" href = "#collapseResources" role = "button" aria-expanded = "true" aria-controls = "collapseResources" >
< h3 > Resources< / h3 >
< / a >
< div class = "card-body" id = "collapseResources" >
< div class = "row" >
< div class = "col-md-12" >
< div class = "float-right" > {{ getFormattedNumber(resources.gold) }} < img class = "resource-icon" src = "img/gold.png" > < / div >
Gold
< / div >
< div class = "col-md-12" v-if = "resources.wood > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.wood) }} < img class = "resource-icon" src = "img/wood.png" > < / div >
Wood
< / div >
< div class = "col-md-12" v-if = "resources.planks > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.planks) }} < img class = "resource-icon" src = "img/planks.png" > < / div >
Planks
< / div >
< div class = "col-md-12" v-if = "resources.stone > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.stone) }} < img class = "resource-icon" src = "img/stone.png" > < / div >
Stones
< / div >
< div class = "col-md-12" v-if = "resources.coal > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.coal) }} < img class = "resource-icon" src = "img/coal.png" > < / div >
Coal
< / div >
< div class = "col-md-12" v-if = "resources.iron > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.iron) }} < img class = "resource-icon" src = "img/iron.png" > < / div >
Iron
< / div >
< div class = "col-md-12" v-if = "resources.corn > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.corn) }} < img class = "resource-icon" src = "img/corn.png" > < / div >
Corn
< / div >
< div class = "col-md-12" v-if = "resources.bricks > 0" >
< div class = "float-right" > {{ getFormattedNumber(resources.bricks) }} < img class = "resource-icon" src = "img/bricks.png" > < / div >
Bricks
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "card" >
< a class = "card-header" data-toggle = "collapse" href = "#collapseQuest" role = "button" aria-expanded = "true" aria-controls = "collapseQuest" >
< h3 > Quests< / h3 >
< / a >
< div class = "card-body" id = "collapseQuest" >
< div v-if = "currentQuest" >
Items needed: < br / >
< span v-if = "currentQuest.wood > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.wood, resources.wood)" >
< img title = "wood" class = "resource-icon" src = "img/wood.png" > {{ currentQuest.wood }}
< / span >
< span v-if = "currentQuest.planks > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.planks, resources.planks)" >
< img title = "wood" class = "resource-icon" src = "img/planks.png" > {{ currentQuest.planks }}
< / span >
< span v-if = "currentQuest.stone > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.stone, resources.stone)" >
< img title = "stone" class = "resource-icon" src = "img/stone.png" > {{ currentQuest.stone }}
< / span >
< span v-if = "currentQuest.coal > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.coal, resources.coal)" >
< img title = "coal" class = "resource-icon" src = "img/coal.png" > {{ currentQuest.coal }}
< / span >
< span v-if = "currentQuest.iron > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.iron, resources.iron)" >
< img title = "iron" class = "resource-icon" src = "img/iron.png" > {{ currentQuest.iron }}
< / span >
< span v-if = "currentQuest.bricks > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.bricks, resources.bricks)" >
< img title = "bricks" class = "resource-icon" src = "img/bricks.png" > {{ currentQuest.bricks }}
< / span >
< span v-if = "currentQuest.corn > 0" :style = "'color: ' + getColorForQuestResource(currentQuest.corn, resources.corn)" >
< img title = "corn" class = "resource-icon" src = "img/corn.png" > {{ currentQuest.corn }}
< / span >
< br / >
< br / >
< a href = "javascript:" class = "btn btn-sm btn-success float-right" @ click = "redeemReward()" > Redeem reward ({{ currentQuest.reward }} < img class = "resource-icon" src = "img/gold.png" > )< / a >
< / div >
< div v-else >
< a class = "btn btn-sm btn-info" @ click = "generateQuestWithRandomItems()" > < i class = "fas fa-question" > < / i > Get a new quest< / a >
< / div >
< / div >
< / div >
< / div >
< div class = "col-md-6" >
< div class = "card" >
< a class = "card-header" data-toggle = "collapse" href = "#collapseOwned" role = "button" aria-expanded = "true" aria-controls = "collapseOwned" >
< h3 > Owned buildings< / h3 >
< / a >
< div class = "card-body" id = "collapseOwned" >
< ul class = "list-group" >
< li class = "list-group-item" v-for = "building in buildings" v-if = "building.isOwned" >
< div class = "float-right" v-if = "building.isUpgradeable" >
< a href = "javascript:" @ click = "buyUpgrade(building)" > < i class = "fas fa-arrow-up text-success" > < / i > {{ building.price }} < img class = "resource-icon" src = "img/gold.png" > < / a >
< / div >
< div class = "float-left icon-level-container" >
< img class = "building-icon" :src = "'img/' + building.icon + '.png'" :alt = "building.name + '_icon'" >
< div class = "level-marker" > {{ building.level === 10 ? 'X' : building.level }}< / div >
< / div >
< strong > {{ building.name }}< / strong > < br >
{{ building.amount }} < img class = "resource-icon" :src = "'img/' + building.resource + '.png'" :alt = "building.resource + '_icon'" > every {{ building.intervalInSeconds }}s< br / >
< span v-if = "building.hasRequirements" v-html = "getRequirementsText(building)" > < / span >
< div class = "progress" >
< div class = "progress-bar progress-bar-success text-light" role = "progressbar" :style = "'width: ' + building.loader + '%;'" aria-valuenow = "10" aria-valuemin = "0" aria-valuemax = "100" >
< span v-if = "!building.hasMissingResources" >
{{ building.loader }} %
< / span >
< span class = "text-danger" v-else >
Missing resources!
< / span >
< / div >
< / div >
< / li >
< / ul >
< / div >
< / div >
< / div >
< div class = "col-md-6" >
< div class = "card" >
< a class = "card-header" data-toggle = "collapse" href = "#collapseAvailable" role = "button" aria-expanded = "true" aria-controls = "collapseAvailable" >
< h3 > Available buildings< / h3 >
< / a >
< div class = "card-body" id = "collapseAvailable" >
< 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 > {{ building.price }} < img class = "resource-icon" src = "img/gold.png" > < / a >
< / div >
< div class = "float-left" >
< img class = "building-icon" :src = "'img/' + building.icon + '.png'" >
< / div >
< strong > {{ building.name }}< / strong > < br >
{{ building.amount }} < img class = "resource-icon" :src = "'img/' + building.resource + '.png'" > every {{ building.intervalInSeconds }}s< br / >
< span v-if = "building.hasRequirements" v-html = "getRequirementsText(building)" > < / span >
< / li >
< / ul >
< / div >
< / div >
< / div >
< div class = "col-md-12" >
< div class = "card" >
< div class = "card-header" > Sandbox< / div >
< div class = "card-body" >
< template v-for = "building in buildings" v-if = "building.amountPerLevel || building.intervalPerLevel || building.pricePerLevel" >
< h3 > < strong > {{ building.name }}< / strong > < / h3 >
Amout per Level:< br / >
< input class = "form-control form-control-sandbox" type = "text" v-for = "amount in building.amountPerLevel" @ change = "saveBuildingsToStorage()" :value = "amount" > < br / >
Interval per Level:< br / >
< input class = "form-control form-control-sandbox" type = "text" v-for = "interval in building.intervalPerLevel" @ change = "saveBuildingsToStorage()" :value = "interval" > < br / >
Price per Level:< br / >
< input class = "form-control form-control-sandbox" type = "text" v-for = "price in building.pricePerLevel" @ change = "saveBuildingsToStorage()" :value = "price" > < br / >
< hr / > < br / >
< / template >
< / div >
< / div >
< / div >
< div class = "col-md-12" >
< div class = "card" >
< a class = "card-header" data-toggle = "collapse" href = "#collapseDebug" role = "button" aria-expanded = "true" aria-controls = "collapseDebug" >
< h3 > Debug< / h3 >
< / a >
< div class = "card-body" id = "collapseDebug" >
< h3 > Known bugs< / h3 > < br / >
< ul class = "list-group" >
< li class = "list-group-item" >
Blacksmith is broken at the moment and corrupts the resource-storage. < br / >
< a class = "btn btn-sm btn-danger" href = "javascript:" @ click = "removeBlackSmith()" > Click here to fix it for now< / a >
< / li >
< / ul >
< br / >
< hr / >
< br / >
< a href = "https://git.luna-development.net/neroignis/idle-buildup/issues" > < i class = "fas fa-bug" > < / i > Found a bug?< / a >
< br / >
< hr / >
< br / >
< a class = "btn btn-sm btn-danger" href = "javascript:" @ click = "resources = {gold: 500,wood: 50,stone: 50,iron: 50,bricks: 50,corn: 50,coal: 50,planks: 50}" > Reset resources< / a >
< br / >
< br / >
< a class = "btn btn-sm btn-danger" href = "javascript:" @ click = "reset()" > Soft reset (everything except resources)< / a > < br / >
< a class = "btn btn-sm btn-danger" href = "javascript:" @ click = "reset(true)" > Hard reset (everything)< / a > < br / >
< / div >
< / div >
< / div >
< / div >
< / div >
< script src = "https://code.jquery.com/jquery-3.2.1.slim.min.js" > < / script >
< script src = "https://cdnjs.cloudflare.com/ajax/libs/izitoast/1.4.0/js/iziToast.min.js" > < / script >
< script src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" > < / script >
< script src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" > < / script >
< 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/app.js?v=0.3" > < / script >
< / body >
< / html >