mrclay.rg

jQuery.Deferred() is pretty easy

I was using an asynchronous file uploader and, for usability, wanted to make sure the upload progress bar was displayed for at least a couple seconds before changing the view. The jQuery.Deferred object made this a breeze, eliminating a bunch of callback/isDone checking mess: var uploadFinished = $.Deferred(), timerFinished = $.Deferred(); $.when(uploadFinished, timerFinished).done(function () {

[...read the post]

Designing a Highly Reusable HTML Component

The UF College of Education uses a header/footer template designed to be applied to any page, and we use this across several applications such as WordPress, Moodle, Elgg, and Drupal. Changes can be propagated quickly to all sites, and adding the template to new PHP apps is trivial. If you need to create an HTML component that can be

[...read the post]

My Moodle Page, Now With 99.6% Fewer Queries

My work recently upgraded from Moodle 1.9 to 2.3, and some users were experiencing slow page loads while the site was zippy for others. Today we discovered that, for some users, the My Moodle dashboard page was requiring several thousands of DB queries. For one user, enrolled in four courses, the page required over 14,000 queries.

[...read the post]

Closure Compiler is smarter than you

I’ve known about Google’s Javascript minifier, Closure Compiler, for awhile, but after sending a couple snippets through it today I realized it’s a pretty impressive piece of work. Input: function howManyMatch(arr, pattern) { var l = arr.length; var total = 0; var i = 0; for (; i < l; i++) { if (pattern.test(arr[i])) {

[...read the post]

Using jQuery Before It’s Loaded

It’s better to include scripts like jQuery at the end of the BODY, but this makes its methods inaccessible earlier in the page (e.g. inside a WordPress post). What you can do is use a script like the one below to queue DOMReady functions before jQuery loads. (function (w) { if (w.$) // jQuery already

[...read the post]

Tiny E-mail Munging Script

I’ve seen a lot of these that are bloated/less effective/inaccessible, so I might as well put this out there. It’s simple enough to modify if you’re comfortable with Javascript. Markup: <a href=”mailto:john{@}example{.}org”>john{@}example{.}org</a> (function(){ var a, i = 0, o = this.onload; onload = function(){ o && o(); // run the old window.onload if existed while

[...read the post]

IE9 May Raise the Bar

Wow. IE9 is coming, and it looks like it’ll get Microsoft back in the game. Full Developer Guide. The Good: New standards supported, hardware-accelerated canvas, SVG, Javascript speed on par with the other browsers, preview installs side-by-side with IE. The Bad: Not available on XP and no guarantee it will be. XP users will be stuck

[...read the post]

Javascript files don’t auto-update

On a panel of 4 Javascript library developers at Ajax Experience 2008, a question came up about how their libraries use browser detection. When John Resig suggested that libraries should strive for full feature detection (hardly used at all at the time) instead of browser/object detection, the other developers reacted like he was crazy. They

[...read the post]

The Quickening of Facebook

If you’ve used Facebook in Opera and Firefox, you might have noticed that Facebook is several magnitudes faster in FF, but this has nothing to do with FF’s speed. For FF and IE users, Facebook uses a client-side architecture called “Quickening” that basically makes a few popular pages into full AJAX applications that stay loaded

[...read the post]

Where’s the code?

Google’s free open source project hosting has been awesome for Minify, so when I was looking around for Subversion hosting for my personal code, I figured why not host it there? So here’s a bunch of my PHP and Javascript code. Hopefully some of it will be useful to people. A few PHP highlights: HashUtils

[...read the post]

Minify 2.1 on mrclay.org

A new release of Minify is finally out, and among several new features is the “min” application that makes 2.1 a snap to integrate into most sites. This post walks through the installation of Minify 2.1 on this site.

[...read the post]

Javascript humor

hasthelargehadroncolliderdestroyedtheworldyet.com has a news feed. It also has this in the source: if (!(typeof worldHasEnded == “undefined”)) { document.write(“YUP.”); } else { document.write(“NOPE.”); } Folks without Javascript get a more definite answer: <noscript>NOPE.</noscript> Also appreciated: <!– if the lhc actually destroys the earth & this page isn’t yet updated please email mike@frantic.org to receive a

[...read the post]

Case of the NS_ERROR_DOM_SECURITY_ERR

Working on a bookmarklet, I ran across “security errors” in Firefox and Opera (may happen in others, I didn’t check). In Firefox the code threw “Security error (NS_ERROR_DOM_SECURITY_ERR)” and in Opera it was something similarly vague. The culprit code was trying to access the cssRules property of a style sheet from a different domain (my

[...read the post]

Minifying Javascript and CSS on mrclay.org

Update: Please read the new version of this article. It covers Minify 2.1, which is much easier to use. Minify v2 is coming along, but it’s time to start getting some real-world testing, so last night I started serving this site’s Javascript and CSS (at least the 6 files in my WordPress templates) via a

[...read the post]

Thoughts on a Javascript “validator”

(X)HTML and CSS have their own validators, but we need one for Javascript as well. JSLint could be part of it, but what I’m imagining would flag the use of “native” objects/interfaces not defined by W3C or ECMA standards. E.g., document.layers or window.ActiveXObject. The hard part in doing this is finding a full Javascript interpreter

[...read the post]

Hacking a 3rd party script for bookmarklet fun

A few weeks ago I created a simple bookmarklet that loads del.icio.us’s PlayTagger script into the current page. This post covers how some problems with this script were worked through. Too late The first challenge was that PlayTagger was designed to initialize itself (let’s call this method “init“) on window.onload: If a user fired the

[...read the post]

Kill these DOM0 shortcuts

A problem a decade in the making You can refer to a form’s elements in your code by using the element’s name (from the NAME attribute) – an ancient Javascript spec. This means myForm.myElement is a shortcut for myForm.elements['myElement']. I’m sure this was seen as handy and harmless at the time, but the problem is

[...read the post]

Detect a blocked pop-up window

Since reliable info doesn’t seem to be out there, this Javascript detects if a pop-up window was blocked at least by IE6/XPsp2′s built-in blocker, FF or Opera 8. var popWin; // global for easy reference later function pop(url, name, features, replace) { popWin = open(url, name, features, replace); if (popWin == null) { // nice

[...read the post]

Bookmarklet manager bookmarklet?

In the redundancy file. Someone needs to create a bookmarklet that loads into the current page an interface for executing pre-saved bookmarklets. I’ve already seen several examples of this with pre-defined sets of bookmarklets (notably Favelet Suite) but why limit the user to one set? I’m already keeping my regular bookmarks and RSS subscriptions online,

[...read the post]