Double dating musical nostalgia

“Double dating” is a concept my wife and I have talked about for a while; it’s where a piece of media — usually a movie or TV show — exhibits elements of two distinct time periods. Most commonly it results from the art being set in a particular time period, but unintentionally carrying distinctive elements of its own time period as well, which don’t really become apparent until much later. Think “Happy Days.” It’s set in the ’50s, but there are definitely elements (like hair styles) that are more characteristic of the ’70s era when the show was actually produced.

Over the past year or so, I’ve been having a lot of the same feelings towards the music of Com Truise. I discovered Com Truise (stage name of musician and graphic designer Seth Haley) around 2012 when his In Decay album was released. I immediately latched onto the hazy nostalgia it evoked for my early ’80s childhood and the exciting technologies of that era.

I listened to a lot of Com Truise from about 2012 to 2014. And now when I listen to this music, I have a different kind of nostalgia. I still feel that pull to my ’80s childhood, but I also have much more distinctive memories from the early 2010s to associate with the music as well. I had a lot of good things going on in those years. My business was relatively new and growing, my kids were in school and starting to have their own distinctive personalities, and I was just generally enjoying a lot of what was going on in the world because things seemed to be pointing in a positive direction.

I’ve lost a lot of that optimism over the past 8 years though. In a nutshell, it’s not so easy as a white person to ignore all of the terrible things other white people do in the world. And even as a light has been shone upon these transgressions, the worst among us are doubling down on bad behavior and destructive attitudes. Plus we have the increasingly frequent climate change-related disasters that only the most stubborn or brainwashed can continue to deny.

But there have been more personal struggles as well: aging (and then eventually dying) parents, the difficulties of adolescence for our kids, my own aging body, the souring of some aspects of my business (*cough* Gutenberg *cough*). There have been plenty of good things too though, especially around my involvement in music. But overall, I would give the past several years a negative score.

All of that does make me nostalgic for the halcyon days of the early 2010s, and that’s a period I strongly associate with the music of Com Truise.

An even dumber workaround for how dumb CSS hyphenation is

Look, it’s all well and good that CSS has a hyphens property. The problem is, that property is really dumb. It’s all-or-nothing, with no rhyme or reason to whether a word absolutely needs to be hyphenated. It will literally hyphenate any and every multi-syllable word at the end of a line.

You really almost never want that.

In my particular case, I’m looking at a very specific situation. Specific, but I am guessing probably the most common situation where a web developer wants a browser to hyphenate words: words in large headings that are too long to fit on a line. What I mean here is individual words that are by themselves too long to fit on a line, typically in a mobile browser, in headings with large or extra-wide fonts.

There are proposals to improve this, but there is currently nothing with broad browser support. So I invented my own.

This is a crafty little combination of CSS and JavaScript. (OK, technically it’s jQuery, but you could reasonably adapt this to vanilla JavaScript if that’s your thing. Since I’m deeply immersed in the jQuery world of WordPress, I just went with jQuery because it’s simpler for me that way.)

The first thing you need is a special CSS class for hyphenation. Since I only want it to apply on mobile devices, I gave it a logical name, and defined it in my CSS media query for the mobile breakpoint:

@media screen and (max-width: 782px) {
    .hyphenate-on-mobile {
        -webkit-hyphens: auto;
        hyphens: auto;
    }
}

OK, with that set up, then we just need a little jQuery function to determine where it’s going to be applied. I want it to get added automatically to any h1, h2, h3 or h4 tag. (I’m skipping h5 and h6 because they’re small enough text that we shouldn’t need it.) I also made the somewhat arbitrary decision to set the minimum word length at 15 letters. This is something you may need to adjust based on your font size. Here’s the jQuery:

jQuery('h1, h2, h3, h4').each(function() {
    var words = jQuery(this).text().split(' ');
    var i = 0;
    var hyphenate = false;
    while (i < words.length) {
        if (words[i].length >= 15) { hyphenate = true; break; }
        i++;
    }
    if (hyphenate) {
        jQuery(this).addClass('hyphenate-on-mobile');
    }
});

And then you just want to make sure that jQuery gets fired off when the page loads. It works!

What am I missing?

Let’s see. Something’s just not quite right. What am I missing?

It’s a never-ending quest to design the perfect website. Especially when the definition of “perfect” keeps changing. And when I have other things I should be doing than screwing around with my own site. But there you go. So as I explore the sites of people whose ideas and skills I admire, I often note things that I’m supposed to have on my site but don’t. What are those things right now?

There’s the paperclip:

Yeah, the whole “my website is really my desk” metaphor just doesn’t quite work with my aesthetic (such as it is), and besides I did a paperclip on an early iteration of a client’s site recently and it ended up being nixed. (Probably a good decision.)

Oh and there’s the giant pullquote in Georgia font:

OK now it’s starting to look like I’m just picking on Merlin. But really I’m just jealous. I wish I could get away with being named “Merlin.” (And be interesting and/or funny.)

I need lots of swirly doodads in retina-scorching colors, in a late ’60s psychedelic rock album and/or Camus paperback cover art style:

(In case you think this design technique is new, I own a paperback edition of Shakespeare’s The Tempest, which I believe dates back to the early 1970s, with a hand-drawn cover illustration to prove my point.)

But to be honest I’m just not good enough with Illustrator to pull something like that off (and my pen-holding muscles have atrophied after a decade plus of extensive computer use, so freehand is strictly out of the question).

Eventually it’ll come to me. In the meantime I’ll just keep doing my own thing. Yet another site redesign may be on its way sometime soon!

Something to counteract jazz violin

OK, first off let me say that I have finally arrived at an age where I can honestly and without shame say that, no sir, I just don’t really like A Prairie Home Companion that much. And that’s a tough statement to make as a born-and-bred die-hard self-styled intellectual liberal Minnesota DFLer. (That’s Minnesota’s slightly-more-liberal-and-even-more-union-friendly flavor of the Democratic party.) And I think the thing I dislike most about the program, more than Garrison Keillor’s meticulously cultivated faux-folksiness is the nauseating preponderance of jazz violin in the featured music. I hate jazz violin. (And I love the fact that it has yet to earn its own Wikipedia entry.)

Well, I’ve been working on some new music. In the spirit of the title of a track from the latest Joe Satriani album, I’m currently calling it “Dun Dun Tsh.” And right now I am really enjoying it because it’s drowning out the jazz violin that’s currently playing at the Caribou Coffee where I’m sitting as I write this. I’m not really sure how I’d classify this music, but it’s definitely inspired by the “electronic breakbeat jazz” work of Revolution Void.

Once I have a finished version I plan to release this as part of a new series of free downloads distributed under Creative Commons licensing.

For now, here’s a rough mix for you to enjoy. I said enjoy!

[audio:http://blog.room34.com/wp-content/uploads/underdog/dun-dun-tsh-03.mp3]