Skip to content
This repository
branch: master
Fetching contributors…

Octocat-spinner-32-eaf2f5

Cannot retrieve contributors at this time

file 78 lines (72 sloc) 2.44 kb
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77
<html>
<head>
    <title>Rainbow!</title>
    <script type="application/javascript;version=1.8">
        let Me = window.navigator.service.media;
    </script>
</head>
<body style="margin:50px 0px;padding:0px;text-align:center;">
    <h1>Recording Example</h1>
    <canvas id="tehcanvas" width="640" height="480"></canvas>
    <p><input type="button" id="tehbutton" value="Start!"/></p>
    <p id="tehmsg"></p>
</body>
<script type="application/javascript;version=1.8">
    let Re = false;
    let img = new Image();
    let msg = document.getElementById("tehmsg");
    let but = document.getElementById("tehbutton");
    let ctx = document.getElementById("tehcanvas").getContext("2d");

    img.src = "rainbow.png";
    img.onload = function() {
        ctx.drawImage(img, 192, 112);
    }

    function onStateChange(type, arg) {
        switch (type) {
            case "session-began":
                Me.beginRecording();
                break;
            case "record-began":
                msg.innerHTML = "Recording has begun!";
                break;
            case "record-ended":
                // Recording stopped, but file may not ready yet
                Me.endSession();
                Re = false;
                but.value = "Start!";
                ctx.drawImage(img, 192, 112);
                break;
            case "record-finished":
                // File is now available
                // arg is a DOM File, see
                // https://developer.mozilla.org/en/Using_files_from_web_applications
                msg.innerHTML = "Your video was named: " +
                    arg.files.item(0).fileName + " and is " +
                    arg.files.item(0).fileSize + " bytes big!";
                break;
            case "session-ended":
                // Ignore
                break;
            case "error":
                msg.innerHTML = "There was an error :( " + type + " :: " + arg;
                break;
        }
    }
    
    if (!Me) {
        msg.innerHTML = "The Rainbow add-on could not be loaded!";
        but.disabled = true;
    }
    
    but.onclick = function() {
        if (Re) {
            // Stop recording
            Me.endRecording();
        } else {
            // Start recording
            Re = true;
            but.value = "Stop!";
            msg.innerHTML = "Loading...";
            Me.beginSession({}, ctx, onStateChange);
        }
    }
</script>
</html>

Something went wrong with that request. Please try again.