Most people don’t think about what they name their computers. It’s just not important enough in peoples lives to be a question of relevance. But for us programmers who set naming conventions and coding standards, prefering convention over configuration, it seems like the next step to use see how these rules apply to naming other things in our lives. Remember – it’s all about having fun. You wouldn’t have a variable named Batman, but what’s to stop you from naming your computers after superheroes?

Naming Computer at Work

At one job I worked they took naming very seriously, in the fun way. All servers would be named after characters from The Matrix. So we might have a development server called Agent-Smith, or a database server called Trinity. If you’re connecting to a small set of servers, you won’t soon be confused over the names. It’s a great improvement over application-1, application-2, etc if you’re naming a small set of servers. There’s plenty of names to choose from. I wouldn’t recommend using the alternate Agent names though, unless you want to get Agent-Smith, Agent-Jones and Agent-Brown confused.

Desktop computers throughout the office were then named after Transformers. There’s plenty to select from, and it adds a personal touch to everyone’s computer. You could even take it a step farther and couple each computer with a Transformer. You could split the office into Decepticons and Autobots if you have a clear divide, and then the two sides can go to war — or something like that. It’s a lot easier to look at the network and see Starscream than “pc-rover-2245″. You can have all kinds of fun with this — big transformers are power computers, flying transformers are laptops.

Naming Computers at Home

My naming convention for devices in my home is largely copied from one of the above. All computers in my home are named after Matrix characters (aside from a few of my girlfriends devices which still need to fall inline). My computers that I use are named after human males – Link and Bane (Bane is the Windows partition on my Mac). Other devices of mine around the house that are named after male programs. So Keymaker is my router, my Drobo is Merovingian, portable hard drive is Seraph, my airport express is Trainman and our shared media center Mac Mini is Persephone (always coupled with Merovingian, you see?). At home you probably don’t have enough devices to really need much in the way of naming conventions, but if you have a few USB drives it suddenly makes a lot more sense.

Table of Elements

I don’t remember where I heard it, but someone mentioned to me that they’d organized their servers based on the periodic table of elements. Domain controllers would be noble gasses, halogens might be file servers, transition metals (which are the bulk of elements) could be desktops used by everyone in the office. There’s a few more groups built in for you to use, so long as you don’t have too many devices. This allows for a little more “professional” sounding names, or at least a different kind of nerdy.

Fun of Functional?

Whether you go with a fun or functional naming convention, or even have one at all, will depend on the atmosphere of where the devices will be. If you have a chance to have a little fun, go for it! Anyone have any other fun naming conventions they use or have heard about? Always looking for more examples.

When it comes to crossdomain quirks with frames and Ajax, there’s not usually a “good” solution — there’s just one that works. Something I was working on the other week had a “well it works” moment, although the solution was far from ideal.

The Problem

The page in question is the Sponsored These Tweeters page at SponsoredTweets. It’s a pretty basic WordPress page with an iFrame that contains the list of Tweeters. Real easy way of adding a dynamic touch to a WordPress site. The issue is that the iframe contains a dynamic amount of content, and could potentially grow or shrink based on the length of amount of tweeters being shown. The kicker? The page with the list of tweeters is at a subdomain, and under https.

Monitoring with Jquery

My first idea with anything like this is “Can I just listen for a jquery event on the element?”. Well, sure, but the height of the iframe won’t change. You’ll only be able to get the height/width of the iframe itself, not the content within it from the page itself, so watching for a resize or load event on the iframe won’t work. What you’re really wanting to listen for is a change in the height of the content

Works? No.

Reaching into the frame with contentWindow

If your frame and the page containing it both exist on the same domain, you can reach into DOM of the frame and get the height that way. At anytime you can do something like this to get the height of the page:

document.getElementById("iframeid")
         .contentWindow.document.body.scrollHeight

This bit of code will return an integer — the height of the content of the frame in pixels. Even if the iframe has a height of (for example) 300px, the content itself could be smaller or larger. Unfortunately you can’t set a jQuery event watcher on document.getElementById("iframeid").contentWindow.document.body either (at least from what I’ve seen), so I can’t see a way to watch for a change in height.

The “not-so-nice” fix for this is to make a really fast function that repeatedly checks a change in the height, and resizes the iframe accordingly. Here’s some sample code for this using jQuery.

var $iframe = $("#iframeid");
function resize_iframe() {
  var current_height = $iframe.css("height");
  if(current_height != $iframe[0].contentWindow.document.body.scrollHeight) {
    $iframe.css("height", $iframe[0].contentWindow.document.body.scrollHeight);
  }
}
setInterval("resize_iframe();", 100);

Everytime I use setTimeout() or setInterval() in Javascript, it’s immediately a red flag. These (along with the evil-eval) can be an obvious code smell, but also a trigger that the code itself isn’t designed in the best way.

The problem with this though is that it won’t quite be realtime. Also the contentWindow.document object is not available cross-domain. Even doing things like contentWindow.document.location.href to get the current location of the frame doesn’t work if the calling page and the frame are on different domains/subdomains. This might work for some cases, but not if your iframe is on a different domain.

Works? Yes.
Works on the same domain? Yes.
Works on different subdomains on the same domain? No.

The document.domain hack

If both your frame and your calling page exist on the same parent domain, there’s a little hack you can do to get this to work. Each page has a document.domain variable that contains the domain from which ajax calls can be made to. If you rails application is up at https://app.sponsoredtweets.com, then your document domain will be set to app.sponsoredtweets.com. Of course your main website sitting at http://sponsoredtweets.com will have a document.domain ot sponsoredtweets.com. Because of this they won’t be able to talk to each other. What you can do is manually change the document.domain value.

Surprisingly enough, you can tweak this value as long as you only get broader in your domain. For instance, if document.domain is app.sponsoredtweets.com, then you’ll be able to manually set this using something like this: document.domain = "sponsoredtweets.com" From that point on, that page will be treated as those requests were coming/going to that domain. Using this, you could set your iframe and the page containing the iframe to be on the same root domain, then reach into it’s contentHeight as described above. After you’ve set this to “sponsoredtweets.com” though, you won’t be able to change it again, as that’s the most general a document.domain can get.

Works on the same domain? Yep.
Works on different subdomains on the same domain? Yes.
Works crossdomain? No.
Works across https? No.

Frame within a Frame within a Frame

Unfortunately, none of this works across domain, of from http connections to https. Here’s how it works for SponsoredTweets:

The main page is http://sponsoredtweets.com/tweeters/sponsor-these-tweeters/, aka, the parent page.
Which has a frame to https://app.sponsoredtweets.com/tweeters, aka, the content page.
Which has a frame to http://sponsoredtweets.com/iframe.html, aka, the placeholder page.

The middle frame is the one that will change in height of course. For the same reasons as above, the middle frame cannot reach into it’s parent frame and call methods there either. It can, however, control it’s own iframe in a very limited sense. For instance, take this line from the

$("#parent_domain")[0].contentWindow.location = 'http://sponsoredtweets.com/iframe.html#' + height;

Whenever the height of the content page changes, it updates the location of it’s frame to include a hash tag followed by the current height of the content. By itself this won’t do anything, but if that iframe.html page is watching for changes to it’s location, we can start from there.

The placeholder page is what makes this all possible. All it has to do is monitor for changes to it’s hash, and when it sees them, send them up to the parent page (that is, the top level page). Now, although the content page can’t talk to it’s parent page, the placeholder page can talk to it since they are both on the same domain. Is it a hack? Oh yeah, and of the worst kind.

<html>
<script type="text/javascript">
<!--
  function sendHash() {
    var location = window.location.href.split("#")
    if(location.length != 2) { return; }
    parent.parent.receiveHash(location[1]);
  }
  setInterval("sendHash();", 100);
-->
</script>
<body></body>
</html>

parent.parent…? Yeah, thanks HTML. All the receiveHash() function on the parent page does is take a number and set it as the height of it’s iframe. Real simple implementation, it’s just the craziness that is cross-domain security that makes it difficult to grasp.

Works across https? Yes!

Got a Better Solution?

I can’t believe this would be the ideal way to do something as simple as resize an iframe. Do you know of a better way of doing this given that the pages exist on separate domains? I’d love to hear about it.

I’m sure everyone has experienced this: you’re reading their feeds and all of the sudden one of them has 20 new entries. Did the author of that feed suddenly go wild and start posting? Maybe they’re at a special event and posting about it? No, usually it’s just an error in the RSS feed where somehow the timestamps of the entries are different, causing your feedreader of choice to show you 19 articles that you’ve already read. This used to be very annoying, but now a days it happens so often I barely notice it — just click over to that feed, click ‘mark all as read’, and go on to the next feed.

One of the easiest ways to get around this is not to rely on your website to host your RSS feed. Setting up your blog to use FeedBurner is so trivially easy, that it should be one the first time for you to do with a new WordPress installation. Really simple steps to do it to. You ready?

Install the WordPress Plugin

Install the FeedSmith plugin. Directions and plugin link on the Google support page, so it’s pretty straightforward. Just upload the plugin and activate it from the plugins panel.

Update your .htaccess file

Update your .htaccess file to rewrite your /feed link. This will allow people to actually add your local feed link to feedreaders, then if the destination changes it won’t affect your users. For instance, if someone adds http://adamfortuna.com/feed to their feedreader, right now it’ll just redirect to FeedBurner. Later on this might go somewhere else, but I can do that without worrying about losing my (tiny) readership.

Very easy to do – and worth setting up if you plan on having your blog around for a while. Also it greatly reduces your server load not having to rely on your feed being checked every minute by loads of feed readers.