Chapter 6: HTML5 Media and Canvas - Examples

  1. Listing 6-1: Introducing the video pixel data into a canvas
  2. Listing 6-2: Painting video frames at different offsets into the canvas
  3. Listing 6-3: Naive implementation of video tiling into a canvas
  4. Listing 6-4: Reimplementation of video tiling into a canvas with getImageData
  5. Listing 6-5: Reimplementation of video tiling into a canvas with createImageData
  6. Listing 6-6: Reimplementation of video tiling into a Canvas with two Canvases
  7. Listing 6-7: Making certain colors in a video transparent through a Canvas
  8. Listing 6-8: Rendering a video in the 2D canvas with a 3D effect
  9. Listing 6-9: Calculation of average color in a Canvas and display of ambient color frame
  10. Listing 6-10: Filling a rectangular canvas region with a video pattern
  11. Listing 6-11: Introducing a gradient transparency mark into the ambient video
  12. Listing 6-12: Using a clipped path to filter out regions of the video for display
  13. Listing 6-13: Text filled with video
  14. Listing 6-14: Video reflection using a Canvas
  15. Listing 6-15: Video spiral using Canvas
  16. Listing 6-16: Fortune cookie video with user interactivity in Canvas