magnetiq.com

I’ve created a bookmarklet to temporarily solve a very specific problem at hand: I’m translating a TED video into Turkish, but I don’t currently have a Turkish keyboard hooked up to my computer (it’s in a box somewhere in the basement). Read the rest of this entry »

Here’s a quick XML generator (pure-string, no DOM involved) that I originally wrote for converting a jsUnity test result into JSUnit format, but which can serve a more general purpose. Read the rest of this entry »

I came across yet another browser discrepancy with a rather obscure scenario: A function declaration within a with block:

var obj = { a: 1 };

with (obj) {
    function foo() {
        return typeof a;
    }
}

alert(foo()); // alerts "number" on Firefox, "undefined" on others

This exposes the object properties to the function scope only on Firefox. On all other browsers that I’ve tested with (IE, Safari, Opera and Chrome), the property isn’t visible inside the function.

I’ve been working on extracting some text out of a given JavaScript function when I realized that toString() may return parts of the original comments, depending on the browser. I’ve done a quick test to capture the behaviour of popular browsers. Here’s my test script:

function/*post-keyword*/fn/*post-name*/()/*post-parens*/{
    /*inside*/
}

document.write(fn.toString());

And here are the results I got on different browsers:

And out of the browser context:

While looking for the best solution to extract the parts that I need, I’ve implemented a workaround. Sort of. If blocking the problem can be considered a workaround:

var functionToStringHasComments = /PROBE/.test(function () {/*PROBE*/});

// ...

if (functionToStringHasComments) {
    throw "...";
}

Here’s a JavaScript snipplet for automatically generating a table of contents based on headings in a document. It will traverse all <h1>, <h2>, <h3>, etc. elements, add anchors (<a>) to them and generate nested unordered lists (<ul>, <li>) with links to the now anchored headings. The nesting honors the hierarchy of the headings. Read the rest of this entry »

The most common approach to time a function or a segment of code is to repeat it a lot of times in a loop, measure the time the entire loop takes and then divide that number with the number of iterations. Illustrating this with JavaScript (although this method applies to all languages):

var start = new Date(); // Get current time

for (var i = 0; i < n; i++) {
    myFunction();
}

var finish = new Date(): // Get current time

var ntimes = finish - start; // Elapsed time for n iterations
var once = ntimes / n; // Average time for one function call

However, this doesn’t really measure just how much time n calls to myFunction took. There’s also the overhead of the loop itself. What we actually end up measuring is not just the time to execute one call to myFunction but also the overhead of one iteration: Read the rest of this entry »

A recent question at stackoverflow.com prompted me to take a stab at implementing a function for rounding a given decimal number to a given number of significant figures (or digits).

function sigFigs(n, sig) {
    var mult = Math.pow(10,
        sig - Math.floor(Math.log(n) / Math.LN10) - 1);
    return Math.round(n * mult) / mult;
}

alert(sigFigs(1234567, 3)); // Gives 1230000
alert(sigFigs(0.06805, 3)); // Gives 0.0681
alert(sigFigs(5, 3)); // Gives 5

Here’s a nice trick for repeat a string a given number of times. Read the rest of this entry »

Most date formatting implementations use format strings where format specifiers like “mm”, “mmm”, “HH”, etc. are used for selecting different components of a date. Here’s a different approach that allows you to use more human-readable format specifiers (while being rather verbose). Read the rest of this entry »

After having it in my to-do list (the “what if?” section) for a long time, I’ve finally managed to spend some time on a JavaScript implementation of a very tiny scrolltext; using a 5×5 font with subpixel rendering (aka ClearType). Knowing what subpixel-rendered static letters look like on an LCD, I wanted to see the effect of scrolling them, 1/3 pixel at a time. Note: you need an LCD monitor to see the full effect. Read the rest of this entry »