How to expand namespaces with EmberJS

Question

I have been programming in Javascript for a while. I recently made a rather large jQuery project and applied a module template as described in this wonderful article: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

Everything went fine, and the dandy, and the code looks smooth and manageable, but I felt it could be better. I spent this day looking for some Javascript frameworks, mainly those that:

• UI Binding Support
• You have a template system
• May work with jQuery
• Help me organize my code in the same way as with the module template

I came across frameworks like AngularJS, KnockOutJS, SpineJS, JavascriptMVC etc. The one that really stuck out - and was praised - was EmberJS.

I decided to do it, but it was not easy. The availability of tutorials for EmberJS is very limited. After a long downtime, I managed to run something, and I like what EmberJS does! There is only one thing that I seem to be unable to understand - this is also my question: How can I expand the Ember namespace (made using Ember.Application.create)?

To clarify: In the old version of my project, there was a Core namespace and a Util namespace. Both contain their respective functions that all other classes can use. How can I have a Core and Util namespace with functions on top of the original namespace?

I just do:

MyNamespace = Ember.Application.create(); MyNamespace.Core = Ember.Application.create(); MyNamespace.Util = Ember.Application.create(); 

Or something else?

Answer 1

You cannot Ember.Namespace (where Ember.Application is a subclass of Ember.Namespace ), see question # 683 .

Tome Dale, one of the key contributors, added an interesting answer about building complex applications, see comment .

That way you can just use App = Ember.Application.create() and create your controllers, views, etc. in this namespace. Or you can - if you intend to reuse any code in other projects / applications - split the namespace as follows:

 Util = Ember.Namespace.create({ importantNames: 'Einstein'.w() }); Core = Ember.Namespace.create({ sqrt: function(x) { return Math.sqrt(x); } }); App = Ember.Application.create(); ... App.myListController = Ember.Object.create({ importantNamesBinding: 'Core.importantNames', sqrtBinding: 'Util.sqrt' }); 

An Ember.Application extends Ember.Namespace and adds event handling functions (click, ...). This material is useful when you are writing an application with views - you will not need this material in your Core and Util namespace, so this is just Ember.Namespace .