Cross browser Leading Zeros with JavaScript

This is a short entry for further reference

Left padding an integer with zeros was never so easy. Can't believe this ended up working.

function LeadWithZeros(num, pad) {
    return (Array(pad).join('0') + num).slice(-pad);
}

LeadWithZeros(5, 3) === '005';
LeadWithZeros(65, 3) === '065';
LeadWithZeros(120, 3) === '120';

Progressive enhancement example: Language Selection

It's easy to get lost in the Internet while looking for information. It's one of its greatest points: There are thousands of millions of websites out there. Information is the key purpose of the net and nobody can deny it.

But, as in many other cases, quantity does not equal quality. Poor designed websites, too bloated, with many inlined styles or little semantics (if none), are begging for trouble: Their information have lost accessibility.

Frames without frames. AJAH selective insertion

And W3C said Let there be frames, and there was frames, and they were used (and abused) and it was good, and W3C said This is right (we're gonna deprecate them soon) and there was much rejoicing.

Is not new that web developers hate all that's made with frames. They're a burden nobody wants to carry, so confusing, so "nineties", so... well, deprecated, that's it. So you may think I'm just delving into the past. Frames, as we know it, are dissapearing into extinction but, the main idea, more or less, is still needed nowadays.

Best Practices for Building Web Applications

If there's something I've learned during my developer life, is to make a list of basic rules and to be faithful to them. These rules are the skeleton on which all my own applications shall be built. Of course, these rules also evolved as time goes by, growing stronger or falling into obsolescence, often unpredictably.

Web development is not different from C++ coding, so it also has its own ruleset in order to avoid "bad habits". These are my rules, tell me yours.

swfLink: Simple, unobtrusive, Flash embedding

Update:Now returns the resulting <object> on success

I was in need of some simple Javascript to add SWF objects. Hoping for a simple, cross-browser, ie-proof, eolas-respectful and graceful-degradable solution is a difficult praise to attend, so I began, as always, to write my own.

The routine is so simple because it does nothing more than add a <object> tag so it can embed the flash movie. No plugin or software checks. I didn't need them.

jQuery Bookmarklet

It's kind of an obsession. You mix a somehow usual browsing session with some GREAT tools like a real browser, Firebug and jQuery and - Voilà! - you can do virtually anything.

You can fight the DOM, add events, modify every web as if it was your own. A la Seamonkey, if you want, but more hand-made. Please welcome... jQuerify.

Subclassing and Extending Array

Lately I'm spending some time coding some libraries in JS to achieve a solid & cross-browser framework. Not every browser out there supports the latest Javascript version, so a fallback solution is often needed. Some examples are the iterative methods in Array, as introduced in JS 1.7: every, filter, forEach, map, some, indexOf, lastIndexOf.

So, as extending a built-in is often a bad idea, the direction taken was to create a subclass of Array and extend this one. No wonder it's a hard path, but we can walk it on our own.

Cross-browser inline style with jQuery

Currently I'm developing some web applications for internal use, porting from some old ones.

I'd love jQuery, the jQuery way to do asynchronous requests is brilliant. Then I developed a plugin for my apps. Basically, it "automagically" catches all clicks on links, sends an AJAH request and loads the response inside a container.

The problem came when the response contains <STYLE> or <LINK> tags. While using Firefox and Opera all was great. But, oh $h*t, no style was applied with IE6, IE7, Chrome or Safari. I was thinking that was my plugin's fault, but when I test the use case without it, the problem remains. No style applied.