[station 6] trans am crashed with vic in his dank apartment

The dynamic portions of these papers tiger (thankfully) don't work in the email version. Try the web to toy with the code.

In our previous installment, playlist 7 scripted the playlist elements in the YouTube player on the client and let you poke at the code. In that post, and previous code-forward posts, editing the code doesn't do anything. In general, re-evaluating a pile of javascript on top if itself isn't a great idea anyhow. Here, we're borrowing a feature from our security friends – the iframe sandbox.

Although I still think of <iframe> as a new feature in html, it's probably older than some of my readers. An iframe is a new document contained in a DOM element that can be incorporated into the parent document pretty much like a <div>. Why are they called iframes instead of just frames? Well, the "i" is for "inline", which sounds so obvious that it should be unnecessary but for the fact of the older html <frame> tag. The <frame> tag was the lungfish of the dynamic web. Before AJAX, before XMLHttpRequest, in fact before XML 1.0 itself, <frame> let authors create an area of a web page for navigation that could be used to reload contents in another frame. At the time, there was practically no other way to load dynamic content. This was the same era that spawned languages like PHP and technologies like XSLT. Without some support on the server side, there was no way to perform any of the content transformations possible today in the DOM.

Because <iframe> contains a new document, it contains a new javascript context also. In this installment, we're going to load the YouTube iframe player together with the script elements into a new sandboxed iframe – a skeleton document packed into a data URL. That frame can't communicate with the parent in a practical way, so it's essentially idempotent with respect to the parent frame – but not with respect to the rest of the internet. With every change to the code, the iframe is completely reinstantiated.

If an iframe is essentially a sandbox itself, why does it need a special extra sandbox attribute? Because iframes are older than cybersecurity. That's why. They are older than google. Almost older than the idea that you would type your bank account or credit card number into a browser. Without the series of ad-hoc remediations that have since been applied, the iframe was basically a one-tag man-in-the-middle attack built into the browser. Oops.

Edit any of the code in the orange boxes. Press the re-evaluate button at the bottom to recycle the iframe with the new code, or press shift-enter while editing one of the boxes to reevaluate immediately.

There are some quirks associated with the frame arrangement but it works well enough that I was able to write some of the final code for this post within a draft version of this post on ghost.

I remember sitting at a hotel bar in Princeton, NJ with Vic sometime around 2006. After Vic remarked that kids today just don't know how to drink properly, we stumbled over to Princeton Record Exchange and looked for some newer Trans Am stuff (probably Liberation). Little did I know at the time that the band had flopped on his floor while touring Madison a few years earlier.