Posted on by & filed under bookworm, ebooks, epub.

Since Bookworm has support for video you may want to experiment with creating your own video ebooks. Here’s how to do it and still create a valid XHTML 1.1/ePub.

Assuming you have a Flash movie called Creative_Commons_-_Get_Creative.swf and a containing XHTML page called chapter-1.html, put this in your OPF:

    <!-- Flash video -->
    <item id="video" 
          href="chapter-1.html" 
          media-type="application/xhtml+xml"/>

    <item id="video-flash" 
          href="Creative_Commons_-_Get_Creative.swf"
          fallback="video-fallback"
          media-type="application/x-shockwave-flash"/>

The first item is a standard OPS document; the second is the Flash movie itself. Notice that we declared a fallback to another item. That item needs to be a supported type, like an image:

    <item id="video-fallback"
          href="getcreative.gif"
          media-type="image/gif"/>

Then we need to create the XHTML document, including the Flash movie. The document should be valid XHTML 1.1, which precludes using many of the boilerplate Flash code available on the web which is meant to support IE or other legacy browsers. This code is valid and works in Bookworm (under Firefox):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Flash video test</title>
  </head>
  <body>
    <p>
      <object type="application/x-shockwave-flash" data="Creative_Commons_-_Get_Creative.swf" width="300" height="400">
        <param name="movie" value="Creative_Commons_-_Get_Creative.swf" />
        <img src="getcreative.gif" alt="banner" />
      </object>
    </p>
  </body>
</html>

Notice the implicit fallback img as well.

Try out the video demo, which works in Bookworm and Adobe Digital Editions. The ePub is released under a Creative Commons Attribution license.

Edited November 15, 2009 to provide a working version in Adobe Digital Editions; thanks Dave Cramer.

Tags:

27 Responses to “Using Flash video in ePub”

  1. Jussi Träskilä

    Also works on FF with epub reader 1.1.1 add-on, and Bookworm on Epiphany, G chrome on Ubuntu 9.1.
    cheers, Jussi

  2. Dave Cramer

    Hi Liza,

    Change the media-type of the video in the OPF to application/x-shockwave-flash and the video will play in ADE.

    Dave

  3. liza

    Thanks Dave, I made the correction in the post and sample file, and I’ve updated Bookworm’s code to accept the alternate media-type.

  4. Dave Cramer

    The biggest surprise (to me) is that I got a javascript control file to work in ADE, so you could start/stop the video. It must have been referenced from the swf file, but other than that I didn’t do anything special–just dumped it in the folder. Didn’t even list it on the manifest.

  5. Wiebe

    Hi Liza,

    I have been experimenting with embedding video in epub, and after reading your manual I succesfully embedded an swf file in an ebook. So far so good, but since the resulting epub file is very big, I was wondering whether it is possible to embed youtube videos (or footage from other hosted video providers) in epub files. Do you have any experience with that?

    Thanks, Wiebe

  6. Liza Daly

    Wiebe,
    The ePub specification doesn’t allow for resources to be located out of the ebook package (though it’s allowable to hyperlink to them). So no, that wouldn’t be valid.

    It would work in Bookworm because I don’t explicitly prevent that, just like I don’t prevent you from hotlinking to images elsewhere, but both are disallowed by the spec. Neither approach would work in other epub readers either.

  7. Wiebe

    Thanks, Liza. Unfortunately, since the iPhone doesn’t support flash video, the ePub vooks I created until now do not work in ereader apps on the iPhone platform. LexCycle suggested to use Quicktime instead. But is Quicktime embedding officially allowed by the ePub standard?

  8. Liza Daly

    No video format is officially supported. As long as you use the fallback system described above, you can embed any format.

    I didn’t know that Stanza could view Quicktime movies; that’s good to hear.

  9. Nina

    Hi Liza,

    I’ve used your example for embedding SWF in EPUB and it works well, so thanks for that. I’ve also tried scalable SWF in EPUB, by declaring the size of the SWF object in em or percent, so that it scales smoothly with the surrounding text.

    It works fine in ADE, but it doesn’t work at all in Bookworm or in any browser. Can you tell me whether it is possible to use scalable SWF that works in browsers at all?

    Nina

  10. Hamranhansenhansen

    > Flash
    > QuickTime

    Neither of those are suitable, because they are proprietary to Adobe and Apple respectively, and so they are not supported on all platforms. In order to support either of those, a device maker has to license software from Adobe or Apple. Most video playing devices don’t have the CPU power to run FlashPlayer or QuickTime Player, that is PC software.

    There is a universal consumer video format called ISO MPEG-4 H.264/AAC. It succeeded the MPEG-2 found on the DVD and the MPEG-1 found on Video CD about 10 years ago. It’s vendor neutral, any device maker can use it in their device or software player on equal terms with all other device makers.

    ISO MPEG-4 plays not just in both FlashPlayer and QuickTime Player on Mac/PC, which would be remarkable in itself, but also on iPod and other media players, iPhone and other smartphones, iPad and other tablets, set top boxes, game consoles, Blu-Ray Disc, and so on and so on. Every video on YouTube is stored as MPEG-4, and every video ever sold from iTunes is MPEG-4. Also, if you shoot video with a Flip or iPod or iPhone camcorder, that is MPEG-4. In the same way a DVD Player always has an MPEG-2 decoder, all of the devices that succeed the DVD Player have MPEG-4 decoders.

    A key thing to understand is that devices other than Mac and PC do not have large general purpose CPU’s that can run any arbitrary codec as software. Instead, they have dedicated video decoder chips that can decode ISO MPEG-4 with high efficiency and very low battery use. That’s why the iPad can play 10 hours of video, it’s playing through a hardware device that is highly optimized, not through a software codec on a general purpose CPU, as it would on many PC’s. (Macs have H.264 decoders in their GPU’s.)

    Another thing to consider is bandwidth. If you have a book with Flash video in it, and you replace that video with ISO MPEG-4 H.264, the weight of the video will be 20% of what it was. (And it still plays in FlashPlayer.) When you consider readers will be downloading your book over cellular connections, and there are limits in some cases where a fat book has to be downloaded over Wi-Fi, this is important.

    As for quality, ISO MPEG-4 scales from YouTube to Blu-Ray HD. Flash video does not do HD.

    So if you want universal playback, start with the universal video format. Include an image as fallback content for devices that can’t play video, and text for devices that can’t display images. But I would be very suspicious of doing any other audio video formats as that time is likely wasted, and likely doubles or triples the weight of your book for all readers for no good reason.

    > since the iPhone doesn’t support flash video

    There are no mobiles that support Flash video (zero, none, nada), it is not just the iPhone that does not support it. Flash video only plays in Adobe FlashPlayer, which as I write this (2010-03-10) runs only on Mac and PC platforms and requires a desktop-class CPU equivalent to a P4 2GHz, which is many times the computational power of a mobile. A version of FlashPlayer for mobiles has been promised by Adobe for over 3 years now but has still not shipped. FlashPlayer is Mac/PC software. Authoring books for FlashPlayer is like shipping your book as a Word document or InDesign document. Movies don’t ship in Final Cut, music doesn’t ship in Logic format.

    Video in books has to be universal because many books really benefit from it as essential content, not just an add-on frosting layer. For example, tech books: a frozen shot of a cursor hovering over Photoshop or a wrench hovering in mid-air is just not nearly as good as a short video showing the entire technique. Obviously books about movies should have movie clips illustrating the text. So books benefit from standardized consumer video as much as music and video players have benefited.

  11. Peter Collingridge

    On licensing fees – it is my understanding that MP3 also comes with a license fee that has (at times) been recouped by the license holders. It may be ±2% of gross. That concern is one of the reasons we prefer to use AAC audio encoding in our Apps; AAC is an open format that also has the benefit of delivering higher quality audio at smaller file sizes. However, it is not (yet) as widely supported as MP3, but it is supported by Apple, which makes the decision a no-brainer for us.

  12. Colin

    @Hamranhansenhansen, Quicktime is standard MPG4 and also h.264….Apple only call it Quicktime….also Apple call Airport to the normal WiFi connection….;)

  13. Arthic Leo

    Hi michael,

    the below link which you have posted is now working… kindly do the needful

    tp://www.combsconsulting.com/ipad-replace-flash-with-image-java-script-example/

  14. elmimmo

    You are cheating… on the web, nobody embeds video contained in a SWF file. What everybody does is embedding a video **player** in SWF that loads an external file in a real video format (MP4, FLV…).

    Now the question is, can a SWF file embedded inside an ePub using your instructions load resources (JPEG, MP4, etc) that reside inside the OPS? (in ADE, if anything).

    Because the ideal way of embedding video that worked in ADE, iPhone et al, and web based readers, would be, just like in the web, to use an embedding method such as Video for Everybody, which:
    1. Does not need Javascript ✓
    2. Works if either Flash or the HTML5 tag are supported ✓

    But I cannot get the damn SWF to load external resources residing in the OPS and having been properly declared in content.opf (unless I am doing something wrong, which I hope).

    Any idea?

Trackbacks/Pingbacks

  1.  Using HTML5 video in ePub : Threepress Consulting blog
  2.  VQR » Blog » E-Book Apps: You’re Doing It Wrong
  3.  Interactivity in EPUB using JavaScript, HTML5 and CSS3: BEA/IDPF video posted : Threepress Consulting blog
  4.  » Hoe maak ik een multimediaal ebook?
  5.  Hoe maak je een multimediaal eBook / magazine? | Frankwatching