QRCodeitor

Very often I find myself reading long articles, which I tend to read in chunks during breaks or whenever I want to idle. Most of these moments, I find myself away from my computer, for instance waiting to enter a doctor's appointment, travelling in public transportation or even while in the bathroom  (who doesn't ;).

Hence, what I needed was to take away some reading material with me whenever I was about to be in any 'reading situation'.

QRCodeitor is a Browser Bookmarklet for rendering a QR Code of the current browser tab's URL, so I can swiftly pick it up with my phone's camera.

The code:

(function () {
    var div = document.getElementById('QRCode');
    if (div != null) {
        div.style.display = 'block';
    } else {
        div = document.createElement('div');
        div.setAttribute('style', 'position:fixed;top:30%;left:40%;background:#ddf;width:300px;height:300px;z-index:10001;display:block;');
        div.setAttribute('id', 'QRCode');
        var img = document.createElement('img');
        img.setAttribute('src', 'http://chart.apis.google.com/chart?cht=qr&chl='
        encodeURIComponent(location.href)'&chs=250x250');
        img.setAttribute('alt', 'QR Code of the page\'s link');
        img.setAttribute('style', 'margin: 25px;margin-top:10px;');
        var close = document.createElement('a');
        close.textContent = '[x]';
        close.setAttribute('style', 'color:blue;float:right;cursor:pointer;');
        close.setAttribute('href', 'javascript:document.getElementById(\'QRCode\').style.display=\'none\';void(0);');
        div.appendChild(close);
        div.appendChild(img);
        document.body.appendChild(div);
    }
})();

Basically, I use Google Charts API to produce a QR Code of the browser current URL and show it as a popup on the top of the page. Once I scan it with my phone I can get rid of it.

Notice that for this to work in a bookmarklet, you should prepend the "javascript:" statement to specify the language, and also escape some of the quotes within the code, as the code itself will be quoted in the bookmarklet.

Don't worry, you can just use the raw code I posted on github. You should create a "link" on your browser bookmark panel, and put the file contents in the URL value. It works both on Firefox and Chrome (haven't tested it anywhere else).

Edit: The cruncher I used to zip the js code: http://ted.mielczarek.org/code/mozilla/bookmarklet.html