title: How to get video's metadata (length) before uploading?
body: <p>First thing first, I am trying to extract the video duration from the file and then display it without having to actually upload the file.</p>
  
  <p>When a user selected a video - the information will be displayed below it includes file name, file size, file type. However much to my terrible skills - I cannot get the duration to display. I tried some code snippets i found from other sites as well as here but none of them seems to work. Just trying to find a simple code that would do the task. </p>
  
  <p>I tried onloadedmetadata but I don't think that would even work.</p>
  
  <p>Please note : I'm still learning javascript. </p>
  
  <p>I also tried some sites tutorial &amp; some code snippet I found via stackoverflow</p>
  
  <pre><code>
             function uploadFunction(){
                  //Variables
                  var cVideo = document.getElementById("fileUp");
                  var txtInfo = "";
  
                 //function 
                  if ('files' in cVideo){
                      if(cVideo.files.length == 0){
                      txtInfo = "Please select a video";
                  } else {
                      for (var v = 0; v &lt; cVideo.files.length; v++){
                          txtInfo += "&lt;br&gt;&lt;strong&gt;#" + (v+1) + " File Information:&lt;/strong&gt; &lt;br&gt;";         
                          var infoFile = cVideo.files[v];
                          if('name' in infoFile){
                              txtInfo += "File name: " +infoFile.name +"&lt;br&gt;";
                          }
                          if('size' in infoFile){
                             txtInfo += "File size: " +infoFile.size +" Bytes &lt;br&gt;"; 
                          }
                          if('type' in infoFile){
                              txtInfo += "File Type: "+infoFile.type +" &lt;br&gt;";
                          }
                          if('duration' in infoFile){
                              txtInfo += "Duration : "+infoFile.duration +"&lt;br&gt;";
                          }
  
                      }
                  }
  
                  }
                  document.getElementById("information").innerHTML = txtInfo ;
   }
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>
             &lt;input type="file" id="fileUp" name="fileUpload" multiple size="50" onchange="uploadFunction()"&gt;
             &lt;p id="information"&gt;&lt;/p&gt;
  </code></pre>
  
  <p>Can't get the duration to appear at all.</p>