gistfile1.txt

categories controller:

/*globals PhoneControls */

/** @class
  @extends SC.CategoriesController
*/

PhoneControls.groups = [
    SC.Object.create({
        name: "Controls",
        categories: [
            SC.Object.create({
                subcategories: [],
                name: "Buttons",
                show: "buttons_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Checkboxes",
                show: "checkboxes_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Progress",
                show: "progress_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Radio",
                show: "radio_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Segmented Button",
                show: "segmented_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Select Button",
                show: "select_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Sliders",
                show: "sliders_page"
                }),
            SC.Object.create({
                subcategories: [],
                name: "Tabbed View",
                show: "tab_page"
                })
        ]
    }),

    SC.Object.create({
        name: "Collections",
        categories: [
            SC.Object.create({
                subcategories: [],
                name: "List",
                show: "list_page"
            })
        ]
    }),
      
    SC.Object.create({
        name: "Fields",
        categories: [
            SC.Object.create({
                subcategories: [],
                name: "Text Field",
                show: "text_field_page"
            })
        ]
    }),
      
    SC.Object.create({
        name: "Layout",
        categories: [
            SC.Object.create({
                name: "Flow Layout",
                subcategories: [
                    SC.Object.create({
                        name: "Flow Layout Horizontal",
                        show: "flow_layout_horizontal"
                    }),
                    SC.Object.create({
                        name: "Flow Layout Vertical, Wrap",
                        show: "flow_layout_vertical_wrap"
                    }),
                    SC.Object.create({
                        name: "Flow Layout Vercial, No Wrap",
                        show: "flow_layout_vertical_no_wrap"
                    }),
                ]
            }),
        ]
    }),
      
    SC.Object.create({
        name: "Scroll",
        categories: [
            SC.Object.create({
                subcategories: [],
                name: "Simple",
                show: "scroll_page"
            })
        ]
    }),
]
      
PhoneControls.groupsController = SC.ArrayController.create({
});
    
PhoneControls.groupController = SC.ObjectController.create({
    contentBinding: "PhoneControls.groupsController.selection",
    contentBindingDefault: SC.Binding.single()
});
 
PhoneControls.categoriesController = SC.ArrayController.create({
    contentBinding: "PhoneControls.groupController.categories",
});
 
PhoneControls.categoryController = SC.ObjectController.create({
    contentBinding: "PhoneControls.categoriesController.selection",
    contentBindingDefault: SC.Binding.single(),
});
 
PhoneControls.subcategoriesController = SC.ArrayController.create({
    contentBinding: "PhoneControls.categoryController.subcategories"
});

categories_list.js

  1 /*globals PhoneControls */                                                                                                                                                                                                                                                
  2 PhoneControls.CategoriesList = SC.ScrollView.design({
  3     topToolbar: SC.NavigationBarView.design({
  4         layout: { top: 0, left: 0, right: 0, height: 32 },
  5         childViews: "label back".w(),
  6         back: SC.ButtonView.design({
  7             title: "Group",
  8             theme: "point-left",
  9             action: "back",
 10             isSwipeLeft: YES,
 11             layout: {left: 7, centerY: 0, height: 44, width: 80 },
 12             controlSize: SC.HUGE_CONTROL_SIZE
 13             }),
 14 
 15         label: SC.LabelView.design({
 16             textAlign: SC.ALIGN_CENTER,
 17             layout: { left: 30, centerY: 0, height: 20, right: 10 },
 18             valueBinding: "PhoneControls.categoryController", <-- something works here?
 19             classNames: "embossed".w()
 20             })
 21         }),
 22 
 23     classNames: ["sc-source-list-background"],
 24     contentView: SC.SourceListView.design({
 25         layout: { left: 0, top: 0, right: 0, bottom: 0 },
 26         contentValueKey: "name",
 27         contentBinding: "PhoneControls.categoriesController.arrangedObjects",
 28         selectionBinding: "PhoneControls.categoriesController.selection",
 29         actOnSelect: YES,
 30         action: "categorySelect"
 31         })
 32     });
~