I create can.Observe when application starts. This observe is then passed to each can.Control (widget) which I create. Each widget can listen to observe changes and it can also set new values.
On http://skypicker.com/ I currently have 7 can.Control (search form, map, results, departure, return, map zoom and common). If I omit i.e. map control, the application can still work.
I don't like to use can.route because of !# in url and instead of that I use html5 history api. When application starts I can parse the url and initialize that can.Observe with initial values.
- this.filter = new can.Observe({
- from: { // start destination
- id: null, // id of currently selected destination
- type: null // type of current destination (city, airport, country)
- },
- to: { // end destination
- id: null, // id of currently selected destination
- type: null // type of current destination (city, airport, country)
- },
- date: { ... }
- });
- // create module which handles form filter
- Skypicker.Form = new Form('#form', {
- filter: filter
- });
- // create module which handles map
- Skypicker.Map = new Map('#map_canvas', {
- filter: filter,
- ...
- });