Exercise Intro - helpers

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

helpers.placeholder-url.js

import Ember from 'ember';
/**
 * We have a need for placeholder images in our
 * app, and it would be great to have a helper
 * that consistently builds URLs for us of the form
 * 
 *   http://placecorgi.com/260/180
 *   http://placekitten.com/260/180
 * 
 * In this case, 260 would be the width, and
 * 180 the height. The API we're looking for is
 * 
 *   {{placeholder-url w=260 h=180}}
 * 
 * You may pick either placecorgi or placekitten,
 * and if you're really clever you can use one
 * as a default, and allow the user to optionally
 * use the other.
 * 
 * REQIUREMENTS:
 * 
 * - Specifying width and/or height is optional,
 *      where 120px is used for default height,
 *      100px default width.
 * - Minimum allowable width and height is 10px.
 *      If anything less than this is specified
 *      for either dimension, use 10px in its place.
 */
export function placeholderUrl(params, hash) {
  return 'TODO';
}

export default Ember.Helper.helper(placeholderUrl);

templates.application.hbs

<h1>Test your placeholder-url here</h1>

URL: <code>{{placeholder-url w=301 h=591}}</code>

<p>
Image:
<img src={{placeholder-url w=321 h=333}} />
</p>

tests.helpers.destroy-app.js

import Ember from 'ember';

export default function destroyApp(application) {
  Ember.run(application, 'destroy');
}

tests.helpers.resolver.js

import Resolver from '../../resolver';
import config from '../../config/environment';

const resolver = Resolver.create();

resolver.namespace = {
  modulePrefix: config.modulePrefix,
  podModulePrefix: config.podModulePrefix
};

export default resolver;

tests.helpers.start-app.js

import Ember from 'ember';
import Application from '../../app';
import config from '../../config/environment';

const { run } = Ember;
const assign = Ember.assign || Ember.merge;

export default function startApp(attrs) {
  let application;

  let attributes = assign({rootElement: "#test-root"}, config.APP);
  attributes = assign(attributes, attrs); // use defaults, but you can override;

  run(() => {
    application = Application.create(attributes);
    application.setupForTesting();
    application.injectTestHelpers();
  });

  return application;
}

tests.test-helper.js

import Application from '../app';
import config from '../config/environment';
import { setApplication } from '@ember/test-helpers';
import { start } from 'ember-qunit';
import { assign } from '@ember/polyfills';

let attributes = assign({ rootElement: '#main' }, config.APP);
setApplication(Application.create(attributes));

start();

tests.unit.helpers.placeholder-url-test.js

import { module, test } from 'qunit';
import {placeholderUrl} from '../../../helpers/placeholder-url';

module('placeholder-url helper');

// Replace this with your real tests.
test('conventional usage', function(assert) {
  let result = placeholderUrl([], {w: 300, h: 302});
  assert.equal(result, 'http://placekitten.com/300/302', 'w=300, h=302 --> http://placekitten.com/300/302');
});

test('in absense of a dimension, falls back to reasonable values', function(assert) {
  assert.equal(placeholderUrl([], {w: 300}), 'http://placekitten.com/300/120', 'w=300 --> http://placekitten.com/300/120 (120 as default height)');
  assert.equal(placeholderUrl([], {h: 300}), 'http://placekitten.com/100/300', 'h=300 --> http://placekitten.com/100/300 (100 as default width)');
});

test('Enforces minimum dimensions of 10', function(assert) {
  assert.equal(placeholderUrl([], {w: 2}), 'http://placekitten.com/10/120', 'w=2 results in a 10px wide placeholder image');
  assert.equal(placeholderUrl([], {h: 1}), 'http://placekitten.com/100/10', 'h=2 results in a 10px high placeholder image');
});

test('Falls back to default in the absence of options entirely', function(assert) {
  assert.equal(placeholderUrl(), 'http://placekitten.com/100/120', 'if hash is undefined, falls back to 100x120');
});

twiddle.json

{
  "version": "0.12.1",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": true
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"
  },
  "addons": {
    "ember-source": "3.4.0",
    "ember-data": "3.4.0",
    "ember-cli-htmlbars": "2.0.3",
    "ember-cli-htmlbars-inline-precompile": "1.0.2"
  }
}