tannen.js v0.0.5

tannen.js

Responsive React.js event calendar (Demo)

Dependencies

• React.js
• moment

are both considered external dependencies, so they are not packed/distributed within this component set, but must be included in your setup.

Installation

• npm install tannen.js
• open example/index.html in a browser

If you clone the project from Github, make sure you run npm install to get all the dependencies.

Usage

var React = require('react');
var Tannen = require('tannen.js');

React.render(
  <Tannen
    init_date='2015-07-01'
    events={[
      {
        start_date: '2015-07-22',
        end_date: '2015-07-28',
        title: 'Event A',
        description: 'This will show up in a tooltip if a library like Semantic UI is detected.',
        url: 'http://www.example.com'
      },
      {
        start_date: '2015-07-24',
        end_date: '2015-07-24',
        title: 'Event B'
      },
      {
        start_date: '2015-07-05',
        end_date: '2015-07-10',
        title: 'Event C'
      },
      {
        start_date: '2015-07-24',
        end_date: '2015-07-27',
        title: 'Event D'
      },
      {
        start_date: '2015-07-25',
        end_date: '2015-07-25',
        title: 'Event E'
      }
    ]}/>,
  document.getElementById('tannen-example')
);

Settings

A number of settings can be controlled through the props:

The rest can and should be overridden with CSS.

TO DO:

• Tooltip support for Bootstrap and Foundation if detected