Merge branch 'master' of https://github.com/mattcreager/talks

pajacobs · Feb 11, 2014 · 47e8b71 · 47e8b71
2 parents 8beb58d + eccb1a4
commit 47e8b71
Show file tree

Hide file tree

Showing 23 changed files with 520 additions and 26 deletions.
diff --git a/realtime-angular-model/buildr/bower.json b/realtime-angular-model/buildr/bower.json
@@ -21,6 +21,7 @@
     "bootstrap": "~3.1.0",
     "lodash": "~2.4.1",
     "q": "~1.0.0",
-    "eventEmitter": "~4.2.7"
+    "eventEmitter": "~4.2.7",
+    "angular-truncate": "*"
   }
 }
diff --git a/realtime-angular-model/buildr/public/css/main.css b/realtime-angular-model/buildr/public/css/main.css
@@ -0,0 +1,27 @@
+* {
+  box-sizing: border-box;
+}
+
+.unit {
+  padding: 5px;
+  padding-left: 0;
+  padding-right: 0;
+  background: white;
+  color: black;
+  margin-bottom: 10px;
+}
+
+.unit-name {
+  font-size: 16px;
+  font-weight: bold;
+  padding-right: 5px;
+}
+
+.unit description {
+  display: block;
+  margin: 5px 0;
+}
+
+.roster-name {
+  color: green;
+}
diff --git a/realtime-angular-model/buildr/public/index.html b/realtime-angular-model/buildr/public/index.html
@@ -6,14 +6,63 @@
   <link rel="stylesheet" type="text/css" href="css/main.css">
 </head>
 <body>
-  <section class="container" ng-controller="UnitCtrl">
-    <h1>Welcome to Buildr!</h1>
-    <ul>
-      <li ng-repeat="unit in units">
-        {{ unit.name }} <a ng-click='unit.$remove()'>remove</a>
-      </li>
-    </ul>
-  </section>
+  <div class="container">
+    <h1>BUILD<span>R</span></h1>
+    <br>
+    <div class="inner-container row" ng-controller="RosterCtrl">
+      <section class="col-md-6">
+        <h3>Unit Selection</h3>
+        <br>
+
+        <div class="units" ng-controller="UnitCtrl">
+          <div ng-repeat="unit in units" class="unit row">
+            <img ng-src="{{unit.image}}" class="col-md-3">
+            <div class="col-md-9 unit-details">
+              <span class="label label-info pull-right">{{ unit.type }}</span>
+              <span class="unit-name">{{ unit.name }}</span>
+              <code>{{ unit.points }} points</code>
+              <description class="text-muted">{{ unit.description | words:15  }}</description>
+              <span class="unit-cost">{{ unit.cost | currency }}</span>
+              <div class="unit-actions btn-group pull-right">
+                <button ng-click="editUnit(unit)" type="button" class="btn btn-sm btn-info"><span class="glyphicon glyphicon-edit"></span></button>
+                <button ng-click="roster.$add(unit)" type="button" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-plus"></span></button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+      <section class="col-md-6">
+        <h3>Roster: <span class="roster-name">{{ roster.name }}</span></h3>
+        <br>
+        <p class="alert alert-sm alert-danger">Cheater, cheater, your army *should* <strong>not exceed 1000<strong> points!</p>
+        <table class="table">
+          <thead>
+            <tr>
+              <th>Name</th>
+              <th>Type</th>
+              <th>count</th>
+              <th>points</th>
+              <th></th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr ng-repeat="unit in roster.units">
+              <td><strong>{{ unit.name }}<strong></td>
+              <td><span class="label label-info">{{ unit.type }}</span></td>
+              <td>{{ unit.count }}</td>
+              <td><code>{{ unit.points }}</code></td>
+              <td>
+                <div class="unit-actions btn-group pull-right">
+                  <button ng-click="editUnit(unit)" type="button" class="btn btn-xs btn-info"><span class="glyphicon glyphicon-edit"></span></button>
+                  <button ng-click="roster.$remove(unit)" type="button" class="btn btn-xs btn-danger"><span class="glyphicon glyphicon-minus"></span></button>
+                </div>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </section>
+    </div>
+  </div>
 
   <!-- bower:js -->
   <script src="bower_components/jquery/jquery.js"></script>
@@ -22,6 +71,7 @@ <h1>Welcome to Buildr!</h1>
   <script src="bower_components/lodash/dist/lodash.compat.js"></script>
   <script src="bower_components/q/q.js"></script>
   <script src="bower_components/eventEmitter/EventEmitter.js"></script>
+  <script src="bower_components/angular-truncate/dist/angular-truncate.min.js"></script>
   <!-- endbower -->
 
   <script src="dpd.js"></script>
@@ -31,5 +81,10 @@ <h1>Welcome to Buildr!</h1>
   <script src="js/units/unit_service.js"></script>
   <script src="js/units/unit_model.js"></script>
   <script src="js/units/unit_controller.js"></script>
+
+  <!-- Rosters -->
+  <script src="js/rosters/roster_service.js"></script>
+  <script src="js/rosters/roster_model.js"></script>
+  <script src="js/rosters/roster_controller.js"></script>
 </body>
-</html>
+</html>
diff --git a/realtime-angular-model/buildr/public/js/main.js b/realtime-angular-model/buildr/public/js/main.js
@@ -1 +1,5 @@
-angular.module('Buildr', []);
+/* global angular */
+
+angular.module('Buildr', [
+  'truncate'
+]);
diff --git a/realtime-angular-model/buildr/public/js/rosters/roster_controller.js b/realtime-angular-model/buildr/public/js/rosters/roster_controller.js
@@ -0,0 +1,26 @@
+/* global angular */
+
+(function() {
+
+'use strict';
+
+angular
+.module('Buildr')
+.controller('RosterCtrl', ['$scope', 'rosterFactory', function($scope, rosterFactory) {
+  var roster_id = '8dc743a3af53d898';
+
+  rosterFactory
+    .get(roster_id)
+    .then(function(roster) {
+      $scope.roster = roster;
+
+      console.log($scope.roster);
+    }).finally($scope.$apply.bind($scope));
+
+  $scope.remove = function(roster) {
+    roster.$remove();
+  };
+}]);
+
+})();
+
diff --git a/realtime-angular-model/buildr/public/js/rosters/roster_model.js b/realtime-angular-model/buildr/public/js/rosters/roster_model.js
@@ -0,0 +1,74 @@
+/* global angular, EventEmitter, _ */
+
+(function() { 'use strict';
+
+angular
+.module('Buildr')
+.factory('rosterFactory', ['$timeout', 'rosterService', function($timeout, rosterService) {
+  return {
+    get: function(id) {
+      return rosterService.get(id).then(function(rosters) {
+        if (!_.isArray(rosters)) {
+          return new RosterModel($timeout, rosterService, rosters);
+        }
+
+        return _.map(rosters, function(roster) {
+          return new RosterModel($timeout, rosterService, roster);
+        });
+      });
+    }
+  };
+}]);
+
+function RosterModel($timeout, rosterService, roster) {
+  _.extend(this, {
+    $$service: rosterService,
+    $$timeout: $timeout
+  });
+
+  _.merge(this, roster);
+}
+
+RosterModel.prototype.$inc = function(unit) {
+  var self = this;
+
+  this.$$timeout(function() {
+    unit.count++;
+  });
+
+  return this.$$service.inc(this.id, unit.id);
+};
+
+RosterModel.prototype.$add = function(unit) {
+  var self = this;
+
+  if (_.find(this.units, { id: unit.id })) {
+    return this.$inc(unit);
+  }
+
+  this.$$timeout(function() {
+    self.units.push(unit);
+  });
+
+  return this.$$service.addUnit(this.id, {
+    unit_id: unit.id,
+    count: 1
+  });
+};
+
+RosterModel.prototype.$remove = function(unit) {
+  this.units.splice(this.units.indexOf(unit), 1);
+
+  var units = _.map(this.units, function(unit) {
+    return {
+      unit_id: unit.id,
+      count: unit.count
+    };
+  });
+
+  return this.$$service.removeUnit(this.id, units);
+};
+
+RosterModel.prototype.$$emitter = _.clone(EventEmitter.prototype);
+
+})();
diff --git a/realtime-angular-model/buildr/public/js/rosters/roster_service.js b/realtime-angular-model/buildr/public/js/rosters/roster_service.js
@@ -0,0 +1,76 @@
+/* global angular, Q, _, dpd */
+
+(function() { 'use strict';
+
+angular
+.module('Buildr')
+.factory('rosterService', ['$http', 'unitFactory', function($http, unitFactory) {
+  return new RosterService($http, unitFactory);
+}]);
+
+function RosterService($http, unitFactory) {
+  _.extend(this, {
+    $$http: $http,
+    $$unitFactory: unitFactory,
+    $$path: '/rosters'
+  });
+}
+
+RosterService.prototype.get = function(id) {
+  var self = this;
+  var deferred = Q.defer();
+  var path = id ? this.$$path + '/' + id : this.$$path;
+
+  this.$$http
+    .get(path)
+    .success(function(result) {
+      var units = _.map(result.units, function(unit) {
+        return self.$$unitFactory.get(unit.unit_id).then(function(unitModel) {
+          return _.merge(unitModel, unit);
+        });
+      });
+
+      Q.all(units).then(function(units) {
+        result.units = units;
+
+        deferred.resolve(result);
+      });
+    })
+    .error(deferred.reject);
+
+  return deferred.promise;
+};
+
+RosterService.prototype.addUnit = function(id, unitData) {
+  var deferred = Q.defer();
+
+  dpd.rosters.put(id, {
+     units: { $push: unitData }
+  }, function(result, err) {
+    if (!result) return deferred.reject(err);
+
+    deferred.resolve(result);
+  });
+
+  return deferred.promise;
+};
+
+RosterService.prototype.removeUnit = function(id, units) {
+  var deferred = Q.defer();
+
+  dpd.rosters.put(id, { units: units }, function(result, err) {
+    if (err) return deferred.reject(err);
+
+    deferred.resolve(result);
+  });
+
+  return deferred.promise;
+};
+
+RosterService.prototype.inc = function(id, unitId) {
+  dpd.rosters.put(id, { 'units.unit_id': unitId }, { $inc: { count: 1 } }, function(result, err) {
+    console.log(result, err);
+  });
+};
+
+})();
diff --git a/realtime-angular-model/buildr/public/js/units/unit_controller.js b/realtime-angular-model/buildr/public/js/units/unit_controller.js
@@ -7,15 +7,15 @@
 angular
 .module('Buildr')
 .controller('UnitCtrl', ['$scope', 'unitFactory', function($scope, unitFactory) {
-  unitFactory.get('366b4e0c43af3973').then(function(units) {
+  unitFactory.get().then(function(units) {
     $scope.units = units;
 
     console.log($scope.units);
   }).finally($scope.$apply.bind($scope));
 
   $scope.remove = function(unit) {
     unit.$remove();
-  }
+  };
 }]);
 
-})();
+})();
diff --git a/realtime-angular-model/buildr/public/js/units/unit_model.js b/realtime-angular-model/buildr/public/js/units/unit_model.js
@@ -8,7 +8,9 @@ angular
   return {
     get: function(id) {
       return unitService.get(id).then(function(units) {
-        units = _.isArray(units) ? units : [units];
+        if (!_.isArray(units)) {
+          return new UnitModel(unitService, units);
+        }
 
         return _.map(units, function(unit) {
           return new UnitModel(unitService, unit);
@@ -20,8 +22,7 @@ angular
 
 function UnitModel(unitService, unit) {
   _.extend(this, {
-    $$service: unitService,
-    $id: unit.id
+    $$service: unitService
   });
 
   _.merge(this, unit);
@@ -37,4 +38,4 @@ UnitModel.prototype.$remove = function() {
   console.log('remove me what?')
 }
 
-})();
+})();
diff --git a/realtime-angular-model/buildr/resources/rosters/config.json b/realtime-angular-model/buildr/resources/rosters/config.json
@@ -0,0 +1,21 @@
+{
+	"type": "Collection",
+	"properties": {
+		"name": {
+			"name": "name",
+			"type": "string",
+			"typeLabel": "string",
+			"required": true,
+			"id": "name",
+			"order": 0
+		},
+		"units": {
+			"name": "units",
+			"type": "array",
+			"typeLabel": "array",
+			"required": false,
+			"id": "units",
+			"order": 1
+		}
+	}
+}
diff --git a/realtime-angular-model/buildr/resources/rosters/put.js b/realtime-angular-model/buildr/resources/rosters/put.js
diff --git a/realtime-angular-model/img/angular-seed.png b/realtime-angular-model/img/angular-seed.png
diff --git a/realtime-angular-model/img/architecture.png b/realtime-angular-model/img/architecture.png
diff --git a/realtime-angular-model/img/onions.jpg b/realtime-angular-model/img/onions.jpg
diff --git a/realtime-angular-model/img/orc.jpg b/realtime-angular-model/img/orc.jpg
diff --git a/realtime-angular-model/img/servers.jpg b/realtime-angular-model/img/servers.jpg
diff --git a/realtime-angular-model/img/sf-logo.png b/realtime-angular-model/img/sf-logo.png
diff --git a/realtime-angular-model/img/sign_up.png b/realtime-angular-model/img/sign_up.png
diff --git a/realtime-angular-model/img/story_time.jpg b/realtime-angular-model/img/story_time.jpg
diff --git a/realtime-angular-model/img/tia.jpg b/realtime-angular-model/img/tia.jpg
diff --git a/realtime-angular-model/img/twitter_rt.png b/realtime-angular-model/img/twitter_rt.png
diff --git a/realtime-angular-model/img/unicorn.jpg b/realtime-angular-model/img/unicorn.jpg