Never Punch Manticores

    video-canvas

    4.0.3 • Public • Published

    video-canvas

    Paint video on canvas. Extra light.

    gzipped size Travis build status gzipped size

    video-canvas will take care of painting a video on canvas for you. In the easiest of setups, you provide a video and you get a correctly-sized self-updating canvas ready to be used.

    Features:

    • It automatically starts and pauses painting with video.play() and video.pause().
    • If the video is paused or in a background tab, nothing is painted.
    • It automatically creates a canvas element from your video (optional).
    • It automatically resizes the canvas to match your video (optional).

    Install

    npm install --save video-canvas
    var videoCanvas = require('video-canvas');
    import videoCanvas from 'video-canvas';

    Usage

    Simple usage:

    const video = document.querySelector('video');
    const canvas = videoCanvas(video); // returns the <canvas> element
    document.body.appendChild(canvas)
    video.play();
    video.pause();

    Provide your own canvas:

    videoCanvas(video, {
        canvas: document.querySelector('.your-own-canvas'),
    });

    By default, video-canvas will automatically match the canvas size to the video size, whenever that changes. If you want to prevent this behavior, pass updateSize: false

    const canvas = videoCanvas(video, {
        updateSize: false
    });

    If you want to customize the draw call, pass your drawing function as drawCall

    const canvas = videoCanvas(video, {
        drawCall: function (ctx, video) {
            ctx.drawImage(video, 0, 0, 100, 100)
        }
    });

    Dependencies

    No dependencies.

    Related

    • get-media-size: get the real size of any media: images, videos, canvas and canvas' contexts
    • iphone-inline-video: You don't need canvas to play video inline on the iPhone

    License

    MIT © Federico Brigante

    Install

    npm i video-canvas

    DownloadsWeekly Downloads

    28

    Version

    4.0.3

    License

    MIT

    Unpacked Size

    7.59 kB

    Total Files

    6

    Last publish

    Collaborators

    • fregante