Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can I directly show a recently uploaded video?
    primarykey
    data
    text
    <p>I wan't to create a proof of concept that shows the user that if they upload the same video in both .MP4 and OGG format, the generated video tag (using videojs) will be cross platform.</p> <p>I have succesfully created a fileuploader using the designer and it uploads files up to 512mb, to the folder "files" inside the solution, but I would like to know how to update the web page with the generated video tag.</p> <p>This is the tag I would like to change:</p> <pre><code>&lt;video id="example_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264" poster="http://video-js.zencoder.com/oceans-clip.png" data-setup='{"example_option":true}'&gt; &lt;source id="mp4" src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' /&gt; &lt;source id="webm" src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' /&gt; &lt;source id="ogg" src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' /&gt; &lt;/video&gt; </code></pre> <p>My save method:</p> <pre><code>protected void btnUpload_Click(object sender, EventArgs e){ //check to make sure a file is selected if (FileUpload1.HasFile) { //create the path to save the file to string fileName = Path.Combine(Server.MapPath("~/Files"), FileUpload1.FileName); //save the file to our local path FileUpload1.SaveAs(fileName); } } </code></pre> <p>EDIT:</p> <p>I almost have the solution now. somehow it doesn't get the right path. The solution I created:</p> <pre><code>&lt;script type="text/javascript"&gt; var _strSource = '&lt;ASP:LITERAL runat="server" id="litSource" /&gt;'; window.onload = function () { if ( _strSource != "" ) { alert( _strSource ); var video = document.getElementById( 'objVideo' ); var sources = video.getElementsByTagName( 'source' ); alert( sources[0].src ); sources[0].src = _strSource; video.load(); video.play(); } } &lt;/script&gt; </code></pre> <p>And on the server side:</p> <pre><code>protected void btnUpload_Click(object sender, EventArgs e){ //check to make sure a file is selected if (FileUpload1.HasFile) { //create the path to save the file to string fileName = Path.Combine(Server.MapPath("/Files"), FileUpload1.FileName); //save the file to our local path FileUpload1.SaveAs(fileName); this.litSource.Text = fileName.Replace("\\", "\\\\"); } } </code></pre> <p>I also added this in my web.config:</p> <pre><code>&lt;staticContent&gt; &lt;mimeMap fileExtension=".mp4" mimeType="video/mp4" /&gt; &lt;mimeMap fileExtension=".ogg" mimeType="video/ogg" /&gt; &lt;mimeMap fileExtension=".webm" mimeType="video/webm" /&gt; &lt;mimeMap fileExtension=".m4v" mimeType="video/m4v" /&gt; &lt;/staticContent&gt; </code></pre> <p>It now changes the path to (in my case) C:\Projects\FileUploadTest\FileUploadTest\Files\c4b3ae2189ea.ogg. This is the actual path where the file gets uploaded to, but the browser cannot reach this path. Does anyone has an idea how to achieve this?</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload