TestApp.applicationMenu = SC.Object.create({

  statechart: Ki.Statechart.create({

    rootState: Ki.State.design({

      initialSubstate: 'applicationMenuNotShowing',

      applicationMenuNotShowing: Ki.State.design({

        /** Actions */

        showSwitcher: function() {
          this.gotoState('applicationMenuShowing');
        }

      }),

      applicationMenuShowing: Ki.State.design({

        enterState: function() {
          TestApp.applicationMenu.getPath('page.menuPane').append();
        },

        exitState: function() {
          TestApp.applicationMenu.getPath('page.menuPane').remove();
        },

        /** Actions */

        showFirstModule: function() {
          TestApp.statechart.sendEvent('activateFirstModule');
          this.gotoState('applicationMenuNotShowing');
        },

        showSecondModule: function() {
          TestApp.statechart.sendEvent('activateSecondModule');
          this.gotoState('applicationMenuNotShowing');
        },

        showThirdModule: function() {
          TestApp.statechart.sendEvent('activateThirdModule');
          this.gotoState('applicationMenuNotShowing');
        }
      })

    })

  }),  // statechart


  page: SC.Page.design({

    menuPane: SC.PanelPane.design({

      defaultResponder: 'TestApp.applicationMenu.statechart',

      layout: { centerX: 0, centerY: 0, height: 100, width: 400 },
      contentView: SC.View.extend({
        childViews: "first second third".w(),

        first: SC.ButtonView.design({
          layout: { centerX: -110, centerY: 0, height: 25, width: 100 },
          title: "First Module",
          action: "showFirstModule"
        }),

        second: SC.ButtonView.design({
          layout: { centerX: 0, centerY: 0, height: 25, width: 100 },
          title: "Second Module",
          action: "showSecondModule"
        }),

        third: SC.ButtonView.design({
          layout: { centerX: 110, centerY: 0, height: 25, width: 100 },
          title: "Third Module",
          action: "showThirdModule"
        })
      })
    })

  })  // page

});