Also, the plugin now works on WordPress pages (as opposed to blog listings). There’s a theme change you’d have to make for ‘more links’ to work on pages (see here). But that seemed to be a request that consistently hit my inbox.

The code refactoring….well, that was the best part. Adding GUI elements for options and all that is rewarding, but just not much fun. Rewriting the years old, mostly dormant, javascript with the knowledge and experience gained over that time was cool.

And now I must sleep, for my real job’s clock starts ticking in a few hours.

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

Read More Right Here version 2.0.0

Reset Revisited

…defining an invisible focus was the biggest blunder of the original reset. In hindsight, it’s really a obvious unforced error, but when I published the reset I literally had no conception that it would be just copied (or, worse, hotlinked) blindly in a thousand sites and frameworks….focus outlines were obliterated wholesale as lots and lots of people, not all of them craftsmen, just copied the reset and built on top of it without thinking about it.

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

An Updated Reset

The Tucks

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

Ruminating Jack

Number five is the most important: 5. Don’t Tell Hasbro.

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

Let’s Keep This Between Just the Thousands of Us

Ever watched an episode of yaQuery? The sole XX chromosome in the group is Rebecca Murphey. I’ve recently come across her blog, and I love it. Of particular interest is the recent entry On Rolling Your Own. In it, she addresses the use of jQuery for purposes beyond its intended use. Specifically, large-scale client-side applications.

JavaScript, even that old-fashioned browser kind, is a language worthy of respect, not a thing to be dreaded. But — and here’s the sentence I have struggled 10 months to realize and an hour to write: in order to prove that we are better than this, we must make abundantly clear to the budding developers, to the project managers, to the enterprises, to anyone intending to build a remotely complex JavaScript application, that there’s more to JavaScript than jQuery. The questions are bigger, the answers more complex, and the relevant skills, alas, a bit harder to come by.

The entire piece is fantastic as well as the comments, which contain a couple more links that I feel really round-out the whole conversation. First (recommended by a couple of commenters) is John Resig’s (Mr. jQuery himself) thoughts regarding using jQuery for more than its intended purpose.

Object-Oriented Programming is a hammer and to a developer that’s only ever used a hammer every problem looks like a nail especially the problem of developing web applications). OOP has a great ability: It can make complicated problems manageable and simple problems complicated. I’ve seen far too many projects bloat uncontrollably under layers and layers of obfuscation when only a simple goal is needed – and can be achieved simply.

(Here is where I’m picking up again after ~65 days…and…..). I no longer remember what else I wanted to share. It was most likely some quote from the blog of Garann Means (specifically this post), who is very fun to read.

The whole conversation is interesting. Beaucoup is expected on the client-side now, and true apps that do more than handle a few click events and toggle a few classes need to be organized in the same way as their desktop/server-side brothers.

Here’s another quote for good measure. It’s from an interview with Dustin Diaz:

Well when I first joined Twitter my initial thoughts were to get rid of it [ed. jQuery] because it was promoting a lot of bad script. You have to share this code with everyone. You write it. Everyone writes it. It’s kind of a mess. There was no organization to it really. It’s not an organization thing and when we say framework I literally think of something that frames the way you work and it’s not good at that. And that’s why I recommended either if you’re gonna use jQuery use Dan Web’s Low Pro which has a proper class based system. You can inherit things. You can have classes. You can do sub-classes and you can test the code a lot easier rather than using jQuery’s plugin architecture. Which is not entirely broken but if you’re going to have a whole web app. See it’s the difference between having a web app and just doing your blog or just doing like basic things to, I don’t know, just building a web page. Just toggle this toggle that. It’s not a big deal.

I need to look into Low Pro, and Dojo, and a ton of other stuff I guess.

On a related note, did you know that Microsoft is ditching their javascript and supporting jQuery? A nice current events lesson was written by Dave Ward (of Encosia).

If you’re using the ScriptManager or UpdatePanel, you’re in the clear in terms of future support. If you’re using a DataView or Sys.require, you’re using the now-obsolete ASP.NET Ajax Library and should consider a jQuery-based alternative.

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

Your Problems are Nails and jQuery Is The Hammer

And for those who can’t wait for the big reveal: the company was Amazon (and the number was 1-866-216-1072).

We have, all of us, learned that the first thing to do with any computer related issue is…………….

reboot.

I’ve been using Amazon’s Video On Demand service for around a year now (I think). At first it was only the occasional movie rental, but I’ve also purchased a couple of seasons of the scientific fictitious Battlestar Galactica to fill that “megamovie” void. It’s been a solidly awesome show to watch, and last Thursday, I was ready to watch the final two episodes of season two.

But they wouldn’t load. The animated dots kept animating, but Amazon was not connecting. And then again on Friday night and Saturday night. Amazon is not showing me the content I bought! I paid! I paid! And this is the thanks I get!!!!

And again on Sunday night, which is when I finally called their number and……….was answered before two rings. And was transferred to the video on demand department within a minute of the conversation. And had a very pleasant lady acknowledge that there definitely seemed to be a problem. She could tell I’d been trying to access the content. After a brief conversation she suggested I try rebooting both the computer and the network.

And that’s when I realized that, despite more than a decade of drilling, I forgot to try rebooting. I just went four nights in a row not doing what I wanted to do and I didn’t even try a power cycle. I almost wanted to hang-up right then out of embarrassment. But the CS rep was nice, pleasant, totally willing to wait with me while I started everything over. Those awkward minutes of telephone silence with a stranger.

And then my problem was fixed. Thank you Amazon for the quick answer and nice people.

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

Yes, A Pleasant Customer Service Experience

The most insidious cause of overengineering is over-generalizing. We will over-generalize anything given half a chance. Writing code to work with a list of students? Well, we might want to work with teachers and the general public someday, better add a base People class and subclass Student from that. Or Person and then EducationPerson and then Student. Yes, that’s better, right?
…
We have to stop championing each ridiculous feat of overengineering and call it what it is. It’s not ‘future-proof’, because we can’t see the future. It’s not robust, it’s hard to read. Applying a generic solution to a single case isn’t good programming, it’s criminal overengineering because like it or not somebody, somewhere will pay for it.

He mentions fear as a motivator; the worry that your code won’t stand up against the unforeseen use-case. He also describes the sense of productivity it engenders. In other words, “look at all this code I just cranked out”.

And while I agree with everything he says, I do have a small point of contention: He doesn’t account for the fun factor. This must be the exception to the rule. The one time it is okay to shoot way high.

I mean, isn’t it fun to create these beasts? To take a simple problem and abstract it out to this giant chain of inheritance and interfaces and abstractions? I’m serious here. I’m sure there exist the coders who enjoy nothing more than filling in a function stub with one return statement, mumbling “done” to themselves, and then moving on to the next task at hand. But aren’t most of us the kind who enjoy the creating and building of these…things?

So yeah, while absorbing the fluorescent rays of a cubicle sun, make sure not to “makes things harder than they are” (to quote my dad) too often. But try to find an excuse every now and again to exercise those creative muscles and think larger than the simple problem at hand. That’s what I say.

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

Patterns Schmatterns: But Don’t Forget the Fun

Ideation Limitation

I think coding a site to upload some photos, automate them into a simple slideshow is a no brainer. Your mom on the other hand thinks that’s about the most fan-futon-tastic thing ever. She and all the ladies in her card group use it religiously; sharing photos of their baby grandchildren drooling and gnawing on the dogs chew toys. Who knew.

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

A Diagnosis to Which I Relate (using a word I’ve never heard)

1. Created a plugin
2. Created a repository for that plugin at BitBucket

ReadyAgain at BitBucket

The ReadyAgain jQuery Plugin

Prior to version 1.4, the array of functions saved by jQuery for execution when the DOM is ready (i.e. those functions added by $(document).ready(function...)) was an accessible property of jQuery. This meant that you could reference the array directly using something like $.readyList. Now, however, that array has been hidden within an anonymous, self-executing function (the deepest, darkest well of data hiding in javascript, here’s a bit of a primer). So re-executing all of the ready functions by grabbing a copy of that array becomes impossible.

The ReadyAgain plugin is my attempt to solve that issue. The specifics can be seen by looking at the code, but the basic concept is to override jQuery.ready to intercept each function as its added, and to save it within our own internal array.

Public Code

So the initial commit of the code is there and I’ve typed up a page on the Wiki with some examples. I hope that people use it and maybe even contribute to it. It would certainly be something fun for me to be a part of and from which to learn.

The Path to Here

An issue that has come up a couple of times regarding my ‘Read More Right Here’ WordPress plugin is that, when the post content is loaded, effects like a thickbox or lightbox or whatever-box are not applied to images in the new content. More generally speaking, any javascript fanciness used on any of the new content elements is missing.

The reason is that most every javascript based modification is applied to the document within a ‘DOM Ready’ function (and rightly so) . With jQuery, this is the jQuery.ready function. So a plugin might add some nifty image effects to all images on the page like so: $('img').NiftyStuff(). But the images within the content pulled down by my plugin aren’t yet there. They don’t arrive to the page until after the ‘Read More’ link is clicked.

So how do you re-execute NiftyStuff and the potentially countless other plugin functions on that new content?

Live & Delegate

One quick solution would be to make use of jQuery’s live or delegate functions. When used, they will monitor the DOM for new elements and execute code as needed. But I guess this is still a relatively new process since it’s not something I’ve noticed in any of the plugins I’ve come across.

Rerun Ready (i.e. my plugin)

Re-execution of each of the saved ready functions is another possibility. What’s more, the ReadyAgain plugin will allow you to execute all of the ready functions within a more specific context (instead of the default ‘document’ context, see the wiki for more). So potentially only the new content will have the saved ready functions applied.

Risky Business: Not the final solution

At this point you might be thinking to yourself “Great, so you’ve packaged this with ‘Read More Right Here’ and everything works perfectly”. Sorry, but no. At least not yet.

I experimented with it a bit, and it’s honestly just too hazardous. I mean, it’s a serious case of “Use at your own risk”. It is generally assumed (and again, rightly so) that the code executed within jQuery’s ready function will only be executed once. So you might see a new element with a static ID value added to the page over and over. Or you might see some element that’s animating with relative values (e.g. top:'+=25px'), which could happen over and over. Or any other number of possible side-effects.

This plugin is really something that (at least in its current form) should only be added on an individual basis. You have to examine what happens within the ready function of other jQuery based WordPress plugins. There’s just no way that I can see to have this become default behavior within the RMRH WordPress plugin.

But time will tell. Maybe creating this public repository will put some eyes on it and who knows what solutions will develop from that.

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

The ReadyAgain jQuery Plugin: Re-executing Ready

One good indicator of my own satisfaction towards a project like this is how I feel about it the next day. This design has been pretty much complete the past couple of days, and when I looked it over this morning, I was still pleased.

I think the Conde site now has a more professional, sleek feel to it. Fingers crossed that this translates to more potential customers.

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

Conde Software Redesign

Miter Box Slider is my submission. It’s a jQuery ‘slider’ plugin (i.e. when there’s a slideshow display of images at websites). What’s awesome about it is that it provides the ability to create truly unique animation transitions. With other sliders you’ll see a set of predefined transition effects, but with Miter Box, you create the transitions. It’s actually very powerful. One of the largest issues I had developing it was that I would often end up just playing with it. It’s a fun tool for experimenting.

Regardless of whether other people decide to use it, I really am pretty proud of it. Remember that those who run the site review the code and set the price? Right now, mine is the highest priced (one of only two at that price) item in the javascript section of code. I don’t know everything that goes into that price point, but I will say that I think it’s an indication of the power my plugin offers.

If you’ve got a site, or create sites, and are looking for some way to spice up the way you display your images, check out the Miter Box demo.

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

Miter Box Slider

Some Details

First: be sure to notice the lettering for the header image (the ‘W’, ‘o’, ‘o’, etc.). It was drawn by my nine-year-old daughter. How fantastic is that!? And my wife drew the now official Woolie T. mascot you see in the footer. I’m pretty fond of my family.

The actual content area is larger by a couple hundred pixels, and the sidebar along the right is correspondingly smaller. I didn’t want this blog to become a collection of sidebar widgets and ads that would overshadow and dominate the content.

Some posts will have an associated image to spice things up (on both the ‘front page’ view as well as the ‘single page’ view). I used the WordPress get_custom_values in the backend to add those images (some of which will be mine, most of which will be via the Creative Commons at Flickr). I’m pretty sure there’s a better way for me to use that feature (too may invidiual custom fields, I need to combine them into a single unit), but it works for now.

I really like (and am a bit proud of) the line that runs the length of the page, delimiting everything from the header to the footer posts and all the items in between. One of my original goals with this design was creating some sort of linking graphic like that….something that would tie the page together from top to bottom.

Comments look a ton nicer as well now, though there’s no new functionality (no replying to an individual post, comment feeds etc.).

Anyone reading this with IE6? Everything is basically visible and looks somewhat the same. The drop-down menu for “Categories” doesn’t work at all. but I don’t plan on I’m going to touch the IE6 specific style sheet again. Peace out.

Some ToDos

The sidebar, though pretty small now, still needs more items. I just don’t know what I want to put there yet. I’m trying to avoid too much of the standard stuff, because I want to keep it interesting. It will most likely become a sort of experimental spot at which I’ll throw new code.

The footer area is basically blank as well. It will probably end-up with some of the more standard sidebar type items (e.g blogroll). But again, I just don’t know.

I’d like to have something more dedicated to support for my WordPress plugin (and any others I eventually create), but for now the WP forums is the best place to keep track.

Vote for Me

I hope those who stumble across this place enjoy the look. I’d like it to be a good first impression. If you’ve visited off-and-on in the past, then maybe the change will add a nice little jolt to your day.

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

Yah New Look

And while I’m here, Lifehacker recently pointed me to RainyMood.com. On a whim I pushed play and then, after about an hour of interneting, realized it was still on. Super job of drowning out ambient noise.

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

Puter Piano and Outside Rain

My first car had a sticker of the two of them flying in a box.

.

My only tattoo is a small one of Calvin dancing.

My oldest daughter started reading through some of my Calvin and Hobbes books, and seems to truly love it as well.

So here now is the Kickstarter (fund raising site) page for Dear Mr. Watterson, a documentary about the strip.

Dear Mr. Watterson is a film that will look to the readers and fans of Calvin & Hobbes to tell the story of the strip and its creator. As we explore the art and impact of Bill Watterson through this unique perspective, the undying appreciation and love of Calvin & Hobbes and the man behind it will be evident in the anecdotes, stories, and memories shared by readers of the strip and friends and colleagues of Mr. Watterson.

While the crew has been donating their time to make this project happen, we’ll be taking several trips to conduct interviews and collect footage, so the costs of air tickets, rental cars, meals, and motel stays will add up. The benefit of raising our goal of $12,000 all at once through Kickstarter is that we’ll be able to move forward on this film without the hurdle of funding, and the more we raise on top of that, the more we can do with the film.

I would love to see this happen and am working on my contribution as these words type to my screen. Consider doing the same!

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

Calvin and Hobbes Documentary (make it happen!)

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

Four Dollars of Elvis

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

Silent Night by House of Heroes

The original inkling of issues came via Anon’s comment, on my previous update post, that YouTube videos pulled down as part of the “more” section were broken. I tested this locally and saw that, with IE7, he/she was right. Of course, it’s not just YouTube. It would be any of the <object>/<embed> elements video sharing sites provide.

That really sucks.

The Fix (sorta)

After spending one night trying to figure out what I could do to fix this, it became obvious that the generally accepted solution to dynamically adding those flash objects to a page is to use SWFObject, which:

Offers a JavaScript API that aims to provide a complete tool set for embedding SWF files and retrieving Flash Player related information

I really (always optimistic) thought this would be a quick set of changes to the javascript file; call the swfobject.embedSWF method and be done with it. Best of all, swfobject.js is already distributed with the WordPress install (which, by the way, I don’t see mentioned in the codex, the script handle to use to enqueue or set is as a dependency is 'swfobject'). But I couldn’t seem to get it to work, at least not in IE7.

That really sucks.

What IE Doesn’t Like

In the end, after much debugging with the uncompressed version of SWFobject, Firebug Lite and beaucoup de calls to console.log, I found the issue to be SWFobject’s call to outterHTML.

You see, when it creates this new element for the DOM, it needs someplace to put it. You provide the id of the element which will be used as that replacement. Sort of like the sacrificial lamb for the the new <object>. It’s through outterHTML that the replacement occurs. It sets the old element to be the new one.

435

el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';

createSWF function (line number as of version 2.2)

My plan was to replace the original object with the new one. When that didn’t work, I tried inserting a <div> as the target for replacement, right before the object, but that failed in the same way. Finally, I realized what was going on, and set as the replacement an item that already existed in the DOM (in other words, it wasn’t something pulled in and added dynamically by the RMRH plugin). That worked.

The problem seems to be that, when the element to be replaced has also been dynamically created, IE throws an exception when you try to change it. In other words, I created the sacrificial lamb and IE wants for it to have always existed.

The Fix Again (sorta, again)

But it bugged me that the call to outterHTML was the point-of-failure here. After all, I know I manipulate the DOM all the time in jQuery. Right? It provides replaceWith as part of its API after all, and that always seems to work.

So I replaced SWFObject’s call to outterHTML with jQuery’s replaceWith (does that count as ironic?), and the problem was solved.

So What Do I Do?

I don’t really want to change that one line and then bundle the modified swfobject.js file with my plugin. But that’s the only solution I can think of. Well, that and maybe just recreate (i.e. copy) the relevant SWFObject code in my javascript, to be used only with IE. But I can’t help but think there must be a better line of action here.

This has to be a relatively common situation. I mean, pull down content using AJAX, content happens to contain an embedded flash player, use SWFObject to make sure it renders in IE. I guess what’s missing is that in the common scenarios, an existing element is already set aside and ready to accept the new object. But I can’t do that with my plugin.

So what do I do?

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

SWFObject, IE and Dynamic Content (a problem)

Details, Details

I previously was calling a function I wrote to set the URL to the plugin root directory. This was then used to register the script with WP and was also passed down to the javascript using wp_localize_script.

The one-liner function:

function wt_rmrh_getBasePath()
{
    return get_bloginfo('wpurl') . "/" . PLUGINDIR . "/" . plugin_basename("read-more-right-here/");
}

With the 2.8.1 update, the above no longer worked. Before 2.8.1, the path in a page’s header was (in part):

   plugins/read-more-right-here/js/wt_rmrh.js

After the 2.8.1 update, the path became:

   plugins/read-more-right-herejs/wt_rmrh.js

Needles to say, that javascript file isn’t going to load.

I looked through wp-includes/plugin.php and found the plugin_dir function which

Gets the URL directory path (with trailing slash) for the plugin __FILE__ passed in

(their function comment).

So I deleted the function (which was only being called once) and replaced

$pluginUrl = wt_rmrh_getBasePath();

with

$pluginUrl = plugin_dir_url(__FILE__);

Everything seems to be in working order now. At least until the next WordPress version!

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

RMRH Update for WP 2.8.1

1
2
3
4
5
6
7
8
9
10
11

$values = get_values();
$display = "<ul>";
 
foreach($values as $value)
{
    $display .= "<li>$value</li>";
}
 
$display .= "</ul>";
 
echo $display;

Why was my list spilling out of its well defined boundaries? A staggering amount of time was spent fiddling with every possible CSS property for that element and those around it. Edit, save and reload. Edit save and reload. It was driving me insane.

Solution? Append a newline after each list element.

6

$display .= "<li>$value</li>\n";

I have no idea why. If you do, please enlighten in the comments.

Dear Lord I hope this helps someone else out.

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

Overflowing List Elements

If you’re not familiar with it, the gist is: Story of a royal family in a modern, fictional world. And the ruler, the king, is not a figure-head. He’s the real deal with power to spare. And so there are the expected power struggles internally and externally. Military action and political action.

It’s all very well done and fun to watch. A sometime small twist to it all is the idea of the king being truly “chosen” by God. There is a strong undercurrent of signs and symbols the leads look for and notice.

I hope people are watching. I hope the show lasts (and continues to be entertaining and interesting). I hope I’m not the only one watching.

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

Watch Kings Rule