Search code examples
cordovavideouploadtelerikeverlive

Telerik - Uploading Videos to Everlive, Unexpected Error


I'm currently trying develop an app in which I want to be able to record a video and I'm testing it at the moment with Teleriks everlive service. It takes me to the video camera on my phone correctly but then after recording as far as I'm aware the file should upload but it instead tells me the upload to the everlive has failed and the err.message is "Unexpected error". If anyone could tell me what i'm doing wrong i'd really appreciate it. Thanks.

var captureSuccess = function (mediaFiles) {
    mediaAdded = true;
    var i, path, len;
    for (i = 0, len = mediaFiles.length; i < len; i += 1) {
        path = mediaFiles[i].fullPath;
        alert(mediaFiles[i].size);
        var file = {
            Filename: Math.random().toString(36).substring(2, 15) + ".mp4",
            ContentType: "video/mp4",
            base64: mediaFiles[i]
        };

        el.Files.create(file, function (response) {
            alert("Photograph added.");

        }, function (err) {
            navigator.notification.alert("Unfortunately the upload failed: " + err.message);
        });
    }
};

function captureError() {
    alert("Video Not Captured");
}

navigator.device.capture.captureVideo(captureSuccess, captureError, {
    limit: 1,
    duration: 20
});

Solution

  • I have managed to make it working. I have started from the Media Capture sample here - http://docs.telerik.com/platform/samples/Sample-Capture/. Then I have added to the index.html file the script tag for the everlive.sdk.min.js

    <script src="https://bs-static.cdn.telerik.com/latest/everlive.all.min.js"></script>

    Then modified the captured success function, for clarity i was always testing the capture video, so i hardcoded the mime type and the file name.

    _captureSuccess:function(capturedFiles) {
        var i,
        media = document.getElementById("media");
        media.innerHTML = "";
        for (i=0;i < capturedFiles.length;i+=1) {
            media.innerHTML+='<p>Capture taken! Its path is: ' + capturedFiles[i].fullPath + '</p>'
        }
    
        var el = new Everlive('your-app-id');
    
        var options = {
            fileName: 'testvideo.mov',
            mimeType: 'video/quicktime'
        };
    
        el.files.upload(capturedFiles[0].fullPath, options)
        .then(function() {
            console.log('success');
        }, function(err) {
            console.log(JSON.stringify(err));
        });
    },
    

    Then comes the most important thing - you must include the File Transfer cordova plugin - https://github.com/apache/cordova-plugin-file-transfer because the everlive sdk assumes it is present when it tries to upload the file. When the plugin was not included, my result was just like yours - neither the usccess nor the error callback was fired, because there was an error in the sdk itself. After I have included the plugin, the SDK successfully uploaded the video. Here is the result:

    video successfully uploaded

    i think this will get you going with your app