kgame

by kevmus

HTML

<body ng-app="incremental">
  <div ng-controller="IncCtrl">

    <h1>Energy: {{ether.amount}} {{ether.rate}}</h1>
    <table class="table" ng-repeat="manager in managers" id="{{manager.id}}">
      <tr>
        <th>{{manager.name}}</th>
      </tr>
      <tr ng-repeat="(key,ids) in manager.rows" id="{{manager.id}}_row_{{key}}">
        <td class='{{manager[id].color}}' ng-repeat="id in ids">
        
          {{manager[id].amount}} {{manager[id].name}}
        </td>
      </tr>
    </table>
  </div>
</body>

CSS

.green-0 { background-color: #267356 }	/* Main Primary background-color */
.green-1 { background-color: #3C403E }
.green-2 { background-color: #374E45 }
.green-3 { background-color: #008854 }
.green-4 { background-color: #009C61 }

.yellow-0 { background-color: #A4A938 }	/* Main Secondary background-color (1) */
.yellow-1 { background-color: #5E5E57 }
.yellow-2 { background-color: #717251 }
.yellow-3 { background-color: #C0C700 }
.yellow-4 { background-color: #FFFE20 }

.blue-0 { background-color: #403075 }	/* Main Secondary background-color (2) */
.blue-1 { background-color: #3E3D41 }
.blue-2 { background-color: #403B4F }
.blue-3 { background-color: #2A0C8A }
.blue-4 { background-color: #4DD0E1 }

.red-0 { background-color: #AA5C39 }	/* Main Complement background-color */
.red-1 { background-color: #5F5A58 }
.red-2 { background-color: #735C51 }
.red-3 { background-color: #C93F00 }
.red-4 { background-color: #E64800 }

</style> <!DOCTYPE html> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous" <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <meta name='viewport' content='initial-scale=1.0, width=device-width' /> <style type="text/css">

JavaScript

angular.module('incremental', [])
  .controller('IncCtrl', ['$scope', '$document', '$interval', function($scope, $document, $interval) {
		
    $scope.ether = {
      amount:0,
      rate:1
    };

    function update() {
      $scope.ether += 1;
    };

    $document.ready(function() {
      $interval(update, 1000);
    });
    /////////////////////////////////////////////////////
    class Category {
    	constructor(name, color) {
      	this.name = name;
        this.color = color;
      }
    }
    $scope.categories = {
      'quark': new Category('Quark', 'blue-4'),
      'lepton': new Category('Lepton', 'blue-4'),
      'hadron': new Category('Hadron', 'yellow-4'),
      'boson': new Category('Boson', 'red-4')
    }

		$scope.error = function(strings) {
      'use strict';
      // console.log("ERROR: ");
      for (let i = 0; i < strings.length; i += 1) {
        // console.log(strings[i]);
      }
      throw Object("threw up");
    };
    $scope.safe = function(obj, clazz) {
      'use strict';
      if (clazz) {
        if (obj instanceof clazz) {
          return obj;
        }
      }
      if (!(obj instanceof Object)) {
        return this.error(['object not defined']);
      } else {
        return obj;
      }
    };

    class Cost {
      constructor(item, amount) {
        this.id = item.id;
        this.amount = amount || 0;
      }
    }

    class Managed {
      constructor(name) {
        this.name = name;
        this.amount = 0;
        this.costs = [];
      }
      get id() {
        return this.name.toLowerCase().replace(' ', '_');
      }
      withCategory(category) {
        this.category = category;
        return this;
      }
			get color() {
      	return $scope.categories[this.category].color;
      }
      withCost(cost) {
        if ($scope.safe(cost, Cost)) {
          this.costs.push(cost);
        }
        return this;
      }
      inRow(row) {
        this.row = row;
        return this;
      }
    }

    class Item...