Playchilla PageFlip

Playchilla asked us to create a page flip flash application so he could show his travel pictures from his young days.

Feel free to share your pictures with the Playchilla Page Flip, it’s free!

Installation Overview

1. Download (right-click and save as) the swf file.
2. Upload the swf to your homepage.
3. Create an xml configuration file (see below).
4. Upload the xml file to your homepage.
5. Call the pageflip.swf file from your homepage html with the ‘xmlurl’ link pointing to the xml file.

Usage

The Page Flip swf takes an argument ‘xmlurl’ that points to an xmlfile with the configuration. Passing arguments to is pretty straightforward, for example:

pageflip.swf?xmlurl=http://www.playchilla.com/pageflip/demo.xml

You can for example run swf files with SWFObject. If you are using WordPress I recommend Kimili Flash Embed.

Configuration

Configuring Playchilla Page Flip is easy, just create an xml and upload it to your server. This is how the configuration for the demo above looks:

  <?xml version="1.0" encoding="utf-8" ?>
- <book pageWidth="300" pageHeight="350" bgcolor="0xff000000">
  <page front="http://www.playchilla.com/pageflip/pageflip_01.png" back="http://www.playchilla.com/pageflip/pageflip_02.png" hard="1" />
  <page front="http://www.playchilla.com/pageflip/pageflip_03.png" back="http://www.playchilla.com/pageflip/pageflip_04.png" hard="0" />
  <page front="http://www.playchilla.com/pageflip/pageflip_05.png" back="http://www.playchilla.com/pageflip/pageflip_06.png" hard="0" />
  <page front="http://www.playchilla.com/pageflip/pageflip_07.png" back="http://www.playchilla.com/pageflip/pageflip_08.png" hard="1" />
  </book>

It only works for images yet (not movie clips), each page requires a front and back image. Not a lot of settings but simple to use. I hope the xml above is self explanatory, otherwise ask me in the comment section.

Let me know what you think

Don’t hesitate to ask me questions, give feedback in the comments section!