Not able to turn off webcam

Question

I've written a script that successfully activates the user's webcam but throws an error when I try to stop or pause the stream.

I've built a prototype for multi-part single page webapp that requires the user to activate then deactivate their webcam. this version of the prototype doesn't actually capture and store webcam images and it's especially important that the user is able to deactivate the camera so that they don't feel like they're under surveillance.

Below are is my script, which uses a webRTC feature detection lib called compatibility. the line $video.pause() causes the following error

"Uncaught TypeError: undefined is not a function" in Chrome 36.x

while typing "$video" in devtools nad hitting return gives me this

[​​] but doing $video[0].pause() gives me the same error message as above.

I was thinking that doing something like window.URL.revokeObjectURL(stream) -- in my case compatibility.URL.revokeObjectURL(stream) -- was the way to go but wanted to get some advise before diving into that

// get it
var smoother = new Smoother(0.85, [0, 0, 0, 0, 0]),
    $video = $("#v"),
    $local_media = null;

webcam_capture = function(x){
    try {
        compatibility.getUserMedia({video: true}, function(stream) {
            try {
                $video.attr('src', compatibility.URL.createObjectURL(stream));          
            } catch (error) {
                $video.attr(src, stream);                       
            }   
            $('.camera_prompt').removeClass('show')
        }, function (error) {
            alert("WebRTC not available");
        });
    } catch (error) {
        console.log(error);
    }
}


webcam_capture();

// warn - prompt permissions after 6 seconds
capture_error = setTimeout(function(){
    typeof $video.attr('src') == "undefined" ?  
    $('.camera_prompt').addClass('show') :
    clearTimeout(capture_error);
},3000) 

start_card_capture = function(x){
    // open capture sesh
    OAO.card_capture_status = true;
    // get id of input to focus and class
    var id = 'capture_' + x;
    $('input#' + id).addClass('focused');
    // UI fade in
    $('#v, .notification, button.capture').fadeIn();
}

end_card_capture = function(x){
    // close capture sesh
    OAO.card_capture_status = false;    
    // UI fade out 
    $('#v, .notification, button.capture').fadeOut('visible');
}


capture_notify = function(x){
    $('#card_capture_form').find('.notification').find('div').text(x)
}


$('.capture').on('click', function(e){
    // determine input
    var $f = $(this).parent('form')
        $i = $f.find('input.focused');
    // check input and update the associated label's icon
    $i.prop('checked', true).removeClass('focused');
    $i.next('label').addClass('captured');
    // close UI

    if($f.find('label.captured').length < 2){
        end_card_capture(e)
    }

    if($f.find('label.captured').length == 2){
        $video.pause();
        OAO.sectional_transition('#funding',{y: '0%'}, 1400,100, $(this).parents('section'), { y: '-250%' }, 1000, 100  );
        OAO.step = 2;
        OAO.progress_bar(OAO.step)
        $('#progress_bar_container').removeClass('hidden');
    }

});


$('.capture_front, .capture_back').on('click', function(){
    // determine which side
    $(this).hasClass('capture_front') ?
    OAO.card_capture_side = 'front' :
    $(this).hasClass('capture_back') ?
    OAO.card_capture_side = 'back' :
    C('whichsideofthecardamIshooting?');


    if(typeof $video.attr('src') !== "undefined"){
        // set prop and init capture
        capture_notify(OAO.card_capture_side);
        start_card_capture(OAO.card_capture_side)
    }
  });

Thanks in advance for your help