Commit 52eb0308 authored by Eliot Berriot's avatar Eliot Berriot

Added basic researches and multipliers

parent 5c891950
...@@ -34,6 +34,22 @@ ...@@ -34,6 +34,22 @@
<div class="page ui container"> <div class="page ui container">
<router-view></router-view> <router-view></router-view>
</div> </div>
<div class="ui vertical footer segment">
<div class="ui center aligned container">
<div class="ui stackable divided grid">
<div class="three wide column">
<h4 class="ui header">Debug actions</h4>
<div class="ui link list">
<a class="item" @click="Game.reset">Reset</a>
</div>
</div>
<div class="seven wide column">
<h4 class="ui header">IdleBits</h4>
<p>IdleBits is a free and open-source incremental game about collecting data to rule the world.</p>
</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
...@@ -55,6 +71,7 @@ export default { ...@@ -55,6 +71,7 @@ export default {
}, },
data () { data () {
return { return {
Game,
amountSteps: data.settings.amountSteps amountSteps: data.settings.amountSteps
} }
}, },
......
<template>
<div class="card" v-if="research.visible">
<div class="content">
<div class="header">
{{ research.label }}
</div>
<div class="description">
{{ research.description }}
</div>
</div>
<slot class="post-content"></slot>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
props: [
'research'
],
computed: {
...mapState({
information: state => state.exchange.dollars
})
}
}
</script>
<template>
<div>
<h2 class="ui center aligned header">
Research
<div class="sub header">Purchase research to further increase your throughput.</div>
</h2>
<div class="ui secondary pointing menu">
<a :class="[{'active': currentTab === 'available'}, 'item']" @click="currentTab = 'available'">
Available
<div class="ui teal left label">{{ availableResearches.length }}</div>
</a>
<a :class="[{'active': currentTab === 'purchased'}, 'item']" @click="currentTab = 'purchased'">
Purchased
<div class="ui left label">{{ purchasedResearches.length }}</div>
</a>
</div>
<div class="ui hidden divider"></div>
<div class="ui three stackable cards">
<template v-if="currentTab === 'available'">
<research-detail
:key="research.id"
v-for="research in availableResearches"
v-if="research.visible"
:research="research">
<slot name="post-content">
<div
@click="$store.dispatch('research/purchase', research.id)"
:class="['ui', 'bottom', 'attached', {'teal': research.price <= information}, 'button']">
Purchase for ${{ research.price|idleNumber }}
</div>
</slot>
</research-detail>
</template>
<template v-else="currentTab === 'purchased'">
<research-detail
:key="research.id"
v-for="research in purchasedResearches"
v-if="research.visible"
:research="research">
</research-detail>
</template>
</div>
</div>
</template>
<script>
import { mapGetters, mapState } from 'vuex'
import ResearchDetail from './Detail'
// import Popup from '@/components/semantic/Popup'
// import PopupWrapper from '@/components/semantic/PopupWrapper'
export default {
components: {
ResearchDetail
// PopupWrapper,
// Popup
},
data: function () {
return {
currentTab: 'available'
}
},
computed: {
...mapState({
information: state => state.exchange.dollars
}),
...mapGetters({
availableResearches: 'research/availableResearches',
purchasedResearches: 'research/purchasedResearches',
allResearches: 'research/allResearches'
})
}
}
</script>
...@@ -25,10 +25,10 @@ ...@@ -25,10 +25,10 @@
<span class="ui item"> <span class="ui item">
<i :class="[productionIcon, 'icon']"></i> <i :class="[productionIcon, 'icon']"></i>
<template v-if="group === 'storage'"> <template v-if="group === 'storage'">
{{ unit.size | idleNumber}} {{ productionUnit}} {{ getProduction({group: group, subgroup: subgroup, id: unit.id}) | idleNumber}} {{ productionUnit}}
</template> </template>
<template v-else> <template v-else>
{{ unit[productionUnit] | idleNumber}} {{ productionUnit}}/s {{ getProduction({group: group, subgroup: subgroup, id: unit.id}) | idleNumber}} {{ productionUnit}}/s
</template> </template>
</span> </span>
<span :class="['ui', 'right', 'floating', {'red active': exchange.dollars < unitPrice(unit.id) | unitAmount(unit.id) === 0}, 'item']"> <span :class="['ui', 'right', 'floating', {'red active': exchange.dollars < unitPrice(unit.id) | unitAmount(unit.id) === 0}, 'item']">
...@@ -60,6 +60,8 @@ export default { ...@@ -60,6 +60,8 @@ export default {
}), }),
...mapGetters({ ...mapGetters({
getPrice: 'units/getPrice', getPrice: 'units/getPrice',
getProduction: 'units/getProduction',
getMultiplier: 'multipliers/getUnitMultipliers',
getPriceForAmount: 'units/getPriceForAmount' getPriceForAmount: 'units/getPriceForAmount'
}) })
}, },
......
...@@ -4,6 +4,18 @@ ...@@ -4,6 +4,18 @@
Units Units
<div class="sub header">Your network produce raw data (bits) and send it to your datacenter.</div> <div class="sub header">Your network produce raw data (bits) and send it to your datacenter.</div>
</h2> </h2>
<div class="ui two buttons">
<div
@click="$store.dispatch('network/bits.collect', 1)"
class="ui button">
Gather 1 data
</div>
<div
@click="$store.dispatch('processing/process', 1)"
class="ui button">
Process 1 data
</div>
</div>
<div class="ui fluid three item menu"> <div class="ui fluid three item menu">
<a :class="[{active: currentTab === 'network'}, 'item']" @click="show('network')"> <a :class="[{active: currentTab === 'network'}, 'item']" @click="show('network')">
Network Network
......
import researches from './researches'
import units from './units'
const data = {
suffixes: [
{suffix: 'k', length: 4},
{suffix: 'M', length: 7},
{suffix: 'B', length: 10},
{suffix: 'T', length: 13}
],
settings: {
amountSteps: [
{ value: 1 },
{ value: 10 },
{ value: 100 },
{ value: 1000 },
{ value: 'max' }
]
},
network: {
collectors: units.network.collectors
},
storage: {
initialStorage: 10,
devices: units.storage.devices
},
processing: {
initialProcessing: 0,
processors: units.processing.processors
},
research: {
list: researches,
byId: {}
}
}
data.research.list.forEach(e => {
data.research.byId[e.id] = e
})
export default data
import units from './units'
function unitResearch ({group, subgroup, id, level, price, label, multiplier}) {
const unit = units[group][subgroup][id]
const displayMultiplier = (multiplier - 1) * 100
return {
id: `unit/${group}/${subgroup}/${id}/${level}`,
category: 'units',
displayMultiplier,
description: `Improve ${unit.name} production by ${displayMultiplier}%`,
multipliers: [
{ value: multiplier, type: 'unit', group, subgroup, id }
],
price,
level,
label,
isVisible: function (state, getters, rootState, rootGetters) {
const min = (level + 1) * 10
return rootState.units[group][subgroup][id].count >= min
}
}
}
const researches = [
unitResearch({
group: 'network',
subgroup: 'collectors',
label: 'Climate change',
id: 0,
level: 0,
multiplier: 2,
price: 50
}),
unitResearch({
group: 'network',
subgroup: 'collectors',
label: 'Hello world',
id: 0,
level: 1,
multiplier: 2,
price: 150
})
]
export default researches
export default { const data = {
suffixes: [
{suffix: 'k', length: 4},
{suffix: 'M', length: 7},
{suffix: 'B', length: 10},
{suffix: 'T', length: 13}
],
settings: {
amountSteps: [
{ value: 1 },
{ value: 10 },
{ value: 100 },
{ value: 1000 },
{ value: 'max' }
]
},
network: { network: {
collectors: [ collectors: [
{ {
...@@ -33,7 +18,6 @@ export default { ...@@ -33,7 +18,6 @@ export default {
] ]
}, },
storage: { storage: {
initialStorage: 10,
devices: [ devices: [
{ {
id: 0, id: 0,
...@@ -66,7 +50,6 @@ export default { ...@@ -66,7 +50,6 @@ export default {
] ]
}, },
processing: { processing: {
initialProcessing: 0,
processors: [ processors: [
{ {
id: 0, id: 0,
...@@ -85,3 +68,5 @@ export default { ...@@ -85,3 +68,5 @@ export default {
] ]
} }
} }
export default data
...@@ -13,6 +13,11 @@ export default { ...@@ -13,6 +13,11 @@ export default {
stop () { stop () {
Loop.clear() Loop.clear()
}, },
reset () {
Loop.clear()
window.localStorage.setItem('save', JSON.stringify({}))
window.location.reload()
},
loadPreviousSave () { loadPreviousSave () {
let previousSave = this.getPreviousSave() let previousSave = this.getPreviousSave()
if (typeof previousSave === 'object') { if (typeof previousSave === 'object') {
......
...@@ -4,6 +4,10 @@ export const state = { ...@@ -4,6 +4,10 @@ export const state = {
export const mutations = { export const mutations = {
'currency.increment' (state, payload) { 'currency.increment' (state, payload) {
const newValue = state[payload.currency] + payload.amount
if (newValue < 0) {
throw new Error('Not enough funds')
}
state[payload.currency] += payload.amount state[payload.currency] += payload.amount
} }
} }
......
...@@ -7,6 +7,8 @@ import storage from './storage' ...@@ -7,6 +7,8 @@ import storage from './storage'
import processing from './processing' import processing from './processing'
import units from './units' import units from './units'
import exchange from './exchange' import exchange from './exchange'
import research from './research'
import multipliers from './multipliers'
import settings from './settings' import settings from './settings'
import cli from './cli' import cli from './cli'
...@@ -19,6 +21,8 @@ const store = new Vuex.Store({ ...@@ -19,6 +21,8 @@ const store = new Vuex.Store({
processing, processing,
units, units,
exchange, exchange,
research,
multipliers,
settings, settings,
cli, cli,
storage storage
......
export const state = {}
export const mutations = {}
export const actions = {}
export const getters = {
'allMultipliers' (state, getters, rootState, rootGetters) {
const researchMultipliers = []
rootGetters['research/purchasedResearches'].forEach(e => {
e.multipliers.forEach(m => {
researchMultipliers.push(m)
})
})
return [...researchMultipliers].map(e => {
let realValue = e.value
if (realValue === undefined) {
realValue = e.handler(rootState, rootGetters)
}
return {
...e,
realValue
}
})
},
'unitMultipliers' (state, getters) {
return getters.allMultipliers.filter(e => {
return e.type === 'unit'
})
},
getUnitMultipliers: (state, getters) => (payload) => {
return getters.unitMultipliers.filter(e => {
return e.group === payload.group && e.subgroup === payload.subgroup && e.id === payload.id
})
}
}
export default {
namespaced: true,
state,
mutations,
actions,
getters
}
...@@ -25,12 +25,12 @@ export const actions = { ...@@ -25,12 +25,12 @@ export const actions = {
} }
export const getters = { export const getters = {
'bps' (state, getters, rootState) { // bits per second 'bps' (state, getters, rootState, rootGetters) { // bits per second
let total = 0 let total = 0
data.network.collectors.forEach(collector => { data.network.collectors.forEach(collector => {
let s = rootState.units.network.collectors[collector.id] let s = rootState.units.network.collectors[collector.id]
if (s) { if (s) {
total += s.count * collector.bps total += s.count * rootGetters['units/getProduction']({group: 'network', subgroup: 'collectors', id: collector.id})
} }
}) })
return total return total
......
...@@ -11,12 +11,12 @@ export const mutations = { ...@@ -11,12 +11,12 @@ export const mutations = {
} }
export const getters = { export const getters = {
'pps' (state, getters, rootState) { // bits processed per second 'pps' (state, getters, rootState, rootGetters) { // bits processed per second
let total = data.processing.initialProcessing let total = data.processing.initialProcessing
data.processing.processors.forEach(processor => { data.processing.processors.forEach(processor => {
let s = rootState.units.processing.processors[processor.id] let s = rootState.units.processing.processors[processor.id]
if (s) { if (s) {
total += s.count * processor.pps total += s.count * rootGetters['units/getProduction']({group: 'processing', subgroup: 'processors', id: processor.id})
} }
}) })
return total return total
......
import data from '@/data'
export const state = {
purchased: []
}
export const mutations = {
'purchase' (state, id) {
state.purchased.push(id)
}
}
export const actions = {
'purchase' ({commit, getters, state, rootState}, id) {
const research = getters.getResearch(id)
if (research && !research.purchased) {
commit('exchange/currency.increment', {currency: 'dollars', amount: -research.price}, {root: true})
commit('purchase', research.id)
}
}
}
export const getters = {
getResearch: (state, getters, rootState, rootGetters) => (id) => {
let d = data.research.byId[id]
if (d) {
return {
...d,
purchased: getters.isPurchased(id),
visible: getters.isVisible(id)
}
}
},
isVisible: (state, getters, rootState, rootGetters) => (id) => {
let d = data.research.byId[id]
if (d) {
return d.isVisible(state, getters, rootState, rootGetters)
}
},
isPurchased: (state) => (id) => {
return state.purchased.indexOf(id) !== -1
},
'allResearches' (state, getters) {
return data.research.list.map(e => {
return getters.getResearch(e.id)
})
},
'availableResearches' (state, getters) {
return getters.allResearches.filter(e => {
return !e.purchased && e.visible
})
},
'purchasedResearches' (state, getters) {
return getters.allResearches.filter(e => {
return e.purchased
})
}
}
export default {
namespaced: true,
state,
mutations,
actions,
getters
}
...@@ -10,12 +10,12 @@ export const getters = { ...@@ -10,12 +10,12 @@ export const getters = {
'usagePercent' (state, getters, rootState) { 'usagePercent' (state, getters, rootState) {
return parseInt(rootState.network.bits * 100 / getters.total) return parseInt(rootState.network.bits * 100 / getters.total)
}, },
'total' (state, getters, rootState) { 'total' (state, getters, rootState, rootGetters) {
let total = data.storage.initialStorage let total = data.storage.initialStorage
data.storage.devices.forEach(device => { data.storage.devices.forEach(device => {
let s = rootState.units.storage.devices[device.id] let s = rootState.units.storage.devices[device.id]
if (s) { if (s) {
total += s.count * device.size total += s.count * rootGetters['units/getProduction']({group: 'storage', subgroup: 'devices', id: device.id})
} }
}) })
return total return total
......
...@@ -71,6 +71,16 @@ export const getters = { ...@@ -71,6 +71,16 @@ export const getters = {
...data.processing.processors.map(e => { return {group: 'processing', subgroup: 'processors', unit: e} }) ...data.processing.processors.map(e => { return {group: 'processing', subgroup: 'processors', unit: e} })
] ]
return units return units
},
getProduction: (state, getters, rootState, rootGetters) => (payload) => {
// for a given currency amount (like $100), return the amount and price of units you can buy
let d = data[payload.group][payload.subgroup][payload.id]
let multipliers = rootGetters['multipliers/getUnitMultipliers'](payload)
let value = d.bps | d.size | d.pps
let finalValue = multipliers.reduce((a, b) => {
return a * b.realValue
}, value)
return finalValue
} }
} }
......
<template> <template>
<div> <div>
<div class="ui stackable grid"> <div class="ui stackable grid">
<units class="ten wide column"></units> <div class="ten wide column">
<units></units>
<div class="ui hidden divider"></div>
<research></research>
</div>
<div class="six wide column"> <div class="six wide column">
<console></console> <console></console>
<div class="ui hidden divider"></div> <div class="ui hidden divider"></div>
...@@ -15,11 +19,13 @@ ...@@ -15,11 +19,13 @@
import Exchange from '@/components/exchange/Widget' import Exchange from '@/components/exchange/Widget'
import Console from '@/components/cli/Console' import Console from '@/components/cli/Console'
import Units from '@/components/units/Widget' import Units from '@/components/units/Widget'
import Research from '@/components/research/Widget'
export default { export default {
components: { components: {
Exchange, Exchange,
Console, Console,
Research,
Units Units
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment