Goodbye, Wordpress

06 Sep 2009

I did it. I switched over from Wordpress to a completely static site: there is no more PHP (or Ruby or Python or anything other than static files) here.

I got super fed up with Wordpress the other day when I realized that the Markdown plugin I had been using was completely screwing with my line-endings (essentially running nl2br() on my posts). Rude. I could have messed with the source myself, but I got really nauseous doing that with my own custom theme hacks I did a while back. Combine that with the litany of Wordpress attacks out there and my general disdain for the WP codebase (and that I never supported nor plan on supporting comments), I figured this was inevitable.

I worked for a while on my own static site generator, but then I stumbled across Jekyll and was immediately impressed. It has support for Markdown, syntax highlighting (although its syntax highlighter and its Markdown engine are awkward together), and LaTeX:

$\int_{-\infty}^{\infty}{ e^{-x^2} dx } = \frac{\sqrt\pi}{2}$\int_{-\infty}^{\infty}{ e^{-x^2} dx } = \frac{\sqrt\pi}{2}

(Where $e:=\lim_{n\rightarrow\infty}\left(1+\frac{1}{n}\right)^n$. Inline math is cool.)

Of course Jekyll didn’t do everything I needed it to out of the box, so I forked it (and renamed its binary “rjekyll” because I’m creative). The main difference between the original and my fork is proper pagination and a few tweaks to the Pygments highlighting delegation.

Getting it all set up and running was a bit of a hassle and probably deserves its own post, but it actually wouldn’t be too hard for anyone to do given enough time.

The entire source for this site is available on my github repository for ParsedOut.com.

Multiple window.onload functions in JavaScript

01 Jun 2009

Writing in JavaScript often requires triggering code to execute after the page has finished loading (that is, when the Document Object Model DOM is ready).

Say you want to set the contents of the document’s <title> tag to the contents of the first <h1> tag. Here is the na”ive solution:

<html><head><title></title>
  <script type="text/javascript" charset="utf-8">
  
    document.title =
        document.getElementsByTagName('h1')[0].innerHTML;
  
  </script>
</head><body><h1>Hello!</h1></body></html>

The problem, of course, is that this is executed while still in the <head> section: before the <body> has even been seen. Thus, when we ask for document.getElementsByTagName('h1'), we will get null back, and this will cause an error.

The solution is to wait until after the document has loaded:

<html><head><title></title>
  <script type="text/javascript" charset="utf-8">
  
    window.onload = function() {
        document.title =
            document.getElementsByTagName('h1')[0].innerHTML;
    };
    
  </script>
</head><body><h1>Hello!</h1></body></html>

This sets up a “callback” that the browser knows to execute as soon as it’s loaded the whole Document.

The problem, though, is that we might want many such functions to execute. Lots of (or at least more than one) window.onload. And if we overwrite the contents of document.onload as we’ve done here, then we’ve shot the rest of our code in the foot and thrown it out to the curb to die.

The solution is to create a stack of functions to execute and simply add them one by one. Then set window.onload to pop off all the functions on the stack and execute them using the call() method for functions.

jQuery does this automatically. So we could simply have this in the <head> section:

<script type="text/javascript" charset="utf-8">

    $(function(){
        document.title = $("h1:first").html();
    });

</script>

…but if we didn’t have jQuery at our disposal, we could do this manually:

<html><head><title></title>
  <script type="text/javascript" charset="utf-8">
    
    // Prevent overwriting loadstack if it's already set:
    var loadstack = loadstack || [];
    
    // Add our function that changes the <title>
    // to the contents of the first <h1>:
    loadstack.push(function(){
        document.title =
            document.getElementsByTagName('h1')[0].innerHTML;
    });
    
    // ... lots of other additions to the loadstack ...

    // this *must* be the last code in the <head>
    // section's JS block (or at least the very last
    // thing to touch window.onload):
    
    if ( window.onload )
        loadstack.push(window.onload);
    
    window.onload = function()
    {
        while ( loadstack.length > 0 )
            // `this` will be bound to the window object
            // inside the called function
            loadstack.pop().call(this);
    };
  </script>
</head><body><h1>Hello!</h1></body></html>

Adding code to execute is simple as this:

loadstack.push(function(win){
    // code to execute here.
    // (win is the window object if you need it)
});

All said, I usually just use jQuery’s built-in handling of this, but it’s nice to know that it’s pretty easy to to it all ourselves if we had to.

Get and Set

27 Apr 2009

Although I work with Java on a regular basis at work, I’ve long been scared away from Java for personal projects based solely on its verbosity.

Rather than having object members (“properties”) be declared public, Java tends to have everything declared private and then accessed for reading/writing via “getters” and “setters.” So if a Document object has a title property, the Document class would likely have the methods String getTitle() and void setTitle(String t).

What is simpler, however, is to overload a method having the same name as the property. When called with no arguments, the method serves as the getter, and when called with a single argument, the method serves as a setter - setting the value to the indicated argument.

This is less verbose and more in-line with what happen “nowadays” with the more scripting-inclined languages like Ruby and PHP.

The old way:

Document d = new Document();
String oldTitle = d.getTitle();
d.setTitle("New Title");

The new way:

Document d = new Document();
String oldTitle = d.title();
d.title("New Title");

And here is a sample POJO “Plain Old Java Object” that utilizes this:

class MyDocument
{

    private String title;

    public MyDocument()
    {
    }

    public String title()
    {
        return title;
    }

    public void title(String t)
    {
        this.title = t;
    }

}

Just my $0.02.