technica page 34 - Dave's Blog

Linking to or Embedding a Portion of a Video

I'm excited by HTML5's video tag as are plenty of other people. Once that comes about and once media fragments are adopted, linking to or embedding a portion of a video will be as easy as using the correct fragment on your URL thanks to the Media Fragments WG who has been hard at work since the last time I looked at fragments.

However, until that work is embraced by browsers, embedding portions of videos will continue to require work specific to the site from which you are embedding the video. On the YouTube blog they wrote about how to "link to the best parts in your videos", using a fragment syntax like '#t=1m15s' to start playback of the associated video at 1 minute and 15 seconds. Of course if you want to embed part of a Hulu video it will be different. Although I haven't found an authoritative source describing the URL syntax to use, you can follow Hulu's video guide on linking to part of a video and note how the URL changes as you adjust the slider on the time-line. It looks like their syntax for linking to a Hulu page is to add '?c=[start time in seconds](:[end time in seconds])' with the colon and end time optional in order to link to a portion of a video. And the syntax for embedding appears to be "http://www.hulu.com/embed/.../[start time in seconds](/[end time in seconds])" again with the end time optional.

For more sites, check out the Media Fragments WG's list of existing applications' proprietary fragmenting schemes.

OpenSearchDescriptionToHTML Tool

I've made an OpenSearchDescriptionToHTML XSLT that given an OpenSearch description file produces HTML that describes that file, lets you install it, or search with it. For example, here's a Google OpenSearch description that uses my OpenSearchDescriptionToHTML XSLT.

I had just created an OpenSearch description for WolframAlpha at work and was going about the process of adding another install link to my search provider page so that I could install it. Thinking about it, I realized I could apply an XSLT to the OpenSearch description XML to produce the HTML automatically so I wouldn't have to modify additional documents everytime I create and want to install a new OpenSearch description. While I was in there writing the XSLT I figure why not let the user try out searching with the OpenSearch description file too. And lastly I made the XSLT apply to itself to produce HTML describing its own usage.

Incidentally, I added WolframAlpha at work to replace my FileInfo search provider for the purposes of searching for information about particular Unicode characters. For instance, look at WolframAlpha's lovely output for this search for "Bopomofo zh".

A Brief History of Microsoft's Live Search's New Domain Bing

• 2003 July: The first archived version of bing.com features "bing! is a small device (e.g., possibly even a small Band-Aid(R)-like sticker!) that vibrates when a person's cell phone rings." I can't recall 2003 cell phones, were they big enough to require this device?
• 2004 August: Site for the same device is rewritten and looks much better, IMHO.
• 2006 June: The domain is now parked by easyDNS. I guess the "bing!" device didn't work out?
• 2006 November: Its now "BING*" and they won't say what they're working on ("we're still in stealth mode") but they are hiring C#/.NET developers.
• 2007 January: And they're gone. Without even exiting stealth mode. Too bad, I liked their logo. Their domain is now for sale...
• 2007 February: Looks like EasyMail buys the domain and offers a physical mailing service in Australia: "By simply clicking a button on your computer, mail is beamed electronically to a bing post office. Your mail is automatically printed, folded, enveloped and dispatched into the Australia Post network the very same day."
• Present: Now its the new home for Live Search of course.

The new name reminds me of the show Friends. Also, I hope they get a new favicon - I don't enjoy the stretched 'b' nor its color scheme.

Infrared Paint Link Roundup

I like the idea of QR codes, encoding URLs and placing them on real world objects, but the QR codes themselves are kind of ugly. To make them less obvious I thought I could spray QR codes on to an object with an infrared reflective paint and shine infrared light on the QR codes, since most cameras, for instance the camera in my G1 phone, pick up infrared that our eyes do not.

In my search for infrared paint I've found a seller of IR ink (via programming forum) and an Infrared Paint Recipe (via IR FAQ).

In looking for this paint I've found that it comes up a lot in relation to the military for things like paint markers that are visible at night with proper equipment, and paint that absorbs IR light to make vehicles less obvious to night vision goggles. Even though the first reflects infrared light and the second absorbs it websites end up refering to both as infrared paint which made it difficult to search.

Additionally I found links to some other geeky infrared projects:

• Infrared goggles that block out all light except for the edge of infrared light that humans can perceive.
• A project to make infrared patterns and paint to screw with tourist video/photos.

Browser Versions Over Time

In honor of Google Chrome's recent v2 release and because I read they don't make too big a deal about version numbers, I thought to create a graph of browser major version numbers over time.

Yeah that's not too useful of a graph. I got the release dates from Wikipedia of course.

As you can see from the graph, Netscape and Opera are leading all other browsers in terms of major version number. The other browsers really need to get on that.

Netflix CSRF - Stolen Thoughts

Looking at the HTTP traffic of Netflix under Fiddler I could see the HTTP request that added a movie to my queue and didn't see anything obvious that would prevent a CSRF. Sure enough its pretty easy to create a page that, if the user has set Netflix to auto-login, will add movies to the user's queue without their knowledge. I thought this was pretty neat, because I could finally get people to watch Primer. However, when I searched for Netflix CSRF I found that this issue has been known and reported to Netflix since 2006. Again my thoughts stolen from me and the theif doesn't even have the common decency to let me have the thought first!

With this issue known for nearly three years its hard to continue calling it an issue. Really they should just document it in their API docs and be done with it. Who knows what Netflix based web sites and services they'll break if they try to change this behavior? For instance, follow this link to add my Netflix recommended movies to your queue.

Send URL to Cellphone - QR Encode Accelerator

I've made a QR Encode accelerator around Google Chart's QR code generator. QR codes are 2D bar-codes that can store (among other things) URLs and have good support on mobile phones. The accelerator I've written lets you generate a QR code for a selected link and view it in the preview window. In combination with the ZXing bar-code scanner app for my Android cellphone, its easy for me to right click on a link in IE8 on my desktop PC, hover over the QR Encode accelerator to have the link's associated QR code displayed, and then with my phone read that QR code to open my phone's browser to the URL contained inside. Its much easier to browse around in the comfort of my desktop and only send particular URLs to my cellphone as necessary.

Flickr Visual Search in IE8

A while ago I promised to say how an xsltproc Meddler script would be useful and the general answer is its useful for hooking up a client application that wants data from the web in a particular XML format and the data is available on the web but in another XML format. The specific case for this post is a Flickr Search service that includes IE8 Visual Search Suggestions. IE8 wants the Visual Search Suggestions XML format and Flickr gives out search data in their Flickr web API XML format.

So I wrote an XSLT to convert from Flickr Search XML to Visual Suggestions XML and used my xsltproc Meddler script to actually apply this xslt.

After getting this all working I've placed the result in two places: (1) I've updated the xsltproc Meddler script to include this XSLT and an XML file to install it as a search provider - although you'll need to edit the XML to include your own Flickr API key. (2) I've created a service for this so you can just install the Flickr search provider if you're interested in having the functionality and don't care about the implementation. Additionally, to the search provider I've added accelerator preview support to show the Flickr slideshow which I think looks snazzy.

Doing a quick search for this it looks like there's at least one other such implementation, but mine has the distinction of being done through XSLT which I provide, updated XML namespaces to work with the released version of IE8, and I made it so you know its good.

Thoughts on registerProtocolHandler in HTML 5

I'm a big fan of the concept of registerProtocolHandler in HTML 5 and in FireFox 3, but not quite the implementation. From a high level, it allows web apps to register themselves as handlers of an URL scheme so for (the canonical) example, GMail can register for the mailto URL scheme. I like the concept:

• Better integration of web apps with your system.
• Its easy for web apps to do.
• Links to URNs can now take the user to the sites the user prefers for the sort of thing identified by the URN. For example, if I have a physical address in HTML, instead of making that an http link to Yahoo Maps, I can make the link a geo scheme URI and those who follow the link will get their preferred mapping site that has registered for that scheme. Actually, looking at the geo scheme's RFC, maybe I'd rather use some other URN scheme to represent the physical location, but you get the point.

• There's no way to know if you are the handler for a particular URL scheme which is an important question for web app URL protocol handler authors.
• There's no way to fallback to an http URL in the case that a particular URL scheme isn't registered. A suggested solution to testing the registration of a scheme is for browsers to provide an additional script method to check if a scheme is registered. I don't like the idea of writing script that walks over all my page's links and rewrites them based on that method. I'd much rather see a declarative and backwards compatible fallback mechanism, although I don't know what that would look like.
• There's no way to register for a namespace within the urn scheme URI, the info scheme URI, or the tag scheme URI. I want to register info:lccn/... (Library of Congress Card Number identifiers) to LibraryThing or Amazon and I want to register urn:duri:... (dated URIs) to the Web Archive, among other things.


• Will this result in a proliferation of unregistered URL schemes with clashing namespaces? The ESW Wiki notes why this would be bad.
• And last, although this is nitpickier than the rest, I don't like the '%s' syntax used in the registration method. I'd much rather pass in an URL template, like the URL template used in OpenSearch. If an URL template is used for matching rather than registering against a particular URL scheme, this could also allow for registering a namespace within a URN. For example something along the lines of: registerProtocolHandler("info:lccn/{lccnID}", "htttp://www.librarything.com/search_works.php?q={lccnID}", "LibraryThing LCCN")

Outline View Internet Explorer Extension

I've made another extension for IE8, Outline View, which gives you a side bar in IE that displays an outline of the current page and lets you make intrapage bookmarks.

The outline is generated based on the heading tags in the document (e.g. h1, h2, etc), kind of like what W3C's Semantic data extractor tool displays for an outline. So if the page doesn't use heading tags the way the HTML spec intended or just sticks img tags in them, then the outline doesn't look so hot. On a page that does use headings as intended though it looks really good. For instance a section from the HTML 4 spec shows up quite nicely and I find its actually useful to be able to jump around to the different sections. Actually, I've been surprised going to various blogs how well the outline view is actually working -- I thought a lot more webdevs would be abusing their heading tags.

I've also added intrapage bookmarks. When you make a text selection and clear it, that selected text is added as a temporary intrapage bookmark which shows up in the correct place in the outline. You can navigate to the bookmark or right click to make it permanent. Right now I'm storing the permanent intrapage bookmarks in IE8's new per-domain DOM storage because I wanted to avoid writing code to synchronize a cross process store of bookmarks, it allowed me to play with the DOM storage a bit, and the bookmarks will get cleared appropriately when the user clears their history via the control panel.

Internet Explorer 8 Released

IE8, the software I've been working on for some time now, has finally been released at MIX09.

• Download IE8.
• Dean's MIX09 Keynote releasing IE8 is viewable here.
• Louis pointed me to this humorous IE8 advertising that doesn't make me cringe. On the contrary it has Ask a Ninja, Janeane Garofalo, and several comedians I recall collectively from either 'I Love the [decade]' or 'Best Week Ever'.
• It seems like only a year ago that IE8 Beta was released.
• IE Blog: IE8 Released.

Notes on Creating Internet Explorer Extensions in C++ and COM

Working on Internet Explorer extensions in C++ & COM, I had to relearn or rediscover how to do several totally basic and important things. To save myself and possibly others trouble in the future, here's some pertinent links and tips.

First you must choose your IE extensibility point. Here's a very short list of the few I've used:

• Explorer Bars and IE Toolbars
• IE Tools, IE Help, and IE Context Menu menu items
• IE Toolbar Buttons

Once you've created your COM object that implements IObjectWithSite and whatever other interfaces your extensibility point requires as described in the above links you'll see your SetSite method get called by IE. You might want to know how to get the top level browser object from the IUnknown site object passed in via that method.

After that you may also want to listen for some events from the browser. To do this you'll need to:

1. Implement the dispinterface that has the event you want. For instance DWebBrowserEvents2, or HTMLDocumentEvents, or HTMLWindowEvents2. You'll have to search around in that area of the documentation to find the event you're looking for.
2. Register for events using AtlAdvise. The object you need to subscribe to depends on the events you want. For example, DWebBrowserEvents2 come from the webbrowser object, HTMLDocumentEvents come from the document object assuming its an HTML document (I obtained via get_Document method on the webbrowser), and HTMLWindowEvents2 come from the window object (which oddly I obtained via calling the get_script method on the document object). Note that depending on when your SetSite method is called the document may not exist yet. For my extension I signed up for browser events immediately and then listened for events like NavigateComplete before signing up for document and window events.
3. Implement IDispatch. The Invoke method will get called with event notifications from the dispinterfaces you sign up for in AtlAdvise. Implementing Invoke manually is a slight pain as all the parameters come in as VARIANTs and are in reverse order. There's some ATL macros that may make this easier but I didn't bother.
4. Call AtlUnadvise at some point -- at the latest when SetSite is called again and your site object changes.

If you want to check if an IHTMLElement is not visible on screen due how the page is scrolled, try comparing the Body or Document Element's client height and width, which appears to be the dimensions of the visible document area, to the element's bounding client rect which appears to be its position relative to the upper left corner of the visible document area. I've found this to be working for me so far, but I'm not positive that frames, iframes, zooming, editable document areas, etc won't mess this up.

Be sure to use pointers you get from the IWebBrowser/IHTMLDocument/etc. only on the thread on which you obtained the pointer or correctly marshal the pointers to other threads to avoid weird crashes and hangs.

Obtaining the HTML document of a subframe is slightly more complicated then you might hope. On the other hand this might be resolved by the new to IE8 method IHTMLFrameElement3::get_contentDocument

Check out Eric's IE blog post on IE extensibility which has some great links on this topic as well.

The 'Is It UTF-8?' Quick and Dirty Test

I've found while debugging networking in IE its often useful to quickly tell if a string is encoded in UTF-8. You can check for the Byte Order Mark (EF BB BF in UTF-8) but, I rarely see the BOM on UTF-8 strings. Instead I apply a quick and dirty UTF-8 test that takes advantage of the well-formed UTF-8 restrictions.

Unlike other multibyte character encoding forms (see Windows supported character sets or IANA's list of character sets), for example Big5, where sticking together any two bytes is more likely than not to give a valid byte sequence, UTF-8 is more restrictive. And unlike other multibyte character encodings, UTF-8 bytes may be taken out of context and one can still know that its a single byte character, the starting byte of a three byte sequence, etc.

The full rules for well-formed UTF-8 are a little too complicated for me to commit to memory. Instead I've got my own simpler (this is the quick part) set of rules that will be mostly correct (this is the dirty part). For as many bytes in the string as you care to examine, check the most significant digit of the byte:

F:

This is byte 1 of a 4 byte encoded codepoint and must be followed by 3 trail bytes.

E:

This is byte 1 of a 3 byte encoded codepoint and must be followed by 2 trail bytes.

C..D:

This is byte 1 of a 2 byte encoded codepoint and must be followed by 1 trail byte.

8..B:

This is a trail byte.

0..7:

This is a single byte encoded codepoint.

Subst Allows Non-Letter Drive Letters

I knew that the command line tool subst would create virtual drives that map to existing directories but I didn't know that subst lets you name the virtual drives with characters that aren't US-ASCII letters. For instance you can run 'subst 4: C:\windows' and then 'more 4:\win.ini' to dump C:\windows\win.ini. This also works for non-US-ASCII characters like, "Ｃ" (aka U+FF23, Fullwidth Latin Capital Letter C), which when displayed by cmd.exe via some best fit style character conversions looks just like the regular US-ASCII 'C'. None of Explorer, IE, or the common file dialogs allow the use of these odd virtual drives -- just cmd.exe, so I'm not sure how this would ever be useful but I thought it was odd and I wanted to share.

RemoteOpen Tool

On my laptop at work I often get mail with attached files the application for which I only have installed on my main computer. Tired of having to save the file on the laptop and then find it on the network via my other computer, I wrote remoteopen two nights ago. With this I open the file on my laptop and remoteopen sends it to be opened on my main computer. Overkill for this issue but it felt good to write a quick tool that solves my problem.

Sarah and I Are Engaged

Over the previous weekend Sarah and I got engaged. I had a limo pick us up and take us to a park that has a beautiful view of the Seattle skyline where I proposed, then out for dinner and drinks including a bottle of wine for the ride back. What's the point of a limo ride if you don't drink while being driven around? It was a nice night and only had a hint of rain when we came home. We don't yet have a date set.