Hi,
you can read the file before upload
http://www.html5rocks.com/en/tutorials/file/dndfiles/
but there is a way to get a video duration ?
Bye
Hi,
you can read the file before upload
http://www.html5rocks.com/en/tutorials/file/dndfiles/
but there is a way to get a video duration ?
Bye
I don’t think you can do it using the FileReader API, but it should be possible using the HTML5 audio/video duration property.
e.g.
myVid=document.getElementById("video1");
consol.log(myVid.duration);
if only
var oFile = document.getElementById('files').files[0];
document.getElementById('placeholder').innerHTML = '<video id="mytest" width="320" height="240" controls><source src="'+oFile.name+'" type="video/mp4"></video>';
var myVid=document.getElementById("mytest");
console.log(myVid.duration);
you can do the preview of an image (base64) but for the video ?
just playing around ^^
var oFile = document.getElementById('files').files[0];
var mytest = document.getElementById('mytest');
// prepare HTML5 FileReader
var oReader = new FileReader();
oReader.onload = function(e){
console.log(e.target.result);
mytest.src = e.target.result;
mytest.onload = function () { // binding onload event
console.log('load');
};
};
// read selected file as DataURL
oReader.readAsDataURL(oFile);
var myVid=document.getElementById("mytest");
console.log(myVid.duration);
Hi there,
I was thinking more along these lines.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Get duration of video element</title>
</head>
<body>
<input type="file" id="myUploader"/>
<script>
var uploader = document.getElementById("myUploader");
uploader.onchange = function(){
reader = new FileReader();
reader.onload = function(e) {
var videoElement = document.createElement('video');
videoElement.src = e.target.result;
var timer = setInterval(function () {
if (videoElement.readyState === 4){
console.log("The duration is: " + videoElement.duration.toFixed(2) + " seconds");
clearInterval(timer);
}
}, 500)
};
reader.readAsDataURL(files[0]);
}
</script>
</body>
</html>
You have to upload the video first, before the script can ascertain its duration, but as I said previously, I don’t think it’s possible to do this before the upload has occured.
Out of interest - why do you need to get the duration in this way?
Hope that helps.
I got that snippet from a demo for upload image for
the image it works so I wondered why not for the videos
but it doesn’t work …
I need a thing like this because I’m working
on a project of upload videos and a feature should be
upload only video which length is not more like 15m …
but I should find a other way (server side).
Thanks for the help