page.js

SC.page = SC.Page.create({
  size: { width: 800, height: 600 },
   
  marginInset: SC.View.create({
    outlets: ['projectNameLabel','appProjectDirLabel','projectAppsScroller','appNameLabel','appDirLabel','appFilesScroller'],
    
    layout: { x: 0, y: 0, width: 800, height: 600 },
    
    projectNameLabel: SC.LabelView.create({
      valueBinding: 'SC.IDE.projectController.name',
      
      layout: { x: 0, y: 0, width: 300, height: 30 },
      
      localize: false,
      escapeHTML: true,
      isEditable: false
    }),
    
    appProjectDirLabel: SC.LabelView.create({
      valueBinding: 'SC.IDE.projectController*directory.path',
      
      layout: { x: 0, y: 0, width: 300, height: 30 },
      
      localize: false,
      escapeHTML: true,
      isEditable: false
    }),
    
    projectAppsScroller: SC.ScrollView.create({
      outlets: ['projectAppsList'],
      
      layout: { x: 0, y: 0, width: 600, height: 100 },
      
      projectAppsList: SC.ListView.create({
        contentBinding: 'SC.IDE.appsController.arrangedObjects',
        selectionBinding: 'SC.IDE.appsController.selection',
        
        contentValueKey: 'name',
        isSelectable: true,
        hasContentBranch: false,
        acceptsFirstResponder: true,
        hasContentIcon: false
      })
    }),
    
    appNameLabel: SC.LabelView.create({
      valueBinding: 'SC.IDE.appController.name',
      
      layout: { x: 0, y: 0, width: 300, height: 30 },
      
      localize: false,
      escapeHTML: true,
      isEditable: true
    }),
    
    appDirLabel: SC.LabelView.create({
      valueBinding: 'SC.IDE.appController*directory.path',
      
      layout: { x: 0, y: 0, width: 300, height: 30 },
      
      localize: false,
      escapeHTML: true,
      isEditable: false
    }),
    
    appFilesScroller: SC.ScrollView.create({
      outlets: ['appFilesList'],
      
      layout: { x: 0, y: 0, width: 600, height: 100 },
      
      appFilesList: SC.ListView.create({
        contentBinding: 'SC.IDE.appsController.arrangedObjects',
        selectionBinding: 'SC.IDE.appsController.selection',
        
        contentValueKey: 'path',
        isSelectable: true,
        hasContentBranch: false,
        acceptsFirstResponder: true,
        hasContentIcon: false
      })
    })
  })
});