feat: Adding pokemon to your gym

app/instance-initializers/load-gym.js

@@ -0,0 +1,11 @@
+export function initialize(appInstance) {
+  const container = appInstance.lookup ? appInstance : appInstance.container;
+  const store = container.lookup('service:store');
+  store.findAll('trainee');
+}
+
+export default {
+  after: 'ember-data',
+  name: 'load-gym',
+  initialize
+};

app/pods/components/pokemon-summary/component.js

@@ -1,5 +1,10 @@
 import Ember from 'ember';
 
 export default Ember.Component.extend({
-  classNames: ['pokemon-summary']
+  inGym: Ember.computed.alias('pokemon.inGym'),
+  actions: {
+    click() {
+      this.sendAction('click', this.get('pokemon'));
+    }
+  }
 });

app/pods/components/pokemon-summary/template.hbs

@@ -1,6 +1,8 @@
-<span class="pokemon-image">
-  <img src={{pokemon.imageUrl}} alt={{pokemon.name}}>
-</span>
-<h3 class="pokemon-name">
-  {{pokemon.name}}
-</h3>
+<div class="pokemon-summary {{if inGym 'in-gym'}}" onclick={{action 'click'}}>
+  <span class="pokemon-image">
+    <img src={{pokemon.imageUrl}} alt={{pokemon.name}}>
+  </span>
+  <h3 class="pokemon-name">
+    {{pokemon.name}}
+  </h3>
+</div>

app/pods/gym/route.js

@@ -0,0 +1,4 @@
+import Ember from 'ember';
+
+export default Ember.Route.extend({
+});

app/pods/gym/template.hbs

@@ -0,0 +1 @@
+{{outlet}}

app/pods/pokemon/model.js

@@ -8,5 +8,10 @@ export default DS.Model.extend({
   name: DS.attr('string'),
   imageUrl: Ember.computed('id', function() {
     return `http://pokeapi.co/media/sprites/pokemon/${this.get('id')}.png`;
+  }),
+  trainee: DS.belongsTo('trainee'),
+
+  inGym: Ember.computed('trainee.id', function() {
+    return Ember.isPresent(this.get('trainee.id'));
   })
 });

app/pods/pokemon/route.js

@@ -9,5 +9,20 @@ export default Ember.Route.extend({
 
   model(params) {
     return this.get('store').query('pokemon', params);
+  },
+
+  actions: {
+    toggleGym(pokemon) {
+      if(pokemon.get('inGym')) {
+        Ember.debug(`Removing ${pokemon.get('name')} from your gym.`);
+        this.get('store').find('trainee', pokemon.get('id')).then(trainee => {
+          trainee.destroyRecord();
+        });
+      } else {
+        Ember.debug(`Adding ${pokemon.get('name')} to your gym.`);
+        const trainee = this.get('store').createRecord('trainee', { id: pokemon.get('id'), pokemon: pokemon });
+        trainee.save();
+      }
+    }
   }
 });

app/pods/pokemon/template.hbs

@@ -2,7 +2,7 @@
 
 <ul>
   {{#each model as |pokemon|}}
-    <li>{{pokemon-summary pokemon=pokemon}}</li>
+    <li>{{pokemon-summary pokemon=pokemon click='toggleGym'}}</li>
   {{/each}}
 </ul>
 

app/pods/trainee/adapter.js

@@ -0,0 +1,8 @@
+import Ember from 'ember';
+import FirebaseAdapter from 'emberfire/adapters/firebase';
+
+const { inject } = Ember;
+
+export default FirebaseAdapter.extend({
+  firebase: inject.service(),
+});

app/pods/trainee/model.js

@@ -0,0 +1,5 @@
+import DS from 'ember-data';
+
+export default DS.Model.extend({
+  pokemon: DS.belongsTo('pokemon')
+});

app/router.js

@@ -7,6 +7,7 @@ const Router = Ember.Router.extend({
 
 Router.map(function() {
   this.route('pokemon', { path: '' });
+  this.route('gym');
 });
 
 export default Router;

app/styles/app.css

@@ -42,6 +42,12 @@ ul {
   justify-content: space-between;
   margin: 1em;
   box-shadow: 0.5em 0.5em #DE993A;
+  cursor: pointer;
+}
+
+.pokemon-summary.in-gym {
+  background: linear-gradient(#FFCB9D, #FFAD65);
+  border-color: #FFA04C;
 }
 
 .pokemon-image {

bower.json

@@ -4,6 +4,7 @@
     "ember": "~2.4.1",
     "ember-cli-shims": "0.1.0",
     "ember-cli-test-loader": "0.2.2",
-    "ember-qunit-notifications": "0.1.0"
+    "ember-qunit-notifications": "0.1.0",
+    "firebase": "^2.1.0"
   }
 }

config/environment.js

@@ -5,6 +5,8 @@ module.exports = function(environment) {
     modulePrefix: 'embermon',
     podModulePrefix: 'embermon/pods',
     environment: environment,
+    contentSecurityPolicy: { 'connect-src': "'self' https://auth.firebase.com wss://*.firebaseio.com" },
+    firebase: 'https://embermon.firebaseio.com/',
     baseURL: '/',
     locationType: 'auto',
     EmberENV: {

package.json

@@ -37,6 +37,7 @@
     "ember-export-application-global": "^1.0.4",
     "ember-load-initializers": "^0.5.0",
     "ember-resolver": "^2.0.3",
+    "emberfire": "1.6.6",
     "loader.js": "^4.0.0"
   }
 }

tests/unit/instance-initializers/load-gym-test.js

@@ -0,0 +1,25 @@
+import Ember from 'ember';
+import { initialize } from 'embermon/instance-initializers/load-gym';
+import { module, test } from 'qunit';
+import destroyApp from '../../helpers/destroy-app';
+
+module('Unit | Instance Initializer | load gym', {
+  beforeEach: function() {
+    Ember.run(() => {
+      this.application = Ember.Application.create();
+      this.appInstance = this.application.buildInstance();
+    });
+  },
+  afterEach: function() {
+    Ember.run(this.appInstance, 'destroy');
+    destroyApp(this.application);
+  }
+});
+
+// Replace this with your real tests.
+test('it works', function(assert) {
+  initialize(this.appInstance);
+
+  // you would normally confirm the results of the initializer here
+  assert.ok(true);
+});

tests/unit/pods/gym/route-test.js

@@ -0,0 +1,11 @@
+import { moduleFor, test } from 'ember-qunit';
+
+moduleFor('route:gym', 'Unit | Route | gym', {
+  // Specify the other units that are required for this test.
+  // needs: ['controller:foo']
+});
+
+test('it exists', function(assert) {
+  let route = this.subject();
+  assert.ok(route);
+});

tests/unit/pods/trainee/adapter-test.js

@@ -0,0 +1,12 @@
+import { moduleFor, test } from 'ember-qunit';
+
+moduleFor('adapter:trainee', 'Unit | Adapter | trainee', {
+  // Specify the other units that are required for this test.
+  // needs: ['serializer:foo']
+});
+
+// Replace this with your real tests.
+test('it exists', function(assert) {
+  let adapter = this.subject();
+  assert.ok(adapter);
+});

tests/unit/pods/trainee/model-test.js

@@ -0,0 +1,12 @@
+import { moduleForModel, test } from 'ember-qunit';
+
+moduleForModel('trainee', 'Unit | Model | trainee', {
+  // Specify the other units that are required for this test.
+  needs: []
+});
+
+test('it exists', function(assert) {
+  let model = this.subject();
+  // let store = this.store();
+  assert.ok(!!model);
+});