SC 1.x routing / statechart example

core.js

TestApp = SC.Application.create(

  /**
    Invoked when route change has been detected
  */
  routeDidChange: function(params) {

    if (!params.target) return NO;
    params = SC.clone(params);

    SC.Logger.log('TestApp.routeDidChange: ' + SC.inspect(params));

    this.set('route', params);
    this.set('routePending', YES);

    // falls back to Test.READY state
    this.invokeLater(function() {
      this.statechart.sendEvent('route', this, params);
    });

    return YES;
  }

});

// Default Route handler
SC.routes.add('*target', TestApp, TestApp.routeDidChange);

statechart.js

/**
  Routes -> statechart mapping
 */
TestApp.routes = SC.Set.create();
TestApp.routes.add({ path: 'signup', state: 'stateSignup' });
TestApp.routes.add({ path: 'list', state: 'stateTestList' });
TestApp.routes.add({ path: 'details', state: 'stateTestDetails' });

TestApp.statechart = SC.Responder.extend(Ki.StatechartManager, {

  rootState: Ki.State.design({

    /** 
      Default Routing Logic
    */
    route: function(sender, params) {

      if (SC.none(params)) {
        var params = TestApp.get('route');
      }

      TestApp.set('routePending', null);

      var target = TestApp.routes.findProperty('path', params.target);
      if (!target) return NO;

      SC.Logger.log('route "%@" to state: %@'.fmt(params.target, target.state));

      TestApp.statechart.gotoState(target.state);
    }

  })

});