mozilla
Your Search Results

    rtcamera

    rtcamera is a fun camera app to process images in real time, using Web technologies.

    Read the full developer walkthrough.

    Difficulty: Advanced

    Code Breakdown:

    • 1% HTML
    • 16% CSS
    • 83% JavaScript

     

    Web API Usage

    appcache
    Once loaded for the first time, it can be used offline, without a network connection.
    Blob
    For downloading files to the browser.
    URL
    For downloading files to the browser.
    WebGL
    Used for fast and efficient processing of image data.
    WebRTC
    Used to access camera devices and get a video stream from where to capture frames.
    getUserMedia
    Used to access camera devices and get a video stream from where to capture frames.
    IndexedDB
    Stores captured images on the device and retrieve them for the gallery view.
    Web Workers
    Generates GIF files on the background without freezing the UI.
    XMLHttpRequest
    Uploading images to a different server for sharing, and getting their url.

    Custom Elements

    x-tags
    rtcamera uses x-appbar, x-deck, x-layout, x-modal and x-switch.

    Third-party Libraries

    Animated GIF
    Generates animated GIFs.
    Async Storage
    A wrapper for IndexedDB.
    glMatrix
    Calculates perspective transformations.
    hammer.js
    Add touch events.
    RequireJS
    Uses RequireJS to split JavaScript code into more easily maintainable modules.

    Document Tags and Contributors

    Contributors to this page:
    Last updated by: burschy47,