Text Embedded Image

...

Image

Embeding text to image data,using alpha channel.

Encode Decode

...

Image

Embeding text to image data,using alpha channel.

Encode Decode

...

Image

Embeding text to image data,using alpha channel.

Encode Decode

<script>
// Usage:
// Encode text to image
TextEmbeddedImage(document.querySelector('img')).Encode('text');
// Decode text from image -> return text
TextEmbeddedImage(document.querySelector('img')).Decode();
// Decode text from image and if text is url navigate browser to url.
TextEmbeddedImage(document.querySelector('img')).OpenURL();
</script>
<img src="mickey.png" alt="..." onclick="TextEmbeddedImage(this).OpenURL();">
var TextEmbeddedImage = function(image) {
    var canvas = document.createElement('canvas'),
        ctx = canvas.getContext("2d"),
        w, h;
    var encode = function(text) {
        w = canvas.width = image.naturalWidth;
        h = canvas.height = image.naturalHeight;
        ctx.drawImage(image, 0, 0);
        var imageData = ctx.getImageData(0, 0, w, h);
        var data = imageData.data;
        data[3] = text.length;
        for (var i = 4, j = 0; j < text.length; i += 4, j++) {
            data[i + 3] = text.charCodeAt(j);
        }
        ctx.putImageData(imageData, 0, 0);
        image.src = canvas.toDataURL();
    };
    var decode = function() {
        w = canvas.width = image.naturalWidth;
        h = canvas.height = image.naturalHeight;
        ctx.drawImage(image, 0, 0);
        var imageData = ctx.getImageData(0, 0, w, h);
        var data = imageData.data;
        var str = '';
        for (var i = 4; i <= data[3] * 4; i += 4) {
            str += String.fromCharCode(data[i + 3]);
        }
        return str;
    };
    return {
        Encode: function(text) {
            encode(text);
        },
        Decode: function() {
            return decode();
        },
        OpenURL: function(func) {
            var txt = decode();
            var urlRegex = /(https?:\/\/[^\s]+)/g;
            if (urlRegex.test(txt)) {
                window.open(txt);
            } else {
                alert('Encoded URL was not found!');
            }
        }
    }
};
Get Class