Sunday, February 7, 2010
I'm not much of a web programmer. I can usually hack things together, but I've never done anything serious. What I have done has largely been server-side, so I'm basically a noob when it comes to JavaScript. That said, I really want to get Pear Note to the point where users can share their notes with others that don't use Pear Note. The best possibility for that is obviously the web, so I've been digging into JavaScript.
Pear Note records to QuickTime movies, and QuickTime is commonly found in users' web browsers. So, I started looking into scripting QuickTime to link its playback with some text (like Pear Note does). I of course stumbled a bit due to my lack of experience, but things went fairly smoothly. I followed some of the examples in Apple's documentation, used their AC_QuickTime.js script to embed the movie in a cross-browser way, and things eventually started working. I'd been testing in Safari (my standard browser), so I then tested in Firefox. There were a couple of little things that Safari had been forgiving on, but after a quick fix it worked in Firefox as well.
Then I tested in IE...
Neither IE7 nor IE8 worked at all (I didn't even try IE6). Per the Apple example, if the movie was named aMovie, I addressed it as document.aMovie. IE said that document had no such property, despite Apple's documentation saying this would work. I walked through the DOM tree and found the <object> for the movie, and things started working when I used that instead. The code I used to search for the movie is essentially:
var movie = false;
function searchForMovie(node) {
if (node && node.childNodes) {
for (var i=0;i<node.childNodes.length;i++) {
var el = node.childNodes[i];
if ((typeof el === "object") && el.tagName && /^object$/i.test(el.tagName)) {
if (el.GetMovieName() === "aMovie") {
return el;
}
}
var childResult = searchForMovie(el);
if (childResult !== false) {
return childResult;
}
}
}
return false;
};
function getMovie() {
if (movie === false) {
if (document.aMovie) {
movie = document.aMovie;
}
else {
var searchResults = searchForMovie(document.body);
if (searchResults !== false) {
movie = searchResults;
}
}
}
};
getMovie() first checks to see if there is a document.aMovie. If not, it will call searchForMovie() on the <body> element, which calls itself recursively until it finds an <object> with a movie name of aMovie. If it finds anything, it sets a variable (movie) to save the node for use by other functions later.
It's obviously a complete hack. It assumes that the only <object> tags will be QuickTime movies. I could not find a useful way to test if an <object> was actually a QuickTime movie or something else. So, if you're struggling with this as I was, know that there is hope and this is one way to script QuickTime in IE. If you're an experienced web developer and shaking your head at how badly I did this, please leave a comment or shoot me an email to tell me how I should have done this.
Comments
There are no comments yet
Add a comment