rentalUnitController

gistfile1.txt

ScHerestay.rentalUnitController = SC.ObjectController.create({
   contentBinding: SC.Binding.single('ScHerestay.rentalUnitsController.selection')
});

main_page.js

ScHerestay.mainPage = SC.Page.design({

  // The main pane is made visible on screen as soon as your app is loaded.
  // Add childViews to this pane for views to display immediately on page 
  // load.
  mainPane: SC.MainPane.design({
    childViews: 'someView'.w(),
    
    someView: 'your main view',

    myContainerView: 'the container view',

    alternateView: ScHerestay.showRentalUnit.create()
  })

});

rentalUnit's list

sc_require('views/rental_units/show'); 
sc_require('views/rental_units/unit_row'); 
//Без sc_require ScHerestay.UnitRow и прочие объявляется после ScHerestay.RentalUnitsIndex и вызывает ошибку 'Cannot call method 'create' of undefined'
ScHerestay.RentalUnitsIndex = SC.View.extend({
  childViews: 'list'.w(),

  list: SC.ContainerView.design({
    layout: {top: 0, left: 0, right: 0, bottom: 0},
    isContainerView: YES,
    //Список всех RentalUnit
    contentView: SC.ScrollView.design({
      layout: {top: 15, bottom: 0, left: 2, right: 2},
      contentView: SC.ListView.design({
        contentBinding: SC.Binding.oneWay('ScHerestay.rentalUnitsController.content'),
        selectionBinding: 'ScHerestay.rentalUnitsController.selection',
        exampleView: ScHerestay.UnitRow,
        rowSpacing: 10,
        rowHeight: 160
      }),
    }),
    //Вывод одного RentalUnit
    alternateView: ScHerestay.RentalUnitShow
  })
});

statechart

ScHerestay.Statechart = SC.Statechart.create({
      
        rootState: SC.State.design({
      
          initialSubstate: 'primaryState',
        
          primaryState: SC.State.design({
            enterState: function() {
              ScHerestay.getPath('mainPage.mainPane').append();
            },
            exitState: function() {
            },
            switchViews: function() {
              this.gotoState('rentalUnitShow');
            }
          }),
        
          rentalUnitShow: SC.State.design({
            enterState: function() {
               // option 1
               var containerView = ScHerestay.getPath('mainPage.mainPane.myContainerView');
               var detailView = ScHerestay.getPath('mainPage.mainPane.alternateView');
               containerView.set('nowShowing',detailView');
               // option 2
               var detailView = ScHerestay.getPath('mainPage.mainPane.alternateView');
               detailView.append();
            },
            exitState: function() {
              var detailView = ScHerestay.getPath('mainPage.mainPane.alternateView');
              detailView.remove();
            }
          })
        })
})

unitRow

ScHerestay.UnitRow = SC.View.extend({
    childViews: 'addressLabel avaibleButton descriptionText contactButton thumbImage fbNameLabel sleepsLabel sleepsCount priceLabel shareButton'.w(),
        mouseDown: function(event) {
      var target = event.target;
      var classes = target.className;
      if (classes.match(/address/)) {
        this.parentView.set('selection',this.get('content'));
        ScHerestay.Statechart.invokeStateMethod('switchViews');
      }
    },
    
    addressLabel: SC.LabelView.design({
      layout: {left: 110, top: 0, height: 19},
      classNames: ['address'],
      valueBinding: ".parentView.content.address"  //Берёт content у родительского view
    }),