Comments on: Handling DOM Events With EmberJS Views And Controllers

By: sabithpocker

sabithpocker — Thu, 26 Jul 2012 23:28:00 +0000

http://www.wisdom.weizmann.ac.il/~dharel/SCANNED.PAPERS/Statecharts.pdf

By: dagda1

dagda1 — Thu, 01 Mar 2012 08:01:00 +0000

I just blogged about the state chart here http://www.thesoftwaresimpleton.com/blog/2012/02/28/statemachine/

By: Jeroen van Wissen

Jeroen van Wissen — Tue, 28 Feb 2012 06:31:00 +0000

And what about non-rails Ember apps? How do we put the handlebar templates in seperate files?

By: dagda1

dagda1 — Wed, 22 Feb 2012 16:51:00 +0000

I think the main difference between backbone and Ember is that backbone uses Dom events while Ember uses bindings.

A binding in Ember is anything with the binding suffix. For example, here is an example of one of my controllers:

https://gist.github.com/1885960

You can see that I am specifying a urlSearchBinding on line 11 which I can then reference in my template.

Here is the show template at the templateName path:

https://gist.github.com/1885979

I am referencing the urlSearchBinding on line 2 and on line 3, I am speciying the targetBinding as the view but I could very easily point to a controller or any object. For example in another template, I have the following Ember button:

{{#view Ember.Button targetBinding=”leads” action=”showMore” isVisibleBinding=”leads.showMoreIsVisible”}}Show More{{/view}}.

Bindings are the key difference between Ember and Backbone IMO.

The Ember runloop is also something to be aware of and caught me out at the start.

By: Derick Bailey

Derick Bailey — Wed, 22 Feb 2012 14:49:00 +0000

If rumor and speculation serve me right, I think “StateChart” is a leftover name from the original SproutCore.

This definitely looks like something I need to dig into. I’ve been trying to find good ways to handle workflow / state changes.

Thanks again! :)

By: dagda1

dagda1 — Wed, 22 Feb 2012 14:47:00 +0000

Another interesting plugin I have found for Ember is the Ember.StateChart
https://github.com/emberjs-addons/sproutcore-statechart, Whenever you switch states, you get some nice handlers for entering states (enterState) and exiting states (exitState).

Examples of switching states might be something simple like switching a tab control or another use case I found was to go from a non-streaming state to a streaming state via a websocket connection.

It is an interesting add on to the usual MVC paradigm. Still not sure why they called in StateChart instead of StateMachine.

By: dagda1

dagda1 — Wed, 22 Feb 2012 14:34:00 +0000

Yes, it is loaded via Ajax when you create the Enber app. I think when the Ember application object is created or maybe when the view is first referenced. They are loaded into the Ember.TEMPLATES collection.

You also need the following lines in a rails initializer:

require ‘sprockets/ember_handlebars’

Rails.application.assets.register_engine ‘hjs’, EmberHandlebars

By: Derick Bailey

Derick Bailey — Wed, 22 Feb 2012 14:21:00 +0000

Nice! I was going to look into separating the templates in to external files soon. Glad to know it’s that easy. :)

Am I correct in seeing that this gives you server side compilation of the template, which is going to improve the performance of the JS at runtime?

By: dagda1

dagda1 — Wed, 22 Feb 2012 14:18:00 +0000

A better way of defining templates is in separate files and then using the templateName attribute to point to that file, e.g:

templateName: ‘app/templates/url_search/show’

You can load the templates into the Ember templates collection by subclassing a Tilt::Template subclass like this:

https://gist.github.com/1780841