New Twiddle

01_README.md

This serves as a base canary gist for @rwjblue.

A few useful links for the main source/gist are:

• View Twiddle
• Copy Twiddle
• View Gist

application.route.js

import Ember from 'ember';
import log from '../utils/log';

export default Ember.Route.extend({
  actions: {
    error: function(error) {
      log(error.message);
    },
    
    updateFooBar() {
      log(...arguments);
    }
  }
});

application.template.hbs

<h1>rwjblue's Ember Twiddle</h1>

{{outlet}}

{{foo-bar update=(route-action 'updateFooBar' 'hi!')}}

<pre id="logs"></pre>

foo-bar.component.js

import Ember from 'ember';

export default Ember.Component.extend({
});

foo-bar.template.hbs

<button {{action attrs.update}}>Update!</button>

helpers.route-action.js

import Ember from 'ember';

export default Ember.Helper.extend({
  init() {
   	this._super(...arguments);
    this.router = this.container.lookup('router:main');
  },
  
  compute(params) {
    let router = this.router;
    
    return function() {
      router.send(...params);
    }
  }
});

twiddle.json

{
  "version": "0.4.13",
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "http://builds.emberjs.com/canary/ember.debug.js",
    "ember-template-compiler": "http://builds.emberjs.com/canary/ember-template-compiler.js"
  }
}

utils.log.js

import Ember from 'ember';

Ember.onerror = function(error) {
  log(error.stack);
};

export default function log(...args) {
  let msg = args.join(' ');
  let logs = document.getElementById('logs');
  
  logs.insertBefore(
    document.createTextNode("\n" + msg),
    logs.firstChild
  );
}