Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

States in Ember.js without using routes?

I am trying to understand whether States in Ember.js are only designed/assumed to be defined in a route manager, and whether routes are integral to Ember. Pretty much all of the guides I've seen seem to assume you want states and routes exactly matching.

I want to create states that are not dependent on routes, but just on the state of the application. For example, in an email client, I might have a state "userHasSpecifiedRecipient." Only if this state is true might I enable the message box of the form. But obviously I don't want the url to be:

myEmailClient.com#composingMessage_userHasSpecifiedRecipient_userIs... etc.

Are there examples of this?

Second question: Can I mix states that are coupled with routes and states that are not?

Finally: I saw some advice that recommended people use Ember's sproutcore-statechart addon if they want things like concurrent states. Is this still true?

like image 966
Sam Fen Avatar asked Jun 25 '12 16:06

Sam Fen


People also ask

How to generate route in ember?

Basic Routes. The map() method of your Ember application's router can be invoked to define URL mappings. When calling map() , you should pass a function that will be invoked with the value this set to an object which you can use to create routes.

What is route in Ember?

This is the core feature of the Ember. js. The router used for to translate URL into the series of templates and also it represents the state of an application. The Ember. js uses the HashChange event that helps to know change of route; this can be done by implementing HashLocation object.

What is outlet in Ember JS?

Here is the explanation: {{outlet}} -> This will provide a stub/hook/point into which you can render Components(Controller + View). One would use this with the render method of routes. In your case you will likely have a details route which could look like this.

What has to replaced with a more thorough implementation named Ember router?

Since then the StateManager has been replaced with a more thorough implementation named Ember Router.


2 Answers

In EmberJS, there is an implementation of a Finite State Machine, Ember.StateManager. The StateManager uses Ember.State to represent states in the state machine, which have enter and exit functions, etc. Have a look at Class: Ember.StateManager.

For an example that uses the StateManager, the Ember.View uses it to manage the different states of a View. Another example is Ember-Data, which uses a state manager to track the different states a record can have.

In order to make life easier and avoid boilerplate code, there is a Router implementation in the latest version of EmberJS, which is still very much a work-in-progress, with updates once or twice a week. You can find the latest on the GitHub downloads.

Ember.Router is the subclass of Ember.StateManager responsible for providing URL-based application state detection. The Ember.Router instance of an application detects the browser URL at application load time and attempts to match it to a specific application state. Additionally the router will update the URL to reflect an application's state changes over time. (JSDoc in Ember source)

Additionally, because the Ember.Router extends Ember.StateManager and Ember.Route extends Ember.State, these are interchangeable. In fact, just a day a go more support was made to support the mixture of states and routes, see Support basic States inside of Routes.

like image 132
Schmuli Avatar answered Sep 26 '22 00:09

Schmuli


You can change the routers location implementation to 'none' to disable this features. other methods are 'hash' or 'history' (with the current ember-latest.js on github).

https://github.com/joliss/ember.js/blob/50aff86ef5b6847108bc8c32364171815c230d36/packages/ember-application/lib/system/location.js

App.Router = Ember.Router.extend({
    location : Ember.Location.create({
        implementation : 'none'
    })
});
like image 42
Michael Alexander Freund Avatar answered Sep 24 '22 00:09

Michael Alexander Freund