Skip to content

Instantly share code, notes, and snippets.

@atebitftw
Created September 8, 2012 04:52
Show Gist options
  • Save atebitftw/3671914 to your computer and use it in GitHub Desktop.
Save atebitftw/3671914 to your computer and use it in GitHub Desktop.
Setting up Buckshot app for full browser
// In CSS: body{margin:0px;padding:0px}
// given this main template (would be in your HTML file typically)
String t =
'''
<dockpanel halign='stretch' valign='stretch'>
<!-- menu strips (in other templates) will bind to this border -->
<border dockpanel.dock='top' content='{data menuStripContent}'></border>
<!-- controls will bind to this border -->
<border dockpanel.dock='left' content='{data controlsContent}'></border>
<!-- the wysiwyg, preview, whatever will go here -->
<border content='{data displayContent}'></border>
</dockpanel>
''';
main(){
setView(new View.fromTemplate(t))
.then((rootElement){
// now set the rootElement's parent to the window width/height
// this works because the root element is placed in an implicit
// border before being rendered to the DOM
bind(buckshot.windowWidthProperty, rootElement.parent.widthProperty);
bind(buckshot.widnowHeightProperty, rootElement.parent.heightProperty);
// Now your main template will be stretchy with the browser window dimensions.
// next set the view model to the datacontext of the rootElement so the data bindings work
rootElement.dataContext = new MainViewModel();
});
}
class MainViewModel extends ViewModelBase
{
FrameworkProperty menuStripContentProperty;
FrameworkProperty controlsContentProperty;
FrameworkProperty displayContentProperty;
MainViewModel(){
menuStripContentProperty = new FrameworkProperty(this, 'menuStripContent');
controlsContentProperty = new FrameworkProperty(this, 'controlsContent');
displayContentProperty = new FrameworkProperty(this, 'displayContent');
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment