Objective-J Cappuccino want a list of buttons on main menu, when I click the panel refreshes with UI of button selected - cappuccino

Question

Dear all, I am new to objective-j/c and cappuccino not really sure how this all fits together.
The code below is taken from http://github.com/jfahrenkrug/CappuccinoLocations1
What I need to do is:
I need a landing main menu which is a CPView called ie MainView with five or so buttons, when you click on the LocationButton on MainView is replaces MainView by with LocationView, which displays the contents of jfahrenkrug's work. A similar effect will happen with each other button.
What is the correct Objective-c/j way of handling this approach?
#import <Foundation/CPObject.j>
#import "src/Location/LocationView.j"
#implementation AppController : CPObject
{
LocationView locationView;
}
- (void)applicationDidFinishLaunching:(CPNotification)aNotification
{
var theWindow = [[CPWindow alloc] initWithContentRect:CGRectMakeZero() styleMask:CPBorderlessBridgeWindowMask],
mainContentView = [theWindow locationView],
bounds = [locationView bounds];
[mainContentView setBackgroundColor:[CPColor colorWithRed:212.0 /255.0 green:221.0/ 255.0 blue:230.0/255.0 alpha:1.0]];
locationView = [[LocationView alloc] initWithFrame:CGRectMake(0,0,920.0,590.0)];
[locationView setCenter:[mainContentView center]];
[locationView setBackgroundColor:[CPColor whiteColor]]
[locationView setAutoresizingMask:CPViewMinXMargin | CPViewMaxXMargin | CPViewMinYMargin | CPViewMaxYMargin];
var shadow = [[CPShadowView alloc] initWithFrame:CGRectMakeZero()];
[shadow setFrameForContentFrame:[locationView frame]];
[shadow setAutoresizingMask:CPViewMinXMargin | CPViewMaxXMargin | CPViewMinYMargin | CPViewMaxYMargin];
[mainContentView addSubview:shadow];
[mainContentView addSubview:locationView];
[theWindow orderFront:self];
}
Now we have the locationView.j
#import "LocationsController.j"
#import "LocationListView.j"
#import "MapController.j"
#import "LocationsToolbar.j"
#import "LocationDetailView.j"
#import "LocationDetailController.j"
#implementation LocationView : CPView
{
LocationsController locationsController;
LocationListView locationListView;
MapController mapController;
MKMapView mapView;
CPTextField coordinatesLabel;
LocationsToolbar locationsToolbar;
LocationDetailView locationDetailView;
LocationDetailController locationDetailController;
CPTextField searchField;
// id delegate #accessors;
}
- (id)initWithFrame:(CGRect)aFrame
{
self = [super initWithFrame:aFrame];
if(self){
locationsController = [[LocationsController alloc] init];
[locationsController loadExampleLocations];
locationListView = [[LocationListView alloc] initWithFrame:CGRectMake(0.0,0.0,226.0,400.0)];
[locationListView setContent:[locationsController locations]];
[locationListView setDelegate:locationsController];
[locationsController setLocationListView:locationListView];
var locationScrollView = [[CPScrollView alloc] initWithFrame:CGRectMake(10.0,65.0,243.0,400.0)];
[locationScrollView setDocumentView:locationListView];
[locationScrollView setAutohidesScrollers:YES];
[[locationScrollView self] setBackgroundColor:[CPColor whiteColor]];
[self addSubview:locationScrollView];
mapController = [[MapController alloc] init];
mapView = [[MKMapView alloc] initWithFrame:CGRectMake(510,65,400,400) apiKey:'' ];
[mapView setDelegate:self];
mapController.mapView = mapView;
[self addSubview:mapView];
coordinatesLabel = [[CPTextField alloc] initWithFrame:CGRectMake(510,465,200,35)];
[coordinatesLabel setTextColor:[CPColor colorWithHexString:#"009900"]];
[coordinatesLabel setFont:[CPFont systemFontOfSize:14.0]];
[coordinatesLabel setEditable:NO];
[coordinatesLabel setStringValue:#"-/-"];
[mapController setCoordinatesLabel:coordinatesLabel];
[self addSubview:coordinatesLabel];
locationsToolbar = [[LocationsToolbar alloc] initWithFrame:CGRectMake(10.0,467.0,226.0,25.0)];
[locationsToolbar setDelegate:locationsController];
[self addSubview:locationsToolbar];
locationDetailController = [[LocationDetailController alloc] init];
locationDetailController.mapController = mapController;
locationsController.locationDetailController = locationDetailController;
[mapController setDelegate:locationDetailController];
locationDetailView = [[LocationDetailView alloc] initWithFrame:CGRectMake(510,490,400,90)];
[locationDetailView setDelegate:locationDetailController];
[locationDetailController setLocationDetailView:locationDetailView];
[self addSubview:locationDetailView];
searchField = [CPTextField roundedTextFieldWithStringValue:#"" placeholder:#"Location" width:200.0];
[searchField setFrameOrigin:CGPointMake(510.0,35.0)];
[searchField setDelegate:self];
[self addSubview:searchField];
var searchButton = [[CPButton alloc] initWithFrame:CGRectMake(710.0,37.0,60.0,24.0)];
[searchButton setTitle:"Search"];
[searchButton setTarget:self];
[searchButton setAction:#selector(searchLocation)];
[self addSubview:searchButton];
}
return self;
}

Answer 1

I'm not sure I understand your question but essentially a window has a default view called the content view. You get it like so:
var contentView = [theWindow contentView];
To the content view you can add subviews (and buttons).
[contentView addSubview:myLocationView];
The location of those subviews is determined by the 'frame' of the subview.
[myLocationView setFrame:CGRectMake(10, 10, 100, 100)];
You can replace the content view's subviews with something else by either removing the previous views or using the setSubviews message.
[contentView setSubviews:[aButton, anotherButton]];
So essentially if you want to swap out one view for another, call 'setSubviews' on its super view with the new views you want. Hope that helps to get you started.