Implement upgrades.

2026-07-13 17:42:41 +08:00 · 2014-08-02 20:19:35 +02:00
parent cee7366200
commit 2a824f5d90
4 changed files with 81 additions and 27 deletions
@@ -9,29 +9,20 @@
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body>
-        <nav class="navbar navbar-default navbar-fixed-top" ng-controller="LabController as lc">
-          <div class="container-fluid">
-            <div class="navbar-header">
-              <span class="navbar-brand" contenteditable="true" strip-br="true" ng-model="lc.lab.name">{{ lc.lab.name }}</span>
-            </div>
-            <p class="navbar-text">Data: <strong>{{ lc.lab.data }}</strong></p>
-            <p class="navbar-text"><span data-toggle="tooltip" data-placement="left" title="Tooltip on left">Reputation</span>: <strong>{{ lc.lab.reputation }}</strong></p>
-            <p class="navbar-text">Money: <strong>{{ lc.lab.money | currency }}</strong></p>
-            <p class="navbar-text navbar-right"><a href="https://github.com/ibab/particle-clicker/"><img src="assets/github.png" alt="GitHub" width="16"></a></p> 
-          </div>
-        </nav>
-
-        <!-- Collect the nav links, forms, and other content for toggling -->
-        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
-          <ul class="nav navbar-nav">
-          </ul>
-          
-        </div><!-- /.navbar-collapse -->
-      </div><!-- /.container-fluid -->
+    <nav class="navbar navbar-default navbar-fixed-top" ng-controller="LabController as lc">
+      <div class="container-fluid">
+        <div class="navbar-header">
+          <span class="navbar-brand" contenteditable="true" strip-br="true" ng-model="lc.lab.name">{{ lc.lab.name }}</span>
+        </div>
+        <p class="navbar-text">Data: <strong>{{ lc.lab.data | number:0 }}</strong></p>
+        <p class="navbar-text">Reputation: <strong>{{ lc.lab.reputation | number:0 }}</strong></p>
+        <p class="navbar-text">Money: <strong>{{ lc.lab.money | currency }}</strong></p>
+        <p class="navbar-text navbar-right"><a href="https://github.com/ibab/particle-clicker/"><img src="assets/github.png" alt="GitHub" width="16"></a></p> 
+      </div>
    </nav>

    <div class="container-fluid">
-      <div id="detector" class="col-xs-6" ng-controller="DetectorController as dc">
+      <div id="detector" class="col-xs-3" ng-controller="DetectorController as dc">
        <canvas id="detector-core" width="400" height="400">
          Your detector. Click on it to generate events.
        </canvas>
@@ -69,6 +60,16 @@
            </div>
          </li>
        </ul>
+      </div>
+
+      <div class="scrollable col-xs-3" id="Upgrades" ng-controller="UpgradesController as uc">
+        <h1>Upgrades</h1>
+        <hr>
+        <a href="#" class="thumbnail" ng-repeat="u in uc.upgrades" ng-show="u.is_visible()" ng-disabled="!u.is_available()" ng-click="u.buy()">
+          <img data-src="{{ u.image }}" alt="{{ u.name }}">
+        </a>
+      </div>
+
    </div>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
@@ -12,9 +12,11 @@
    return res;
  }

-
  var lab = {
    name: 'My Awesome Lab',
+    detector: {
+      rate: 1
+    },
    data: 0,
    reputation: 0,
    money: 0,
@@ -84,6 +86,53 @@
    };
  });

+  var upgrades = loadJsonFile('json/upgrades.json');
+  upgrades.map(function (upgrade) {
+    upgrade.getReceiver = function() {
+      if (this.type === "detector") {
+        return lab.detector;
+      } else {
+        var context;
+        if (this.type === "research") { context = research; }
+        else if (this.type === "hr") { context = workers; }
+        else { return null; }
+        for (var i = 0; i < context.length; i++) {
+          if (context[i].name === this.receiver) {
+            return context[i];
+          }
+        }
+        return null;
+      }
+    };
+    upgrade.hasReceiver = function () {
+      if (this.type === "detector") {
+        return true;
+      }
+      var rec = this.getReceiver();
+      if (this.type === "research") {
+        return rec.level > 0;
+      } else if (this.type === "hr") {
+        return rec.hired > 0;
+      }
+      return false;
+    };
+    upgrade.is_visible = function () {
+      return !this.used && this.hasReceiver() && lab.money >= this.cost * .9;
+    };
+    upgrade.is_available = function () {
+      return !this.used && this.hasReceiver() && lab.money >= this.cost;
+    };
+    upgrade.buy = function () {
+      if (!this.used && lab.buy(this.cost)) {
+        this.used = true;
+        var rec = this.getReceiver();
+        if (rec) {
+          rec[this.property] = rec[this.property] * this.factor + this.constant;
+        }
+      }
+    };
+  });
+

  var app = angular.module('particleClicker', []);

@@ -97,8 +146,7 @@

  app.controller('DetectorController', function () {
    this.click = function () {
-      lab.acquire(1);
-
+      lab.acquire(lab.detector.rate);
      detector.addEvent();
    };
  });
@@ -122,6 +170,10 @@
  app.controller('HRController', function () {
    this.workers = workers;
  });
+
+  app.controller('UpgradesController', function () {
+    this.upgrades = upgrades;
+  });
 })();


@@ -2,12 +2,13 @@
  {
    "name": "Free beer",
    "description": "The work is easier when the worker is happy.",
-    "type": "hr", // "hr" || "detector" || "research"
-    "reciever": "PhD Students", // name of the object
    "cost": 100,
    "used": false,
+    "type": "hr",
+    "receiver": "PhD Students",
+    "property": "rate",
    "factor": 1.2,
    "constant": 0,
-   //"image":
+    "image": "assets/beer.png"
  }
-}
+]