Marionette.State

State based routing for MarionetteJS applications

class AbcStates extends Marionette.AppStates

    appStates :
        'login' : true
        'noAccess' :
            url : '/noaccess'
        'access' :
            url : '/access/:id'
        'child1' :
            parent : 'access'
        'child2' :
            parent : 'access'


class LoginView extends Marionette.ItemView
    template : '#login-template'

class window.LoginCtrl extends Marionette.RegionController
    initialize : ->
        @show new LoginView

class NoAccessView extends Marionette.ItemView
    template : '#no-access-template'

class window.NoAccessCtrl extends Marionette.RegionController
    initialize : ->
        @show new NoAccessView

class AccessView extends Marionette.LayoutView
    template : '#access-template'

class window.AccessCtrl extends Marionette.RegionController
    initialize : (options)->
        @show new AccessView

class ChildView1 extends Marionette.ItemView
    template : '<h1>Child1 view here</h1>
                <a href="/#/access/23/child2">Goto Child 2</a>
                <a href="#/login" class="btn btn-success">Login  </a>'

class window.Child1Ctrl extends Marionette.RegionController
    initialize : ->
        @show new ChildView1

class ChildView2 extends Marionette.ItemView
    template : '<h1>Child2 view here</h1>
                <a href="/#/access/24/child1">Goto Child 1</a>
                <a href="#/login" class="btn btn-success">Login  </a>'

class window.Child2Ctrl extends Marionette.RegionController
    initialize : ->
        @show new ChildView2

window.App =  new Marionette.Application

App.addInitializer ->
    router = new AbcStates app : App
    Backbone.history.start()
    router.navigate '#/access/23/child2', true

App.start()