Not something that’s happened to me before. I’d like to think its due to a natural course of development and not some super fertility drug injected at the chicken factory.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Congratulations Daisy, It’s Twins!

I make this recommendation with a bit of hesitance though, as the total running time is a bit over 90 minutes. I actually skipped the last third or so of the first video (slicing the PSD). But there is something strangely mesmerizing about watching someone else progress through their work like this. It’s also interesting for me to see someone else’s work flow and tools use.

The presenter/author, Jeffrey Way, states that the tutorial is for beginners, but I’d say that it edges closer to the intermediate level. The CSS section, though long, progresses pretty quickly. You have to already be pretty familiar with the selectors syntax. And he moves right passed terms like “inline” and “block”.

If you’ve got the time and the inclination, it’s an excellent howto for that area of web work.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

A Thorough Video Tutorial for Slicing and CSSing

The questions, as you might expect, pretty much stay focused on his work in TV (i.e. there’s no childhood memories or ‘how I met my wife’ stories). I had never heard an interview with him, so this was fun for me. He comes across as a light-hearted, nice man.

One of the more interesting tidbits was the fact that IT Crowd seemed to take form in his head after the title was suggested by his wife. He then goes on to mention that the show really was built around the character of Moss. Everything began to fall in place once Richard Ayoade was cast in that part.

The show, in a way, was built around him. I cast him before anyone else. In conjunction with the title, he was another thing that made me think “Oh, this is coming together”.

(~26:20 in the interview)

(For some odd reason, the clip they play immediately following that statement is one that features Roy, not Moss.)

I guess the producers (who include Linehan) of the American version of the show also feel he’s pivotal to its success. Instead of finding some LA doppelganger to fill the spot, he was transported across the ocean for their version. (What’s the deal with that anyway? When does “mid-season” start?)

You can listen here or listen elsewhere.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Graham Linehan Interviewed at TSOYA

Today he forwarded an email he received, asking if he should be concerned. It begins with “On Thu, 30 Oct 2008 00:05:53 +0700 we received a third party complaint of invalid domain contact information in the Whois database for this domain” and then goes on to say they investigated, found the information to be incorrect and canceled the domain.

The domain has subsequently been purchased by another party. You will need to contact them for any further inquiries regarding the domain.

So I went to enom.com (directly, not via the link in the email…which, if you look, turns out not to be to enom.com) and they have a warning posted front and center.

The warning includes a link to an image of the text of the email (note that the plain text version they show reveals the bogus enom.com link).

So, if you’ve got any domains registered via eNom, beware of this scam. And remember to never follow the links (always go directly to the site) when you receive an email like this.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Warning: eNom Email Phishing Scam

At work the other day there was a defect filed in which an extremely long (but simple) equation was causing an expression evaluator to crash. The equation was just a really long string like “6+5+1-3-7+3+6...“. The end result of that equation wasn’t really important, but I was curious.

My normal train of thought is to first decide that I’d have to type each number, one by one, into Microsoft’s Calculator. Next I’ll think “I should just write a quick script to add those up”. But that day, something else occurred to me: “I wonder if I can just paste it right in”?

And you know what? You can!

Try it out:

4 + 2 / 3 = 4.6666666666666666666666666666667

Oops. Can I adjust the order of operation?

(4 + 2) / 3 = 2

Yep!

Kind of ridiculous, I know. But sooner or later you’ll come across some scenario where you’ve got a string full of pluses and minuses and really, all you need is the result. And when that day arrives, you’ll thank me for this nugget.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Pasting the Equation into Microsoft’s Calculator

~~~~~~~~~~~~~~~~ This has been a woolie posting.

To Move ↑ You Must Have ♥

Saturday Morning Breakfast Cereal is hi-larious.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

The Dreary Reality

But if you look down at the comments (you have to “expand all”), number eight mentions:

Have you thought about using the html selector when adding two images? One on html and one on the body.

So the author updated example number three with styling rules that, in part, look like this:

html 
{
	background: #73ADD7 url(images/gradient.gif) repeat-x;
}
body 
{
	background: url(images/sky.jpg) no-repeat center top;
}

I would have never thought to add a background image to the HTML element. Is that legal?

Valid?

The example page passes validation for transitional doc types and for strict (the warning is given for overriding the doctype).

However, the CSS 2.1 recommendation says:

For HTML documents, however, we recommend that authors specify the background for the BODY element rather than the HTML element.

The CSS 3.0 draft does not seem to include a statement either way, though it does state that it “includes and extends the functionality of CSS level 2 [CSS21]….” (see the Abstract).

So even though there is a recommendation against doing this, it does pass muster with the validation service.

In the long run, though, it is somewhat of a moot point. This is because CSS 3 includes the ability to define multiple background images for one element.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Using the HTML Element for Background Images

It’s incredibly easy to use. The URL entry method allows you to paste in multiple image paths at once. After you click “Smush”, you are (quickly) presented with a table linking to each of the new images along with some stats regarding the amount of reduction. Also very cool is that all of the processed images can be downloaded as a single, automatically generated zip file.

What’s more is that the total savings and zip file stay updated even during multiple “smushes”. Even when the images are added via different methods. For instance, I did a single URL first. Then I removed that URL from the entry area and did a bunch at once. At some point I also just uploaded a single file. After all that, the stats updated to reflect the total reductions and the zip file link contained all the new images.

Obvious Usage Tip ™

I’ve been using FireFTP for awhile now. It’s a great FTP client that plugs directly into Firefox. When viewing files on your server, you can select one and hit <CTRL>+U to copy the URL (as opposed to the server’s file path). To be able to do this though, you first have to edit that connection’s “Advanced” settings so that FireFTP will know how to construct the url.

For example, here’s my settings:

And for bonus points, you can select multiple files, hit <CTRL>+U and it will paste all the URL’s as a list. So if you’ve got a single directory with a bunch of image files in it, just <Ctrl>+A select them all, copy the URL’s and then with one quick paste into SmushIt’s URL loader, it’s all done. You’ve got a zip you can download and use to overwrite all the old, fat images with their new, slimmed versions.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Yahoo’s “Smush It” Image Size Reduction Service

The epic Sea Lion was intended to be a world music album, but reverb and psychedelic pop crept in to create a unique mixture of exotic sounds, accomplished with an impressive array of instruments—from steel-string ukulele to djembe drums to pots and pans, all set upon a cozy cushion of synths and cassette samples.

I can’t wait to listen to some of these songs with my daughter during the morning ride to school. Did you listen to “Tane Mahuta”?! How’s that for starting your day!

I just remembered how I found this, so for posterity:

Waxy Links for September 25, 2008 —> Shrub —> Shrub Example

~~~~~~~~~~~~~~~~ This has been a woolie posting.

The Ruby Suns

How would you convey, with a single image, that sense of emptiness felt when your home suddenly shifts from “full of life” to “just you”? What would remain of the kids once they and all of their belongings are gone? And beyond showing the past, there’s also the idea of a lost future. The one where the children don’t leave, but instead grow and learn and live in your house. How do you indicate what didn’t get to happen?

Like this:

David Drummond explains:

The idea for this cover came from a wall in our house where our kids marked their heights from an early age. I am sure the same wall can be found in any house with children. In the case of the wall markings on the cover there is only one or two entries, as it were, because the children were not there long enough.

I don’t think you have to be a parent for this to have an impact. Those few markings so low to the floor, and all that empty space reaching to the ceiling, is too powerful. I honestly don’t think I would have realized this had the explanation not been given, and I’m glad it was.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

More Room to Grow

There are countless solutions to this available via the normal searching mechanisms. I have to give credit to my first encounter of the solution I like the best: a “Background height problem” forum post with the solution being the very first response. The <img> element at the bottom of poster’s content could be modified with the “clear: both” style applied to it. The solution also points to this excellent article, “Clearing a float container without source markup“, which goes into some great detail (a must read).

So here’s my quick tutorial on the matter. For this to be worth while, you’ll need to be following along in Firefox. And again, for more details, please read the “Easy Clearing” article linked to above.

1. The Setup

A quick and easy two column design starts with three divs: the container, the left column and the right column (Amen).

<div id="container">
 
	<div id="left">
        <p>To the left.</p>
	</div>
 
	<div id="right">
        <p>To the right.</p>
	</div>
 
</div>

Let’s add some styling to make them distinguishable from each other. We’ll give the container a think, red dotted border. The left side gets a normal green border and, for the right, something blue.

#container
{
    border: thick dotted red;
    width: 610px;
}
#left
{
    border: thin solid green;
    width: 400px;
}
#right
{
    border: thin solid blue;
    width: 200px;
}

Here’s what we’ve got so far. I like how the big red dots seem to hug all the content, don’t you? Also notice we’ve given explicit width values, which are required for floating elements (added next).

2. Lorem Ipsum Floats

Let’s columnize it with a quick edit to our CSS. The “left” div will float left, and the “right” div will float…let me think….oh yeah…right!

#left
{
    float: left;
    border: thin solid green;
    width: 400px;
}
#right
{
    float: right;
    border: thin solid blue;
    width: 200px;
}

I can’t wait to F5 this sucker and see our cool new columns.

Whoops. No more hugging!?!?

When an element is given the float property, it’s removed from the normal layout flow of the document.

From W3C, 9.5:

Since a float is not in the flow, non-positioned block boxes created before and after the float box flow vertically as if the float didn’t exist.

The container has nothing in it besides those two floating elements. Because they are no longer “in the flow”, that container essentially has nothing to define just how tall it needs to be. Let’s fix it.

3. Clearing House

They keyword here is “clear”. CSS2 defines the clear property as a way of specifying that a block element should not fall along the sides of a previous float. You can tell it to clear:right so that it pushes below any previous right floaters. You can tell it to clear:left to push past the southpaws. Or, as we’ll do here, you can tell it to clear:both, which basically means “Stop pushing me around”.

Now, at this point, one option is to manually insert a new, empty div immediately after the “right” column. We style it with clear so that it can ignore the two previous floats. This pushes it past them to the bottom of the container, which now must stretch out to fill all this new space. Voilà, we have a fix.

Here is our original HTML modified as an example, with the new div’s styling done inline:

<div id="container">
 
	<div id="left">
        <p>To the left.</p>
	</div>
 
	<div id="right">
        <p>To the right.</p>
	</div>
        <!-- Let's name him "stretch" -->
        <div style="clear:both"></div>
</div>

But it doesn’t have to be that way. I mean, do you want to manually insert extra cruft into your page like that? As an alternative, have you considered our shiny new model? The :after pseudo-element? It’s CSS that injects content for you! (Aside: On some level this seems wrong to me. Why would they create a method for the presentation mechanism to insert content? But then again, who cares. It’s there and it’s pretty cool, so let’s use it.)

Here is the new addition to our styling family:

#container:after
{
    content: "";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

Now gander at what you have created. The hug is back!

Adding :after to an element’s style will literally add something (the “content“) after it. Examples I have seen use a period character for the content value (e.g. content: "."), which then absolutely requires that you specify a zero height and no visibility (otherwise the period would be displayed at the end of your content). But using an empty string seems to work just as well, and the two extra rules (height and visibility) aren’t needed. However, it seems prudent to just err on the safe side and go with both.

4. Handling the Exceptions

I only covered the Firefox relevant pieces here (which is the majority of it). But if you decide to use this technique to fix your missing background/borders, please read Clear a float container (linked to yet again for good measure) to view the extra information you’ll need to account for other browsers.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Firefox, CSS and floats: Where’s my background?

If you’re reading this on the wooliet main page (with multiple posts listed), you can see it in action by clicking the link below. If the is the “single post page” display then..well….there’s nothing to see! Just go to Wooliet and find an entry with a link to more content.

(Updated with official WP plugin link)

I’ve tried to make it a very quick and easy plugin that can easily be thrown in and activated on any standard Wordpress installation. Another goal was to keep it ‘unobtrusive’ in that, once deactivated, there would be no trace left behind in the Wordpress database. Of course, at some point (if enough people use it), additional options might be necessary and beneficial. But we’ll see.

I’m still in the process of getting it listed and hosted with the official Wordpress plugins repository, but at the moment, the new subversion area for the code doesn’t yet seem to be available (anyone know how long that should take?). It took three days for the Subversion path to become active. The plugin should be available at the official location, which is right here.

As an aside and helpful tip for anyone else considering submitting their plugin to the official Wordpress listings: they have a “readme.txt” validator you can use to verify the correct syntax and content of the required “readme.txt” file. It was extremely helpful for me.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Announcing the ‘Read More Right Here’ Wordpress Plugin

The way you show the existence of just one of these ghosts is you stop dancing and you barrel across the dance floor as hard as you can, shouting and roaring, barging ghosts and dancers alike hither and thither, scattering them and knocking them flying. If you get it just right, you splash a clearing in the ghosts, and if you’re luckier still there’s a moment before they get to their feet where you can grab one, sit on his chest and hold him down by his neck and grab his chin so you can wrench his dirty face round to look straight at yours and lean in real, real close and, panting, whisper straight at him through your gritted teeth: you little fucker: gotcha.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Physics Romance Fiction

1. make sure that when you power on the stereo, it says CODE (not ERROR)
2. turn it back off
3. press the preset station numbers 1 and 6 together and, at the same time, turn its power back on

The display will now show the first five characters of the serial for a bit, then the second five, and then cycle through it once (maybe twice) more. Copy that down and have it ready for the mechanic/dealer.

(I cannot seem to re-google my source for this info…sorry)

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Retrieving Your Honda Pilot’s Stereo Serial Number

Now is Asics Woolie!

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Asics Woolie

So let me take you through my links and hopefully summarize what I’ve learned. First though, let me say, I’m assuming that you already know what it means to hook into the Wordpress application flow by adding “actions”. If not, read up.

Inject Your Javascript

The Wordpress Codex for wp_enqueue_script has a list of other javascript libraries included as well as a link to this brief tutorial at Nick Ohrn.

Basically Wordpress provides the wp_register_script method to register a javascript file and its dependencies using a unique string to serve as a “handle”. After you’ve registered them, you can then use that handle when calling wp_enqueue_script. This will spit out the appropriate <script> elements to your document, in their correct order, and (hopefully) avoid any duplicate entries or conflicts with other scripts.

I’ve added both the wp_register_script and the wp_enqueue_script calls to the method I’ve added as part of Wordpress 'init' (i.e. add_action('init', myLoadJsMethod)). I think you can also just use wp_enqueue_script directly, without first registering, but it seems like a good idea to do both. For example, if things change, you can keep the registration in 'init' but then move the call to enqueue somewhere else, like the 'template_redirect'.

What’s important to know, though, is that you cannot call wp_enqueue_script as part of the 'wp_head' action. At that point, it’s too late. This was confusing to me because I was originally just echoing out the path to my script within the function I set for 'wp_head', and it worked fine. But to work within the Wordpress world, it has to happen before the header action, which means 'init' or 'template_redirect' (or possibly others, not sure).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

function my_init_method()
{
    // include the js if not a single post page
    if(!is_single()) 
    {
       wp_register_script(
       		'my_handle', 
                my_get_base_path() . "js/my_javascript.js",
                array('jquery')); // my_javascript.js depends on jQuery
 
       wp_enqueue_script('my_handle');            
    }    
}
 
function my_get_base_path()
{
    return get_bloginfo('url') . "/" . PLUGINDIR . "/" . plugin_basename("read-more-right-here/");
}
 
 
add_action('init', my_init_method);

Notice that at line #11 I only needed to use the string ‘jquery’ to register my script as being dependent on it. This is because ‘jquery’ is included with Wordpress and has already been registered with that handle.

Making jQuery Work

Let’s test this out with a simple call to alert in our javascript. Following good practice, we’ll make sure to do this after our page’s DOM is locked and loaded.

1
2
3
4

$('document').ready(function() 
{	
	alert("ready");
});

Ahh Crap. Firebug is telling me that $ is not a function. A little google later and I’m at this thread, with the answer I’m seeking nine messages in, right here.

jQuery in WordPress uses the noConflict option to prevent issues with
Prototype…….Check online for jQuery.noConflict()

It’s always something. Alright, so what do the jQuery docs say?

By default, jQuery uses “$” as a shortcut for “jQuery”. However, you can override that default by calling jQuery.noConflict() at any point after jQuery and the other library have both loaded.

It goes on to say that you can also just set something else as the new “$” by setting a new variable to the result of jQuery.noConflict().

So the above javascript is changed to this:

1
2
3
4
5
6

var $j = jQuery.noConflict();
 
$j('document').ready(function() 
{	
	alert("ready");
});

And it works!

Summation (Because I Type Too Much)

• Use wp_register_script and wp_enqueue_script to load your javascript
• Do not use wp_register_script and wp_enqueue_script as part of the wp_head hook, it must happen earlier (e.g. init, template_redirect)
• jQuery in Wordpress uses “no conflict” mode, see here for workarounds

If I’ve misstated or completly misunderstood anything above, please feel free to correct me in the comments.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Wordpress, jQuery and ‘noConflict’

The humor is mostly adult. Basically you gotta like dirty jokes. Also notice that there’s a Random button available, which is what I’ve been hitting the past few minutes. I’ll display a few of my favorites (so far) on the underside.


Cyanide & Happiness @ Explosm.net

Cyanide & Happiness @ Explosm.net

Cyanide & Happiness @ Explosm.net

Okay. That’s enough for now. That Random junk is just an endless supply of unexpected treats.

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Cyanide and Happiness: Stick Figures and Dirty Jokes

Every time you give someone a book, you earn a point and can get any book you want from anyone else at BookMooch. Once you’ve read a book, you can keep it forever or put it back into BookMooch for someone else, as you wish.
….

Points for entering books: you receive a tenth-of-a-point for every book you type into our system, and one point each time you give a book away. In order to keep receiving books, you need to give away at least one book for every three you receive.

The only cost associated with all of this that of shipping your books to those who’ve made the request. The site itself appears to do nothing more than serve as a matchmaker.

As enthusiastic as I am right now about doing this, I have a long and sordid history of initial energy for something followed by little to no follow through. But this time will be different! My fingers are in the crossed position!

Merci Scott Klarr

~~~~~~~~~~~~~~~~ This has been a woolie posting.

The BookMooch Book Exchange

I love The Wire (two season four episodes still to go). One of its most interesting characters is Omar Little, the scourge of Baltimore city drug dealers.

I also really enjoyed Cormac Mccarthy’s book The Road. The complete scrubbing of all quotation marks took getting used to at first. But once you get into the rhythm of the writing, their removal adds a strange sense of intimacy with the characters.

    He looked at his father and then tilted the can and drank. He sat there thinking about it. It’s really good, he said.

    Yes. It is.

    You have some, Papa.

    I want you to drink it.

    You have some.

    He took the can and sipped it and handed it back. You drink it, he said. Let’s just sit here.

The Road has been transformed into a movie, and Omar (Michael K. Williams) is in it as (ironically enough) “The Thief”.

thanks BigScreenLittleScreen

~~~~~~~~~~~~~~~~ This has been a woolie posting.

Omar Moves From The Wire to The Road