@Jomen wrote:
My plan is to create an app that make use of https://github.com/websemantics/vimeo-upload and it´s upload-cordova.js. The app has a Choose Video button with
showOption()
that opens aionicActionSheet
that let you choose to eithercaptureVideo
or togetPicture
(Camera.MediaType.VIDEO) from the device library. When this is done, the video is added to a player<cordova-video src="data.videoPath"></cordova-video>
that that are able to play the chosen video. When the video this way is added to the player, a button with theng-click="uploadVideo()"
function shows up($scope.show = true;
). Pressing this button will cause the current video in the player to be uploaded to my Vimeo account. For sure the upload attempt starts and the progress-bar shows a progress. Also instantly my vimeo account display an Untitled video template and when I click its title, the video page display a ordinary Uploading animation and the text: Your video is uploading. Unfortunately, the progress newer finishes. Thevar files
inuploadVideo
obviously does not contain or find the file(video) to upload. The$scope.data.videoPath
; seems to be just astring
. Can someone tell me how to identify the video(object) used byvideoPath
and how to add it to the files array (var files = [];
) ? I would be so glad for any help on this. See my code below:
$scope.show = false;$scope.data = {
videoPath: ""
};$scope.caption = "Choose Video";
// captureVideo function
$scope.captureVideo = $scope.captureVideo = function(){
var options = {
quality: 50,
limit: 3,
duration: 15 };$cordovaCapture.captureVideo(options).then(function(videoData){ // Success! Video data is here $scope.data.videoPath = "file:/" + videoData[0].fullPath; $scope.show = true; $scope.caption = "Choose new Video"; }, function(err){ // An error occurred. Show a message to the user console.log(err); });
}
// find video on device function
$scope.getPicture = function(sourceType){
var options = {
quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
mediaType:Camera.MediaType.VIDEO
};$cordovaCamera.getPicture(options).then(function(imageData){
// Success! Video data is here
$scope.data.videoPath = imageData;
$scope.show = true;
$scope.caption = "Choose another Video";
}, function(err) {
// An error occurred. Show a message to the user
console.log(err);
});
}$scope.showOptions = function(){
var hideSheet = $ionicActionSheet.show({
buttons: [{
text: 'Choose a recording'
}, {
text: 'Make a recording'
}],
destructiveText: '',
titleText: 'What do you want?',
cancelText: 'Cancel',
cancel: function(){
//hideSheet();
},
buttonClicked: function (index){
// Choose existing recording
if(index === 0){
$scope.getPicture();
}
// Create new recording
else if(index === 1){
$scope.captureVideo();
}
// Cancel operation
else {} return true; } });
};
// This is the function that I want to start the upload to Vimeo with
$scope.uploadVideo = function(){var files = []; // Here lies my problem. videoPath is a string, //not the file(video) that videoPath points to.
//What is the name of the file/video object in my case??
files[0] = $scope.data.videoPath; var accessToken = " "; // accesstoken to Vimeo upload API are hidden in this text // Rest the progress bar $scope.updateProgress(0); var uploader = new MediaUploader({ file: files[0], token: accessToken, onError: function(data) { console.log('Error ', data); var errorResponse = JSON.parse(data); message = errorResponse.error; }, onProgress: function(data) { console.log('in progress...'); $scope.updateProgress(data.loaded / data.total); }, onComplete: function(videoId) { console.log('Complete ',videoId); var url = "https://vimeo.com/"+videoId; var a = document.createElement('a'); a.appendChild(document.createTextNode(url)); a.setAttribute('href',url); var element = document.createElement("div"); element.setAttribute('class', "alert alert-success"); element.appendChild(a); document.getElementById('results').appendChild(element); } }); uploader.upload();
};
Posts: 1
Participants: 1