https://github.com/springload/hummingbird
Hummingbird, a toolset for mobile development
https://github.com/springload/hummingbird
javascript mobile
Last synced: 11 months ago
JSON representation
Hummingbird, a toolset for mobile development
- Host: GitHub
- URL: https://github.com/springload/hummingbird
- Owner: springload
- Created: 2014-08-20T04:16:34.000Z (over 11 years ago)
- Default Branch: master
- Last Pushed: 2014-08-20T23:18:35.000Z (over 11 years ago)
- Last Synced: 2025-02-01T06:25:39.340Z (about 1 year ago)
- Topics: javascript, mobile
- Language: JavaScript
- Homepage:
- Size: 191 KB
- Stars: 0
- Watchers: 27
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Hummingbird
A collection of Backbone Marionette components for rapid JS-powered mobile app development.
* Build tablet and mobile apps with one codebase
* Flexible view transitions
* Easy install via npm
## Docs
### Core
* Browser capabilities
* Transport
* AppLayout
### Models
* DualStorage model
### Layouts
* SplitView
* StackView
### Views
* View
* ModalView
* TransitionView
* NotificationView
* SearchFormView
* TabView
* EmptyView
* FetchingView
### Regions
* TransitionRegion
### UI
* Orientation
* Carousel
* Transition
* Animation
## Using in your project
```bash
> npm install hummingbird
```
Then, deep in your application:
```js
var Hummingbird = require("hummingbird");
var View = Hummingbird.View;
var myCoolView = new View({
template: require("./templates/myCoolView.nunj");
});
```
Then you can start using hummingbird components right away.
```javascript
var view = new Hummingbird.StackView();
view.push(new Marionette.ItemView({template: require("templates/intro.nunj") }));
view.pop();
```
## Components
### TransitionRegion
Push a view with a transition
```javascript
var view = new Hummingbird.StackView();
view.push(new Marionette.ItemView({
template: require("app/templates/intro.nunj")
}),
{
transition: "slideLeft"
});
view.pop();
```
### EmptyView
A default view for when a collectionview is empty.
### FetchingView
A view that shows automatically while fetching a collection
## Testing this repo
```
> npm install
> gulp test
```