ampersand-drawer-view

1.0.0 • Public • Published

ampersand-drawer-view

Ampersand view class for hamburger drawer-like layouts. Inspired by Polymer's core-drawer-panel element

browser support

Install

npm install ampersand-drawer-view --save

Usage

// Soon. Look at tests for examples, for now.
 
var View = require('ampersand-view');
var DrawerView = require('ampersand-drawer-view');
var drawerView;
 
var DrawerPanel = View.extend({
  template: '<div>Drawer Panel</div>'  
});
 
var MainPanel = View.extend({
  template: '<div>Main Panel<br><button>Open Drawer</button></div>';
  events: {
    'click button': 'openDrawer'
  },
  
  openDrawer: function (e) {
    e.preventDefault();
    
    drawerView.openDrawer();
  }
});
 
 drawerView = new DrawerView({
  forceNarrow: true,
  subviews: {
    drawer: {
      view: new DrawerPanel(),
      width: 300,
      animationSpeed: 100
    },
    main: {
      view: new MainPanel(),
    }
  }
});
 
document.body.appendChild(drawerView.el);

API

(Coming soon. Look at tests for now)

Run Tests

npm install
npm test

/ampersand-drawer-view/

    Package Sidebar

    Install

    npm i ampersand-drawer-view

    Weekly Downloads

    1

    Version

    1.0.0

    License

    MIT

    Last publish

    Collaborators

    • scottcorgan