Ember nice to know

# ROUTER
GWS.Router.map (match) ->
  #match("/").to("home") # home.handlebars gets rendered automatically and mapped to /


# according to guide the previous logic shouldn't be needed. but it won't work without it
# you can either use model: () -> or
# setupController: (controller, model) ->
#   controller.set 'content', model

#
#
How to find a model by any attribute in Ember.js
https://gist.github.com/4ecdd3b21853391f1b97
#
#
Q: progressbar
A:
App.ProgressView = Ember.View.extend({
  percentChanged: function() {
    percentString = (this.get('controller.percentComplete') + "%");
    this.$('.bar').css('width', percentString);
  }.observes('controller.percentComplete')
});
#
#
cut and paste
https://github.com/emberjs/ember.js/commit/4a5ba408aa5f3ac1d40b53e8fe157ba295885e1e
#
#
BREAKING CHANGE to router events signature
https://github.com/emberjs/ember.js/commit/6dab9beccf4a2ae700633dfd4811018e0bea5028
#
#
http://stackoverflow.com/questions/14305255/ember-automatically-redirect-to-firstobject
  
redirect: ->
setupControllers: ->
  doctor = @modelFor('doctors').get('firstObject');

#
#
{{each controller itemViewClass="App.FooView" tagName="ul"}} 
#
#
getting all templates
Ember.TEMPLATES
#
#
https://github.com/emberjs/ember.js/issues/1747
automatically render sidebar.handlebar into html
{{render sidebar}}

{{render sidebar}} -> App.SidebarController
{{render "song" song}}
This example will render the song template with an instance of App.SongController and App.SongView. It will set the song controller's model to the value of song in the current context.


{{template sidebar}} -> uses the current context/controller
{{render "search"}}
it will lookup the searchController, then instantiate a SearchView and connect them.

{{partial sidebar}}
https://peepcode.com/system/uploads/2013/peepcode-emberjs-partial.png

https://github.com/emberjs/ember.js/commit/015138ea569725811b43e0fd851dfd0c08446890
#
#
Add `action` support to Ember.TextField,
The action to be sent when the user presses the return key.
https://github.com/emberjs/ember.js/commit/da4aa8531f337811c69e86300d81352fc1dab241
#
#
sortable-collection-view.js.coffee
https://gist.github.com/4536276
#
#
http://stackoverflow.com/questions/14349485/ember-js-router-v2-and-injected-controllers
#
#
http://stackoverflow.com/questions/14313295/using-a-non-id-dynamic-parameter-with-the-ember-router-v2
model: (params) -> # deserialize
serialize
#
#
The two possible values of embedded are:

load: The child records are embedded when loading, but should be saved as standalone records. In order for this to work, the child records must have an ID.

always: The child records are embedded when loading, and are saved embedded in the same record. This, of course, affects the dirtiness of the records (if the child record changes, the adapter will mark the parent record as dirty).

http://stackoverflow.com/questions/14320925/how-to-make-embedded-hasmany-relationships-work-with-ember-data
#
#
Added failing tests for saving embedded records
https://github.com/emberjs/data/pull/578
#
#

#
#
App.ClientRoute = Ember.Route.extend
  # default:
  # model: (params) -> # deserialize
  #   App.Client.find params.cĺient_id
#
#
Router
We don't necessarly need Views an Controllers!
when we have templates named like clients.handlebars, client.handlebars, ...
Router will instantiate them for us
#
#
serialize: (model) ->
  console.log 'serialize', model, model.get('lastName'), model.id
  # this will make the URL `/clients/tom_dale`
  client_id: model.get('firstName') + '_' + model.get('lastName')
#
#
Q: what is the needs api
A:
http://darthdeus.github.com/blog/2013/01/27/controllers-needs-explained/
http://www.kaspertidemann.com/simple-example-of-the-needs-api-in-ember-js/
http://www.kaspertidemann.com/auto-synthesized-controllers-when-using-the-needs-api-in-ember-js/

https://github.com/emberjs/ember.js/pull/1731

App.ApplicationController = Ember.Controller.extend
  needs: ['currentUser', 'users']
  #needs: 'users'

you can now access it via:
{{controllers.currentUser.content}}
#
#
App.container was not meant to be a public API
It appears that people are starting to use
App.container.lookup as the public API for
globally getting other controllers outside of the
router or other controllers.

This was not intended to be a public API.

Instead, you should trigger events on a route
(or a parent route), which have access to
`this.controllerFor`.

Example:

    App.ApplicationRoute.extend({
      events: {
        search: function(term) {
          this.controllerFor('search')
            .set('term', term);
        }
      }
    });

    App.SearchField = Ember.TextField.extend({
      insertNewline: function() {
        var term = this.get('value'),
            controller = this.get('controller');

        controller.send('search', term);
        this.set('value', '');
      }
    });

Events sent to the controller will bubble up to
the current route, and then up the route hierarchy
#
#
active item in list
http://jsbin.com/olovun/12/edit

App.NavView = Ember.View.extend({
  tagName: 'li',
  classNameBindings: ['active'],

  activeBinding: 'childViews.firstObject.active'
});

we are going to add an {{activeWhen}} helper and it will make this whole thing a lot easier
https://github.com/emberjs/ember.js/issues/1822

#
#
https://github.com/emberjs/ember.js/commit/b2e82aecf22c2654eb6e6894f5a0b82e2adfe5ed
https://github.com/emberjs/ember.js/blob/master/packages/ember/tests/helpers/link_to_test.js#L249

Support string literals as param for {{linkTo}}
useful for filtering
{{#linkTo posts "all"}}All Posts{{/linkTo}}
{{#linkTo posts "popular"}}Popular{{/linkTo}}
this.route('posts', { path: '/posts/:filter' });

{{#linkTo client client classBinding="client.selected" href=false tagName="article"}}
#
#
ember pre4 fiddle
http://jsfiddle.net/sSdHm/
older but on maybe sexier jsbin
http://jsbin.com/olovun/12/edit
#
#
get location / routerName

from router:
console.log @routeName, @get('router.location.location.hash')

from controller:
console.log @get('target.location.location.hash')
#
#
creating gifs from video
http://schneems.com/post/41104255619/use-gifs-in-your-pull-request-for-good-not-evil
#
#
Q: How can I redirect to a route from within a controller?
A: @transitionToRoute('clients')
#
#
Q: can anyone tell me how I can update a var within the application template please?
A:
App.Whatever.Route = Ember.Route.extend
  setupController: (controller) ->
    applicationController = @controllerFor('application')
    applicationController.set 'title', 'new title'
#
#
Q: how can I call a method in the router from a controller
A:
App.WhateverController = Ember.ObjectController.extend
  setTitle: ->
    @send('setTitle', 'new title')
#
#
Q: how to set model in route
A:
model: -> @controllerFor("application").get("projects")
model: -> App.Client.find()
#
#
Q: ember-data error handling
A:
422 error marks the records as invalid
record.get('errors')
record.isValid => false

500 error marks the record as error
record.isError => true
#
#
Q: Can we listen to cut and paste event
A:
https://github.com/emberjs/ember.js/commit/4a5ba408aa5f3ac1d40b53e8fe157ba295885e1e
works on TextArea
cut: ->
paste :->
#
#
Q: can we use the router without changing the url?
A:
http://emberjs.com/guides/routing/specifying-the-location-api/
location: none
#
#
Q: what is {{debugger}}
A: Yes. The best way to do this from the javascript console is by using the handlebars {{debugger}} helper from your template. This will open the JS debug console in the context of your template.
#
#
Q: how to save a record

record.get('transaction').commit()

or if you want to save every dirty object in your app
record.get('store').commit()
#
@modelFor('clients.new').get('transaction').rollback()
#
#
http://stackoverflow.com/questions/14491347/accessing-the-model-from-the-template
{{content.id}} or {{content.nickname}}
it's a sign that you should change to an ObjectController. See EMBER GUIDES: REPRESENTING A SINGLE MODEL! for a more detailed explanation.
#
#
http://stackoverflow.com/questions/14495455/can-we-have-a-controller-for-the-child-item-view-specified-in-a-ember-collection
App.ProductsController = Ember.ArrayController.extend({
  ...
  itemController: 'Product',
  ...
});
#
#
Q: how do i get a controller or model
A:
@modelFor('clients.new')
@controllerFor('clients')
@controllerFor('clients.new')

@modelFor('client') only works if model is set on route!
#
#
App.PostRoute = App.Route.extend({
  renderTemplate: function() {
    this.render('myPost', {   // the template to render
      into: 'index',          // the template to render into
      outlet: 'detail',       // the name of the outlet in that template
      controller: 'blogPost'  // the controller to use for the template
    });
  }
});
#
#
Q: How to delete a model in the controller
A:
App.TodoController = Ember.ObjectController.extend
  todo = @get('model')
  todo.deleteRecord()
  todo.get('store').commit()
#
#
Q: How to filter elements on an arrayController
A:
App.TodosController = Ember.ArrayController.extend
  clearCompleted: ->
    completed = @filterProperty('isCompleted', true)
    completed.invoke('deleteRecord')
    # calls deleteRecord for every completed todo in completed array  
    @get('store').commit()
#
#
More information
http://darthdeus.github.com/