Deep Time? (revisited)
--------------------------------------------------
While I never intended for this blog to become a geeky "How-to," I did think it only fair to share some of my research of the past few days as I've made attempts to learn the "right way" to embed various kinds of media into a web page. It is difficult as hell to find "the way."
That gets frustrating. When I first made my living programming, 25 years ago, syntax was syntax. If you didn't have it absolutely correct you didn't get squat. There was no such thing as "close enough" or "works most of the time on most browsers." But web pages and browsers and officially sanctioned standards oriented code versus bogus-but-usually-works-anyway stuff is enough to drive you crazy.
My basic goal is this: I want to be able to embed videos and music in my blog and feel reasonably confident that I've done it in a way that will work on most any browser regardless of whether it is being used on a Mac or a PC.
Earlier today I found the little movie from Research Penn State, linked to in the previous post, as I was looking for how to handle XHTML Quicktime objects. It was working for me so I took a look at the source code and it looked pretty good. But then I found Apple's guide and started seeing some attributes that, according to Apple, don't even exist for Quicktime. Plus, my intent in this follow-up post was to embed the same movie in this post and then show how I had done it. But the first snag I ran into was in trying to scale it down, as I have done to other movies. I couldn't get it to scale down, but I'm also not sure that it is actually Quicktime source material, though it most likely is being streamed from a QTSS (Quicktime Streaming Server). And that was the other thing, I'm really not looking for ways to embed streamed movies in the first place.
So after those snags and a couple of hours on the phone and in video iChats with my dad, whose computer was blowing up, I finally got into the Apple guide and whittled it down to the fundamental parameters and options I felt I will need on a frequent basis, so I could make myself a cut-and-paste template to use for anytime I want to embed a video. That way I can just change the name of the source video and tweek the params as needed.
Then, once I found "the way" I decided I would share the code I used here, but that turned out to be a challenge in itself; the reason is because Blogger is such a great tool for blogging since, for a typical, text based blog, it handles most of the HTML so that you can just type away as though you are writing an email. But that same ease makes it nearly impossible to quote lines of code without it actually trying to execute them. Just commenting everything out was too messy and only adds confusing to the syntax and, besides, I think it ignores code comments in posts, anyway, but I found a way, and I'll get to that in a moment.
The basic part of my quest was getting to the bottom of how to embed without the EMBED tag, since the W3C says that's a no-no, even though it's been around for years and works great most of the time. In my earlier DEEP TIME post I mistakenly called their use of the EMBED tag bogus.
It is bogus, but you can't get away from using it, and here is the reason, according to Apple, which I think mostly comes down to the old IE 5 for Macs that I don't think any Mac user in their right mind is still using, since the arrival of Safari.
IE 5 for Macs will not execute Quicktime objects. It ignores them, completely, so if you want to embed Quicktime objects in a page, you need to still provide an EMBED tag as a fall back plan for IE on a Mac.
IE for Windows handles Quicktime objects okay, but you have to provide this funky long CLASSID info that only means something to IE/Active X, etc. It doesn't mean anything to a Mac browser, like Safari, but Safari just ignores it and handles the object anyway, looking out for the params that it does need.
So, your basic setup is to create and object which will work on most browsers, but also contains a fall-back EMBED tag for IE on Macs (and possibly other browsers with the same problem...I guess).
There are many optional parameters for embedding Quicktime objects, but 95% of the time you can get by on some very fundamental ones. These come down to defining what/where the actual source content is, what plug-in plays the object (where the user needs to go if they don't have it), the dimensions of the object (how big it will be on the page), where or not you want it to display the controls or just be a movie (or hidden entirely if that "movie" is really just music), whether or not the movie should start by itself or wait for the user to click the controls and, finally, whether or not you want it to run in Kiosk mode (which means the user cannot download and save the source file).
So, below is the source of what I used to embed the music video seen in my second post on this blog.
PLEASE NOTE: In order to display instead of execute the following code in this blog, I changed all the usual HTML brackets like "<" and ">" to parens, as in "(" and ")":
I've tried this out on a Mac in both Safari and IE, commenting out first the object portion and then the EMBED portion, to see which browser was doing which. Safari is executing either method that it finds first. IE is only executing the EMBED portion.
I'm working on getting it tested in IE on a PC, but right now my video content requires Quicktime 7 and there is now only a beta version of QT7 available for PCs.
Also, there is one parameter I am using that I did not mention above; I am using the SCALE parameter. That is one you need if you want to re-size the display of a movie that is actually larger or smaller than what you want to display on the page. The values for parameter can be "toFit" or "Aspect." It's best to experiment to see which one you think works best for a particular movie. You don't need it to enlarge a display, but if you shrink a movie without it you will only mask out the portions that don't fit in the display size you make available.
I'm no expert on this stuff by any means, but this is what is working consistently for me.
Updated: Man this stuff is going to drive me nuts. Just did some more testing with IE and Firefox, on a Mac. Both seem to be doing the EMBED tag, but they are allocating the space for the OBJECT tag, so I am ending up with space for two entities (movie or MP3) with only the second space actually being occupied by the controller and content. I'm tempted to just go back to the damn EMBED command alone, since it seems to work fine, regardless of what the WC3 says about it, but I hesitate to make any changes until I see how this looks on a PC, running IE under a Windows OS.
That gets frustrating. When I first made my living programming, 25 years ago, syntax was syntax. If you didn't have it absolutely correct you didn't get squat. There was no such thing as "close enough" or "works most of the time on most browsers." But web pages and browsers and officially sanctioned standards oriented code versus bogus-but-usually-works-anyway stuff is enough to drive you crazy.
My basic goal is this: I want to be able to embed videos and music in my blog and feel reasonably confident that I've done it in a way that will work on most any browser regardless of whether it is being used on a Mac or a PC.
Earlier today I found the little movie from Research Penn State, linked to in the previous post, as I was looking for how to handle XHTML Quicktime objects. It was working for me so I took a look at the source code and it looked pretty good. But then I found Apple's guide and started seeing some attributes that, according to Apple, don't even exist for Quicktime. Plus, my intent in this follow-up post was to embed the same movie in this post and then show how I had done it. But the first snag I ran into was in trying to scale it down, as I have done to other movies. I couldn't get it to scale down, but I'm also not sure that it is actually Quicktime source material, though it most likely is being streamed from a QTSS (Quicktime Streaming Server). And that was the other thing, I'm really not looking for ways to embed streamed movies in the first place.
So after those snags and a couple of hours on the phone and in video iChats with my dad, whose computer was blowing up, I finally got into the Apple guide and whittled it down to the fundamental parameters and options I felt I will need on a frequent basis, so I could make myself a cut-and-paste template to use for anytime I want to embed a video. That way I can just change the name of the source video and tweek the params as needed.
Then, once I found "the way" I decided I would share the code I used here, but that turned out to be a challenge in itself; the reason is because Blogger is such a great tool for blogging since, for a typical, text based blog, it handles most of the HTML so that you can just type away as though you are writing an email. But that same ease makes it nearly impossible to quote lines of code without it actually trying to execute them. Just commenting everything out was too messy and only adds confusing to the syntax and, besides, I think it ignores code comments in posts, anyway, but I found a way, and I'll get to that in a moment.
The basic part of my quest was getting to the bottom of how to embed without the EMBED tag, since the W3C says that's a no-no, even though it's been around for years and works great most of the time. In my earlier DEEP TIME post I mistakenly called their use of the EMBED tag bogus.
It is bogus, but you can't get away from using it, and here is the reason, according to Apple, which I think mostly comes down to the old IE 5 for Macs that I don't think any Mac user in their right mind is still using, since the arrival of Safari.
IE 5 for Macs will not execute Quicktime objects. It ignores them, completely, so if you want to embed Quicktime objects in a page, you need to still provide an EMBED tag as a fall back plan for IE on a Mac.
IE for Windows handles Quicktime objects okay, but you have to provide this funky long CLASSID info that only means something to IE/Active X, etc. It doesn't mean anything to a Mac browser, like Safari, but Safari just ignores it and handles the object anyway, looking out for the params that it does need.
So, your basic setup is to create and object which will work on most browsers, but also contains a fall-back EMBED tag for IE on Macs (and possibly other browsers with the same problem...I guess).
There are many optional parameters for embedding Quicktime objects, but 95% of the time you can get by on some very fundamental ones. These come down to defining what/where the actual source content is, what plug-in plays the object (where the user needs to go if they don't have it), the dimensions of the object (how big it will be on the page), where or not you want it to display the controls or just be a movie (or hidden entirely if that "movie" is really just music), whether or not the movie should start by itself or wait for the user to click the controls and, finally, whether or not you want it to run in Kiosk mode (which means the user cannot download and save the source file).
So, below is the source of what I used to embed the music video seen in my second post on this blog.
PLEASE NOTE: In order to display instead of execute the following code in this blog, I changed all the usual HTML brackets like "<" and ">" to parens, as in "(" and ")":
(object height="135" width="240" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab")
(param name="src" value="http://www.raindearmedia.net/CarbonHarbor/video/Carbon_Harbor_MV_Web1.mov" /)
(param name="scale" value="toFit" /)
(param name="controller" value="true" /)
(param name="autoplay" value="true" /)
(param name="kioskmode" value="false" /)
(embed height="135" width="240" pluginspage="http://www.apple.com/quicktime/download/" src="http://www.raindearmedia.net/CarbonHarbor/video/Carbon_Harbor_MV_Web1.mov" scale="toFit" controller="true" autoplay="true" kioskmode="false")
(/embed)
(/object)
I've tried this out on a Mac in both Safari and IE, commenting out first the object portion and then the EMBED portion, to see which browser was doing which. Safari is executing either method that it finds first. IE is only executing the EMBED portion.
I'm working on getting it tested in IE on a PC, but right now my video content requires Quicktime 7 and there is now only a beta version of QT7 available for PCs.
Also, there is one parameter I am using that I did not mention above; I am using the SCALE parameter. That is one you need if you want to re-size the display of a movie that is actually larger or smaller than what you want to display on the page. The values for parameter can be "toFit" or "Aspect." It's best to experiment to see which one you think works best for a particular movie. You don't need it to enlarge a display, but if you shrink a movie without it you will only mask out the portions that don't fit in the display size you make available.
I'm no expert on this stuff by any means, but this is what is working consistently for me.
Updated: Man this stuff is going to drive me nuts. Just did some more testing with IE and Firefox, on a Mac. Both seem to be doing the EMBED tag, but they are allocating the space for the OBJECT tag, so I am ending up with space for two entities (movie or MP3) with only the second space actually being occupied by the controller and content. I'm tempted to just go back to the damn EMBED command alone, since it seems to work fine, regardless of what the WC3 says about it, but I hesitate to make any changes until I see how this looks on a PC, running IE under a Windows OS.




0 Comments:
Post a Comment
Links to this post:
Create a Link
<< Home