Sunday, August 5, 2012

convert image or video into stream using javascript and that stream set to image/video tag dynamically


<!DOCTYPE html>
<html>
<head>
    <title>reading xml</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <input type="file" id="files" name="files[]" multiple />
    <output id="list"></output>

    <script>
      function handleFileSelect(evt) {
 alert("first");
        var files = evt.target.files; // FileList object

        // Loop through the FileList
        for (var i = 0, f; f = files[i]; i++) {

          var reader = new FileReader();
 alert("reader"+reader);

          // Closure to capture the file information.
          reader.onload = (function(theFile) {
            return function(e) {
alert("onload");
              // Print the contents of the file
              var span = document.createElement('span');                  
              span.innerHTML = ['<p>',e.target.result,'</p>'].join('');
              document.getElementById('list').insertBefore(span, null);
 alert("stream"+e.target.result);
 document.getElementById('image').setAttribute('src',
e.target.result);

            };
          })(f);

          // Read in the file
          //reader.readAsDataText(f,UTF-8);
          reader.readAsDataURL(f);
        }
      }

      document.getElementById('files').addEventListener('change', handleFileSelect, false);
    </script>
<img src="" id="image"/>
</body>


or
just go through this link

https://docs.google.com/document/d/1jdCtuWKC_QRboAbM8R9XE1T6xO-lUWFQCDckGTe692c/edit

1 comment:

  1. Thanks for the post, I am techno savvy. I believe you hit the nail right on the head. I am highly impressed with your blog. It is very nicely explained. Your article adds best knowledge to our Java Online Training from India. or learn thru Java Online Training from India Students.

    ReplyDelete