https://github.com/pixelhandler/ember-off-canvas-components

A micro library containing a group of Ember.js Components that interact to create an Off-Canvas user interface.
https://github.com/pixelhandler/ember-off-canvas-components

Last synced: about 2 months ago
JSON representation

A micro library containing a group of Ember.js Components that interact to create an Off-Canvas user interface.

• Host: GitHub
• URL: https://github.com/pixelhandler/ember-off-canvas-components
• Owner: pixelhandler
• License: mit
• Created: 2014-09-05T07:27:06.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2016-12-31T17:29:02.000Z (almost 8 years ago)
• Last Synced: 2024-10-15T07:44:50.635Z (2 months ago)
• Language: JavaScript
• Homepage: http://pixelhandler.github.io/ember-off-canvas-components/
• Size: 1.25 MB
• Stars: 41
• Watchers: 3
• Forks: 4
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Ember Off Canvas Components

A micro library packaged as and Ember CLI Addon - a group of [Ember.js Components] that interact to create an Off-Canvas

user interface.

[![Build Status](https://travis-ci.org/pixelhandler/ember-off-canvas-components.svg)](https://travis-ci.org/pixelhandler/ember-off-canvas-components)

[Ember.js Components]: http://emberjs.com/guides/components/ 

## Installation

### As an Ember CLI addon

Use this addon in you ember-cli application...

    ember install ember-off-canvas-components

### As a Standalone Library

Download a [release][releases].

[releases]: https://github.com/pixelhandler/ember-off-canvas-components/releases

Copy to your vendor directory and link up the .js and .css files

## [View a demo][demo]

* An off-canvas area is positioned outside of the viewport and slides into view when activated. 

* (Off-canvas is a UI pattern, and not associated with the html `canvas` element.)

[demo]: http://pixelhandler.github.io/ember-off-canvas-components/

# Contributing

## Installation

    git clone [email protected]:pixelhandler/ember-off-canvas-components.git

    cd ember-off-canvas-components

    npm install

    bower install

    npm run sass

## Running

1. `ember server`

2. Visit your app at .

## Running Tests

* `ember test`

* `ember test --server`

## Building

* `ember build`

For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/).

Also see the [packaging] readme file for a non Ember CLI release.

[packaging]: https://github.com/pixelhandler/ember-off-canvas-components/blob/master/packaging/README-packaging.md

## Test the addon as a dependency

The dummy app is used for the demo on the gh-pages branch. Test out the

addon in an ember-cli by copying some of the source code of the dummy app. 

Test with local clone of this repo using `npm link`

    cd ember-off-canvas-components

    npm link

    cd ../

    ember new test-app

    cd test-app

    npm link ember-off-canvas-components

Or, test with a github repo

    ember new test-app

    cd test-app

    npm install pixelhandler/ember-off-canvas-components --save-dev

Copy the dummy app files and run the test-app

    cp node_modules/ember-off-canvas-components/tests/dummy/app/templates/application.hbs app/templates/application.hbs

    cp node_modules/ember-off-canvas-components/tests/dummy/app/templates/index.hbs app/templates/index.hbs

    cp node_modules/ember-off-canvas-components/tests/dummy/app/templates/off-canvas.hbs app/templates/off-canvas.hbs

    cp node_modules/ember-off-canvas-components/tests/dummy/app/controllers/index.js app/controllers/index.js

    cp node_modules/ember-off-canvas-components/tests/dummy/app/routes/index.js app/routes/index.js

    cp node_modules/ember-off-canvas-components/tests/dummy/app/styles/app.css app/styles/app.css

    ember server