Things I’ve Learnt About JavaScript

I’m continuing with my HTML5 experiment. It now has context menus (aka right-click popup menus) and editable text. I’m still astounded how much one can achieve with little code. If one can work out the right code to use. For example, this single function is all I needed to write to implement context menus (with a little bit of additional CSS and jQuery support):

function dubbiyaPopup(x, y, items) {
    var clear = function () {
        $('.dubbiyaPopupOuter').remove();
    };
    clear();

    $('body').append('
');
    $('.dubbiyaPopupOuter').css("left", x + "px");
    $('.dubbiyaPopupOuter').css('top', y + 'px').fadeIn(200);
    for (var i = 0; i < items.length; i++) {
        var item = items[i];

        var s = '#dubbiyaPopupItem' + i;
        $('.dubbiyaPopupOuter').append('
' + item.text + '
');
        $(s);
    }
    $('.dubbiyaPopupOuter').click(function (e) {
        var id = e.srcElement.id;
        var s2 = 'dubbiyaPopupItem.';
        if (id.substring(0, s2.length) === s2) {
            var num = parseInt(id.substring(s2.length));
            var itemFunction = items[num].itemFunction;
            itemFunction.call(this);
        }
    });

    $(document).one('click', null, function() {
        clear()
    });
}

Although there’s not much code there, it took me a couple of hours to make it work properly. Actually, I’m not sure if it works properly because testing it properly is awkward.