Buddy (0.0.1)

Download build.css and build.js and add them to your page.

<link rel="stylesheet" href="build.css" />
<script src="build.js"></script>

$ component install binocarlos/buddy

First you need some content that Buddy will turn into a book:

<div id="book">
  <div class="page">
    Buddy likes fish.
  </div>
  <div class="page">
    Buddy likes humans when they give him fish.
  </div>
  <div class="page">
    Buddy likes chips with his fish.
  </div>
</div>

Then - tell buddy about your book:

var Buddy = require('buddy');
var book = new Buddy({
  selector:'#book',
  page_selector:'.page'
});

Buddy can handle touch events so users can turn pages - however, you can build galleries of thumbnails and manually trigger the page.

---

animate_direction

This moves the book either forward or backwards by one page:

var book = new Buddy(...);

// move the book forward one page
book.animate_direction(1)

---

animate_index

This moves the book to a particular page:

var book = new Buddy(...);

// send the book to page 6
book.animate_index(5)

Buddy can handle a range of other options - here is an example:

var Buddy = require('buddy');
var book = new Buddy({

  // the div that holds our pages
  selector:'#book',

  // the selector for our actual pages
  page_selector:'.page',

  // the element that responds to drag events to turn the page
  touch_selector:'body',

  // additional classname to apply to pages
  apply_pageclass:'bookpage',

  // control 3d mode (pages fade when disabled)
  is_3d:true,

  // how much to apply the 3d effect
  perspective:950,

  // control which page the book starts on
  startpage:0,

  // control whether a shadow is auto-rendered
  shadow:true

});

If you like Buddy - checkout his diary at Story Time Island!

---