Most things working. Apart from achivements somehow. Also achievements pop up has to be reintroduced. Probalby write an AchievementsManager or something.

index.html

@@ -87,16 +87,16 @@
         <h3><i class="fa fa-cogs"></i> Research</h3>
         <hr>
         <ul class="media-list" ng-cloak>
-          <li class="media" ng-repeat="r in rc.research" ng-show="r.is_visible()">
-            <img ng-show="r.level > 0" class="pull-left media-object" src="{{ r.image }}" alt="">
-            <img ng-hide="r.level > 0" class="pull-left media-object" src="assets/icons/png/unknown.png" alt="">
+          <li class="media" ng-repeat="r in rc.research" ng-show="rc.isVisible(r)">
+            <img ng-show="r.state.level > 0" class="pull-left media-object" src="{{ r.image }}" alt="">
+            <img ng-hide="r.state.level > 0" class="pull-left media-object" src="assets/icons/png/unknown.png" alt="">
             <div class="media-body">
-              <h4 class="media-heading">{{ r.level > 0 ? r.name : '?????' }} <span ng-show="r.level > 0" class="badge">Level {{ r.level }}</span></h4>
+              <h4 class="media-heading">{{ r.state.level > 0 ? r.name : '?????' }} <span ng-show="r.state.level > 0" class="badge">Level {{ r.state.level }}</span></h4>
               <p ng-show="r.level > 0">{{ r.description }}</p>
-              <p ng-show="r.level > 0" class="small">Research yields <strong>{{ r.reputation | niceNumber }}</strong> reputation.</p>
+              <p ng-show="r.level > 0" class="small">Research yields <strong>{{ r.state.reputation | niceNumber }}</strong> reputation.</p>
               <div class="btn-group">
-              <button class="btn btn-primary" ng-disabled="!r.is_available()" ng-click="rc.doResearch(r)">Research <small>({{ r.cost | niceNumber }} data)</small></button>
-              <button class="btn btn-info {{ r.interesting ? 'blink' : '' }}" ng-show="r.level > 0" ng-click="rc.showInfo(r)"><i class="fa fa-exclamation"></i></button>
+              <button class="btn btn-primary" ng-disabled="!rc.isAvailable(r)" ng-click="rc.doResearch(r)">Research <small>({{ r.state.cost | niceNumber }} data)</small></button>
+              <button class="btn btn-info {{ r.state.interesting ? 'blink' : '' }}" ng-show="r.state.level > 0" ng-click="rc.showInfo(r)"><i class="fa fa-exclamation"></i></button>
             </div>
             </div>
           </li>
@@ -104,7 +104,7 @@
       </div>
 
       <div class="col-xs-5 scrollable" ng-controller="LabController as lc">
-        <input id="labname" value="{{ lc.lab.name }}" ng-model="lc.lab.name" ng-cloak>
+        <input id="labname" value="{{ lc.lab.state.name }}" ng-model="lc.lab.state.name" ng-cloak>
         <hr>
         <button class="pull-right btn btn-info" ng-click="lc.showDetectorInfo()"><span class="glyphicon glyphicon-info-sign"></span></button>
         <div id="detector" ng-controller="DetectorController as dc">
@@ -119,19 +119,19 @@
           <div class="col-xs-4 text-center">
             <strong>Data</strong>
             <br>
-            {{ lc.lab.data | niceNumber }}
+            {{ lc.lab.state.data | niceNumber }}
             <div class="update-value" id="update-data"></div>
           </div>
           <div class="col-xs-4 text-center">
             <strong>Reputation</strong>
             <br>
-            {{ lc.lab.reputation | niceNumber }}
+            {{ lc.lab.state.reputation | niceNumber }}
             <div class="update-value" id="update-reputation"></div>
           </div>
           <div class="col-xs-4">
             <span class="text-center"><strong>Funding</strong></span>
             <br>
-            {{ lc.lab.money | currency }}
+            {{ lc.lab.state.money | currency }}
             <div class="update-value" id="update-funding"></div>
           </div>
         </div>
@@ -141,12 +141,12 @@
         <h3><i class="fa fa-users"></i> HR</h3>
         <hr>
         <ul class="media-list" ng-cloak>
-          <li class="media" ng-repeat="w in hrc.workers" ng-show="w.is_visible()">
+          <li class="media" ng-repeat="w in hrc.workers" ng-show="hrc.isVisible(w)">
             <div class="media-body">
-              <h4 class="media-heading">{{ w.name }} <span ng-show="w.hired > 0" class="badge">{{ w.hired | niceNumber }}</span></h4>
-              <p ng-show="w.hired > 0">{{ w.description }}</p>
-              <p ng-show="w.hired > 0" class="small">Produce <strong>{{ w.rate | niceNumber }}</strong> data per second.</p>
-              <button class="btn btn-primary" ng-disabled="!w.is_available()" ng-click="hrc.hire(w)">Hire <small>({{ w.cost | currency }})</small></button>
+              <h4 class="media-heading">{{ w.name }} <span ng-show="w.state.hired > 0" class="badge">{{ w.state.hired | niceNumber }}</span></h4>
+              <p ng-show="w.state.hired > 0">{{ w.description }}</p>
+              <p ng-show="w.state.hired > 0" class="small">Produce <strong>{{ w.state.rate | niceNumber }}</strong> data per second.</p>
+              <button class="btn btn-primary" ng-disabled="!hrc.isAvailable(w)" ng-click="hrc.hire(w)">Hire <small>({{ w.state.cost | currency }})</small></button>
             </div>
           </li>
         </ul>
@@ -156,12 +156,12 @@
         <h3><i class="fa fa-wrench"></i> Upgrades</h3>
         <hr>
         <ul class="media-list" ng-cloak>
-          <li class="media" ng-repeat="u in uc.upgrades" ng-show="u.isVisible()">
+          <li class="media" ng-repeat="u in uc.upgrades" ng-show="uc.isVisible(u)">
             <div class="media-body">
               <h4 class="media-heading">{{ u.name }} <i class="fa {{ u.icon }} media-object"></i></h4>
               <p>{{ u.description }}</p>
               <p class="small">{{ u.effect }}</p>
-              <button class="btn btn-primary" ng-disabled="!u.isAvailable()" ng-click="uc.upgrade(u)">Buy <small>({{ u.cost | currency }})</small></button>
+              <button class="btn btn-primary" ng-disabled="!uc.isAvailable(u)" ng-click="uc.upgrade(u)">Buy <small>({{ u.cost | currency }})</small></button>
             </div>
           </li>
         </ul>
@@ -180,7 +180,7 @@
       </div>
     </div>
 
-    <div class="modal fade" id="achievements-modal" tabindex="-1" role="dialog" aria-labelledby="achievements-label" aria-hidden="true" ng-controller="AchievementsController as ac">
+    <div class="modal fade" id="achievements-modal" tabindex="-1" role="dialog" aria-labelledby="achievements-label" aria-hidden="true" ng-controller="AchievementsController">
       <div class="modal-dialog">
         <div class="modal-content">
           <div class="modal-header">
@@ -188,12 +188,12 @@
             <h4 class="modal-title" id="achievements-label">Achievements</h4>
           </div>
           <div class="modal-body">
-            <p class="text-center"><strong>Progress</strong> <span class="label label-info">{{ ac.achievements.length }} / {{ ac.achievementsAll.length }}</span></p>
+            <p class="text-center"><strong>Progress</strong> <span class="label label-info">{{ progress() }} / {{ achievements.length }}</span></p>
             <ul class="list-group">
-              <li class="list-group-item" ng-repeat="a in ac.achievements | reverse">
-                <span class="glyphicon {{ a.icon }}"></span>
+              <li class="list-group-item" ng-repeat="a in achievements | reverse" ng-show="a.isAchieved()">
+                <i class="fa {{ a.icon }}"></i>
                 {{ a.description }}
-                <span class="badge">{{ a.time }}</span>
+                <span class="badge">{{ a.state.dateAchieved | date }}</span>
               </li>
             </ul>
           </div>
@@ -256,7 +256,6 @@
     <script src="js/gameobjects.js"></script>
     <script src="js/event.js"></script>
     <script src="js/detector.js"></script>
-    <script src="js/achievements.js"></script>
     <script src="js/ui.js"></script>
     <script src="js/game.js"></script>
     <script src="js/warnmobile.js"></script>

js/app.js

@@ -2,24 +2,19 @@
 (function() {
   var game = new Game.Game();
   game.load();
-  var lab, research, workers, upgrades;
 
-  $.when(game.load).then(function() {
-    lab = game.lab;
-    research = game.research;
-    workers = game.workers;
-    upgrades = game.upgrades;
-  });
+  var lab = game.lab;
+  var research = game.research;
+  var workers = game.workers;
+  var upgrades = game.upgrades;
+  var achievements = game.achievements;
 
   UI.validateVersion(lab.version);
 
-  achievements.addResearch(research);
-  achievements.addWorkers(workers);
-  
   var app = angular.module('particleClicker', []);
 
   app.filter('niceNumber', ['$filter', function($filter) {
-    return Helpers.formatNumberPostfix;
+      return Helpers.formatNumberPostfix;
   }]);
 
   app.filter('currency', ['$filter', function($filter) {
@@ -36,11 +31,9 @@
 
   app.controller('DetectorController', function() {
     this.click = function() {
-      lab.acquire(lab.detector.rate);
+      lab.acquireData(lab.state.detector);
       detector.addEvent();
-      achievements.update('count', 'clicks', 1);
-      achievements.update('count', 'data', lab.detector.rate);
-      UI.showUpdateValue("#update-data", lab.detector.rate);
+      UI.showUpdateValue("#update-data", lab.state.detector);
       return false;
     };
   });
@@ -55,35 +48,34 @@
     };
     $interval(function() {  // one tick
       var grant = lab.getGrant();
-      achievements.update('count', 'money', grant);
       UI.showUpdateValue("#update-funding", grant);
       var sum = 0;
       for (var i = 0; i < workers.length; i++) {
-        sum += workers[i].hired * workers[i].rate;
+        sum += workers[i].state.hired * workers[i].state.rate;
+      }
+      if (sum > 0) {
+        lab.acquireData(sum);
+        UI.showUpdateValue("#update-data", sum);
+        detector.addEventExternal(workers.map(function(w) {
+          return w.state.hired;
+        }).reduce(function(a, b){return a + b}, 0));
       }
-      lab.acquire(sum);
-      achievements.update('count', 'data', sum);
-      UI.showUpdateValue("#update-data", sum);
-      detector.addEventExternal();
     }, 1000);
   }]);
 
   app.controller('ResearchController', ['$compile', function($compile) {
     this.research = research;
+    this.isVisible = function(item) {
+      return item.isVisible(lab);
+    };
+    this.isAvailable = function(item) {
+      return item.isAvailable(lab);
+    };
     this.doResearch = function(item) {
-      var cost = item.research();
+      var cost = item.research(lab);
       if (cost > 0) {
-        achievements.update('count', 'reputation', item.reputation);
-        achievements.update('count', 'dataSpent', cost);
-        achievements.update('research', item.name, 1);
         UI.showUpdateValue("#update-data", -cost);
         UI.showUpdateValue("#update-reputation", item.reputation);
-        analytics.sendEvent(
-          analytics.events.categoryResearch,
-          analytics.events.actionResearch,
-          item.name,
-          item.level
-        );
       }
     };
     this.showInfo = function(r) {
@@ -94,12 +86,15 @@
 
   app.controller('HRController', function() {
     this.workers = workers;
+    this.isVisible = function(worker) {
+      return worker.isVisible(lab);
+    };
+    this.isAvailable = function(worker) {
+      return worker.isAvailable(lab);
+    };
     this.hire = function(worker) {
-      var cost = worker.hire();
+      var cost = worker.hire(lab);
       if (cost > 0) {
-        achievements.update('count', 'moneyWorkers', cost);
-        achievements.update('workers', worker.name, 1);
-        achievements.update('count', 'workers', 1);
         UI.showUpdateValue("#update-funding", -cost);
       }
     };
@@ -107,29 +102,32 @@
 
   app.controller('UpgradesController', function() {
     this.upgrades = upgrades;
+    this.isVisible = function(upgrade) {
+      return upgrade.isVisible(lab);
+    };
+    this.isAvailable = function(upgrade) {
+      return upgrade.isAvailable(lab);
+    };
     this.upgrade = function(upgrade) {
-      if (upgrade.buy()) {
-        achievements.update('count', 'moneyUpgrades', upgrade.cost);
+      if (upgrade.buy(lab)) {
         UI.showUpdateValue("#update-funding", upgrade.cost);
       }
     }
   });
 
-  achievements.setList(Helpers.loadFile('json/achievements.json'));
-  achievements.restore();
-
-  app.controller('AchievementsController', function() {
-    this.achievements = achievements.listSummary;
-    this.achievementsAll = achievements.list;
+  app.controller('AchievementsController', function($scope) {
+    $scope.achievements = achievements;
+    $scope.progress = function() {
+      return achievements.filter(function(a) { a.isAchieved(); }).length;
+    };
   });
 
   app.controller('SaveController',
       ['$scope', '$interval', function($scope, $interval) {
     $scope.lastSaved = new Date();
     $scope.saveNow = function() {
-      GameObjects.saveAll();
+      game.save();
       $scope.lastSaved = new Date();
-      achievements.lastSave = $scope.lastSaved.getTime();
     };
     $scope.restart = function() {
       if (window.confirm(

js/detector.js

@@ -273,13 +273,13 @@ var detector =
         }
     },
 
-    addEventExternal: function()
+    addEventExternal: function(numWorkers)
     {
         if (!detector.visible) {
             return;
         }
 
-        var num = Math.min(20 * achievements.count.workers / 10, 20);
+        var num = Math.min(20 * numWorkers / 10, 20);
 
         for (var i = 0; i < num; i++) {
             var index = Math.round(Math.random() * (detector.tracks.length - 1));

js/game.js

@@ -6,7 +6,7 @@ var Game = (function() {
     this.research = null;
     this.workers = null;
     this.upgrades = null;
-    this.achivements = null;
+    this.achievements = null;
     this.allObjects = {lab : this.lab};
     this.loaded = false;
   };
@@ -15,44 +15,48 @@ var Game = (function() {
     if (this.loaded) {
       return;
     }
+
+    // I know synchronous requests are bad as they will block the browser.
+    // However, I don't see any other reasonable way to do this in order to
+    // make it work with Angular. If you know a way, let me know, and I'll
+    // give you a beer. - Kevin
+    this.research = Helpers.loadFile('json/research.json');
+    this.workers = Helpers.loadFile('json/workers.json');
+    this.upgrades = Helpers.loadFile('json/upgrades.json');
+    this.achievements = Helpers.loadFile('json/achievements.json');
+
+    // Turn JSON files into actual game objects and fill map of all objects
     var _this = this;
-    $.when($.get('json/research.json', function(jR) { _this.research = jR; }),
-           $.get('json/workers.json', function(jW) { _this.workers = jW; }),
-           $.get('json/upgrades.json', function(jU) { _this.upgrades = jU; }),
-           $.get('json/achievements.json',
-                 function(jA) { _this.achivements = jA; })).then(function() {
-      // Turn JSON files into actual game objects and fill map of all objects
-      var makeGameObject = function(type, object) {
-        // It's okay to define this function here since load is only called
-        // once anyway...
-        var o = new type(object);
-        _this.allObjects[o.key] = o;
-        return o;
-      };
-      _this.research = _this.research.map(
-          function(r) { return makeGameObject(GameObjects.Research, r); });
-      _this.workers = _this.workers.map(
-          function(w) { return makeGameObject(GameObjects.Worker, w); });
-      _this.upgrades = _this.upgrades.map(
-          function(u) { return makeGameObject(GameObjects.Upgrade, u); });
-      _this.achivements = _this.achivements.map(function(a) {
-        var _a = makeGameObject(GameObjects.Achievement, a);
-        _a.setRefAllGameObjects(_this.allObjects);
-        return _a;
-      });
-      // Load states from local store
-      for (var i = 0; i < _this.allObjects.length; i++) {
-        var o = _this.allObjects[i];
-        o.loadState(ObjectStorage.load(o.key));
-      }
-      _this.loaded = true;
+    var makeGameObject = function(type, object) {
+      // It's okay to define this function here since load is only called
+      // once anyway...
+      var o = new type(object);
+      _this.allObjects[o.key] = o;
+      return o;
+    };
+    this.research = this.research.map(
+        function(r) { return makeGameObject(GameObjects.Research, r); });
+    this.workers = this.workers.map(
+        function(w) { return makeGameObject(GameObjects.Worker, w); });
+    this.upgrades = this.upgrades.map(
+        function(u) { return makeGameObject(GameObjects.Upgrade, u); });
+    this.achievements = this.achievements.map(function(a) {
+      var _a = makeGameObject(GameObjects.Achievement, a);
+      _a.setRefAllGameObjects(_this.allObjects);
+      return _a;
     });
+    // Load states from local store
+    for (var key in this.allObjects) {
+      var o = this.allObjects[key];
+      o.loadState(ObjectStorage.load(key));
+    }
+    this.loaded = true;
   };
 
   Game.prototype.save = function() {
     // Save every object's state to local storage
-    for (var i = 0; i < this.allObjects.length; i++) {
-      ObjectStorage.save(this.allObjects[i].state);
+    for (var key in this.allObjects) {
+      ObjectStorage.save(key, this.allObjects[key].state);
     }
   };
 

js/gameobjects.js

@@ -76,8 +76,9 @@ var GameObjects = (function() {
   /** @class Research
    */
   var Research = function(obj) {
-    GameObject.apply(
-        this, [$.extend({}, obj, {state : {level : 0, interesting : false}})]);
+    GameObject.apply(this, [obj]);
+    this.state.level = 0;
+    this.state.interesting = false;
   };
 
   Research.prototype = Object.create(GameObject.prototype);
@@ -126,7 +127,8 @@ var GameObjects = (function() {
    * Implement an auto-clicker in the game.
    */
   var Worker = function(obj) {
-    GameObject.apply(this, [$.extend({}, obj, {state : {hired : 0}})]);
+    GameObject.apply(this, [obj]);
+    this.state.hired = 0;
   };
 
   Worker.prototype = Object.create(GameObject.prototype);
@@ -149,7 +151,7 @@ var GameObjects = (function() {
   };
 
   Worker.prototype.hire = function(lab) {
-    if (lab && lab.buy(this.cost)) {
+    if (lab && lab.buy(this.state.cost)) {
       this.state.hired++;
       var cost = this.state.cost;
       this.state.cost = Math.round(cost * this.cost_increase);
@@ -164,8 +166,9 @@ var GameObjects = (function() {
   /** @class Upgrade
    */
   var Upgrade = function(obj) {
-    GameObject.apply(
-        this, [$.extend({}, obj, {state : {visible : false, used : false}})]);
+    GameObject.apply(this, [obj]);
+    this.state.visible = false;
+    this.state.used = false;
   };
 
   Upgrade.prototype = Object.create(GameObject.prototype);
@@ -223,8 +226,8 @@ var GameObjects = (function() {
   /** @class Achievement
    */
   var Achievement = function(obj) {
-    GameObject.apply(this,
-                     [$.extend({}, obj, {state : {dateAchieved : null}})]);
+    GameObject.apply(this, [obj]);
+    this.state.dateAchieved = null;
     this._allObjects = {};
   };
 

js/helpers.js

@@ -8,6 +8,7 @@ var Helpers = (function() {
   var loadFile = function(filename) {
     var res;
     $.ajax({
+      async: false,
       url : filename,
       success : function(data) {
         res = data;
@@ -19,6 +20,9 @@ var Helpers = (function() {
   /** Format a number with proper postfix.
    */
   var formatNumberPostfix = function(number) {
+    if (typeof number !== "number") {
+      return -123;
+    }
     var abs = Math.abs(number);
     if (abs >= Math.pow(10, 12)) {
       number = (number / Math.pow(10, 12)).toFixed(1) + "T";
@@ -37,7 +41,7 @@ var Helpers = (function() {
   return {
     loadFile: loadFile,
     formatNumberPostfix: formatNumberPostfix,
-    version: '0.2',
+    version: '0.4',
     analytics: ''
   };
 })();