Visual Studio 2010 Missing HTML5 Video? - visual-studio-2010

Working with HTML5 within VS2010, I don't understand how the source tags aquire the path for the video. I assume it either can be Absoulute or Relative.
What I am attempting is very simple:
<video id="my_video" width="480" height="300" controls preload="none" poster="webm/art_leaf_resized.jpg">
<source src="webm/Along_the_Path.mp4" type="video/mp4" />
<source src="webm/Along the Path.webm" type="video/webm" />
<source src="webm/Along the Path.ogv" type="video/ogg" />
</video>
However, Pressing F5 in VS2010, Firefox and IE9 can not locate the video displaying an X. Chrome is able to find the video and play it.
The poster image shows correctly and isn't missing. The poster image is in the same directory as the videos?
File Directory:
A basic HTML page (HTMLPage1.htm) holds only the video element.
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
</head>
<body>
<video id="my_video" width="480" height="300" controls
preload="none" poster="webm/art_leaf_resized.jpg">
<source src="webm/Along_the_Path.mp4" type="video/mp4" />
<source src="webm/Along the Path.webm" type="video/webm" />
<source src="webm/Along the Path.ogv" type="video/ogg" />
</video>
</body>
</html>
Closing VS2010 and opening IE9 and dragging in the htm page, the video is able to play in IE9, Firefox, and Chrome. I believe VS2010 is doing something?
I have been working with for some time now. I believe that I am not thinking, which it probably is something very simple.
Any help would be appreciated.
Thank you,
deDogs

I agree with the people in the comments that it might be an ASP.NET Development Server issue. Try two things: Publish the site to a legitimate local web server and try to open it from there. Also, for the dev server see if adding "~/" to the front of your urls helps anything.

After returning to this project, I found the answer to why HTML Videos were missing.
My findings can be read at my blog: Visual Studio Development Web Server, mp4 isn’t part of the set of built in known Mime types.
Thank you,
deDogs

Related

The image won't display

I am trying to get an image to display on a basic webpage I am writing for a class. It just shows a box with my alternate text. Here is my code:
<html>
<head>
<title>Practice Features</title>
</head>
<body>
<img src=“images/FLCLogo.JPG” alt=“Folsom”>
</body>
</html>
Both the textedit doc and the images folder are in the same folder. In fact, they are the only files in that particular folder.
I'm doing the coding on a Mac, if that makes a difference at all. I've viewed it on both Chrome and Safari. Same issue.
You need to copy the file location..
Go to your image/properties/location+
Copy the location and paste it inside your quotes

Embedding video for all browsers (including Mac Firefox!)

I've seen a bunch of threads around referencing various video embedding issues. Unfortunately I'm not in a position to serve my assets off of a CDN (or Youtube, Vimeo, etc) so have resorted to working with multiple formats. I've got .mp4, .ogg, and .swf.
I'm continuing to get an error in Firefox (Mac) regarding "no video of the requested MIME type can be found." I've added mp4 and ogg to my .htaccess file to no avail.
Which makes me think there must be something slightly wrong with my code. I've used a combination of the suggested methods I've found online. I'm hoping I've done something so obviously daft that it will stick out like a sore thumb to someone in the know.
<video width="757" height="425" controls id="player">
<source src="video.mp4" type="video/mp4">
<source src="video.ogg" type="video/ogg">
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="757" height="425" >
<param name="src" value="video.mp4">
<param name="controller" value="true">
<embed SRC="QTMimeType.pntg" type="image/x-macpaint" pluginspage="http://www.apple.com/quicktime/download" qtsrc="video.swf"
width="757" height="425" autoplay="false" controller="true">
</embed>
</object>
</video>
Many thanks in advance for taking a look at this. Feeling pretty stupid right now.

mkv issue in firefox

I've been searching for this a lot, and I think it is not possible but for being sure:
I have some MKV video files which I want to put them on my website. The problem is you can't
play them in firefox and it only works in chrome browser. I'm using html5 player(js player).
<video id="example_video_2" class="video-js vjs-default-skin" controls preload="auto" width="800" height="600" poster="<?php echo $teacher_pic ;?>" data-setup='{"example_option":true}'> <source src='<?php echo $video_url;?>' type='video/mp4' /> </video>
<script>
videojs.options.flash.swf = "video/video-js/video-js.swf"
</script>
I also tried "Video for Everybody" player but it didn't help.
So , is it related to player or not ? is it basically possible to play my videos in firefox?
Hm, could this link help you - http://www.videolan.org/doc/vlc-user-guide/en/ch07.html
If not, maybe you could try adding a type type="video/x-matroska" and the explanation is here: https://support.mozilla.org/en-US/questions/948571

How do show an local video using ASP.Net MVC 3

I have a Video Content/Videos/samsung.mp4. I want to show that video but I can't seem to access it in the view, I am not sure what C# code I should use to access the resource.
This doesn't show the video:
#{
ViewBag.Title = "Some site!";
var videourl = Url.Content("/Content/Videos/samsung.mp4");
}
<h2>Some site this is!</h2>
<p>
<video>#videourl</video>
</p>
<video> is a HTML5 element and it does support MP4 videos.
But the browser may not. Which browser and version are you using?
Also, your syntax above is incorrect. The correct syntax for the video element with an MP4 video would be:
<video src="samsung.mp4"></video>
Alternatively you can serve up different formats to different browsers (which is recommended) with:
<video>
<source src="samsung.ogg" type="video/ogg">
<source src="samsung.mp4" type="video/mp4">
<source src="samsung.webm" type="video/webm">
Your browser doesn't support the video element
</video>
Have a look at the Microsoft Web Helpers package. There is a Video helper to do just this.
More details at http://msdn.microsoft.com/en-us/library/microsoft.web.helpers(v=VS.99).aspx
You can download the package from Nuget.
You need to embed it in a Quicktime player or another thats supports mp4. it doesn't have anything to do with c# more HTML/javascript.
Not sure the code needed but the above information will be enough to find it on google

How to get the src for a video with multiple sources?

I'd like to be able to get the src value that is actually used for a video element like the following:
<video>
<source src="foo.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="foo.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="foo.ogv" type='video/ogg; codecs="theora, vorbis"'>
</video>
In Firefox (at least), src is defined for the source elements but not for the video element.
How can I find which source is used?
I think I've answered my own question: the currentSrc property of the video element.
This works in Firefox, Safari (and Chrome, I assume) on Windows XP SP3, at least.
UPDATE: as was pointed out to me in the comments below, there is documentation of currentSrc in the WHATWG spec.

Resources