diff --git a/css/style.css b/css/style.css index 0e138ee..3486ce7 100644 --- a/css/style.css +++ b/css/style.css @@ -96,3 +96,24 @@ h1 br { #Status strong { color: #666; } + +.update-value { + position: relative; + float: right; +} + +.update-plus { + color: green; + float: left; + right: 5px; + position: absolute; +} + +.update-minus { + color: red; + float: left; + right: 5px; + position: absolute; +} + + diff --git a/index.html b/index.html index a767b1d..9f60f2e 100644 --- a/index.html +++ b/index.html @@ -46,16 +46,19 @@ Data
{{ lc.lab.data | niceNumber }} +
Reputation
{{ lc.lab.reputation | niceNumber }} +
-
- Funding +
+ Funding
{{ lc.lab.money | currency }} +
diff --git a/js/game.js b/js/game.js index 42c0fd0..fedf53b 100644 --- a/js/game.js +++ b/js/game.js @@ -33,17 +33,21 @@ getGrant: function () { var addition = this.reputation * this.factor.rate; // TODO: adjust factor this.money += addition; + showUpdateValue("#update-funding", addition); achievements.update('count', 'money', addition); }, acquire: function(amount) { this.data += amount; achievements.update('count', 'data', amount); + showUpdateValue("#update-data", amount); }, research: function(cost, reputation) { if (this.data >= cost) { this.data -= cost; this.reputation += reputation; achievements.update('count', 'reputation', reputation); + showUpdateValue("#update-data", -cost); + showUpdateValue("#update-reputation", reputation); return true; } return false; @@ -51,6 +55,7 @@ buy: function(cost) { if (this.money >= cost) { this.money -= cost; + showUpdateValue("#update-funding", -cost); return true; } return false; diff --git a/js/ui.js b/js/ui.js index 5ebec90..9e137bd 100644 --- a/js/ui.js +++ b/js/ui.js @@ -40,4 +40,31 @@ $(function() { else detector.visible = !this[hidden]; } -})(); \ No newline at end of file +})(); + +function showUpdateValue(ident, num) { + if (num != 0) { + if (num > 0) { + insert = $("
") + .attr("class", "update-plus") + .html("+" + num); + } else { + insert = $("
") + .attr("class", "update-minus") + .html(num); + } + showUpdate(ident, insert); + } +} + +function showUpdate(ident, insert) { + elem = $(ident); + elem.append(insert); + insert.animate({ + "bottom":"+=30px", + "opacity": 0 + }, { duration: 500, complete: function() { + $(this).remove(); + }}); +} +