bo
a small (1.6k gzipped) mvv framework for authoring mobile apps with native-like performance. full unit test coverage.
demo
http://eighttrackmind.github.io/bo/demo/
what?
- barebones mvv (fully tested)
- smooth paging and sliding animation
usage
html
<div bo-pane="foo">...</div>- set a pane's ID tofoo(works with any tag, not justdiv)<a bo-trigger="foo">...</div>- slide to the pane with IDfoowhen clicked/tapped (works with any tag, not justa)
coffee (or js if you prefer)
see https://github.com/eighttrackmind/bo/tree/master/coffee
usage
Put your pages into a single HTML file. Each pane ("screen") should have a unique data-bo-pane attribute. To trigger another pane when clicked/tapped, give the trigger a data-bo-trigger-pane attribute.
NextLink to bo.css in your <head>:
... ...Then install dependencies:
npm installFinally, link to dependencies followed by bo.js at the bottom of your <body>:
...api
# create a new Bo instance bo = | Method | Arguments | Description | Example |
|---|---|---|---|
on |
"event1...", handler |
Attach a DOM event listener | bo.on "mousedown touchstart", (event) -> ... |
register |
DOMElement |
Register a DOM Element as a Bo pane | bo.register document.querySelector "#id" |
hideAll |
- | Hide all Bo panes | do bo.hideAll |
show |
"id" |
Show pane with the given ID | bo.show "myPaneId" |
options
# create a new Bo instance, passing in a custom options dictionary options| Option | Type | Default | Description |
|---|---|---|---|
paneAttribute |
String | "bo-pane" |
Attribute indicating that an element is a Bo pane |
change |
Function | (PaneInstance) -> |
Callback fired when a Bo pane is shown |
building it yourself
npm installgrunt