Fun with Encoding

by deanpeters

HTML

<form name=code onsubmit="return false()">
<textarea rows=25 name=text style='width:100%;height:200px' onfocus='if (this.value=="Enter text to encode or decode here."){this.value="";}'>Enter text to encode or decode here.</textarea>
<table>
<tr><td align=center>
<input value="Encode Url" type=button onclick="document.code.text.value=urlEncode(document.code.text.value);">
</td><td align=center>
URL
</td><td align=center>
<input value="Decode Url" type=button onclick="document.code.text.value=urlDecode(document.code.text.value);">
</td></tr>
<tr><td align=center>
<input value="Encode Base64" type=button onclick="document.code.text.value=encodeBase64(document.code.text.value);">
</td><td align=center>
Base 64
</td><td align=center>
<input value="Decode Base64" type=button onclick="document.code.text.value=decodeBase64(document.code.text.value);">
</td></tr>
<tr><td align=center>
<input value="Encode Hex" type=button onclick="document.code.text.value=encodeHex(document.code.text.value);">
</td><td align=center>
Hex
</td><td align=center>
<input value="Decode Hex" type=button onclick="document.code.text.value=decodeHex(document.code.text.value);">
</td></tr>
<tr><td align=center>
</td><td align=center>
<input type=reset value=Clear>
</td><td align=center>
</td></tr>
</table>
</form>
<p class="tmp">hat top:<a href="http://ostermiller.org/calc/">Oster Miller</a><p>
        <script type="text/javascript">
      var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-442503-9']);
        _gaq.push(['_setDomainName', 'deanpeters.com']);
        _gaq.push(['_setCampNameKey', 'jsfiddle']);    
        _gaq.push(['_setCampMediumKey', navigator.userAgent ]); 
        _gaq.push(['_setCampSourceKey', 'internet']);   
        _gaq.push(['_setCampTermKey', 'javascript']);       
        _gaq.push(['_setCampContentKey', document.title ]); 
        _gaq.push(['_trackPageview']);
    
         (function() {
            var ga = document.createElement('script'); ga.type =...

CSS

input {width:100px;}
tr {height: 25px; }
.tmp {display: none;}

JavaScript

function urlDecode(str){
    str=str.replace(new RegExp('\\+','g'),' ');
    return unescape(str);
}
function urlEncode(str){
    str=escape(str);
    str=str.replace(new RegExp('\\+','g'),'%2B');
    return str.replace(new RegExp('%20','g'),'+');
}

var END_OF_INPUT = -1;

var base64Chars = new Array(
    'A','B','C','D','E','F','G','H',
    'I','J','K','L','M','N','O','P',
    'Q','R','S','T','U','V','W','X',
    'Y','Z','a','b','c','d','e','f',
    'g','h','i','j','k','l','m','n',
    'o','p','q','r','s','t','u','v',
    'w','x','y','z','0','1','2','3',
    '4','5','6','7','8','9','+','/'
);

var reverseBase64Chars = new Array();
for (var i=0; i < base64Chars.length; i++){
    reverseBase64Chars[base64Chars[i]] = i;
}

var base64Str;
var base64Count;
function setBase64Str(str){
    base64Str = str;
    base64Count = 0;
}
function readBase64(){    
    if (!base64Str) return END_OF_INPUT;
    if (base64Count >= base64Str.length) return END_OF_INPUT;
    var c = base64Str.charCodeAt(base64Count) & 0xff;
    base64Count++;
    return c;
}
function encodeBase64(str){
    setBase64Str(str);
    var result = '';
    var inBuffer = new Array(3);
    var lineCount = 0;
    var done = false;
    while (!done && (inBuffer[0] = readBase64()) != END_OF_INPUT){
        inBuffer[1] = readBase64();
        inBuffer[2] = readBase64();
        result += (base64Chars[ inBuffer[0] >> 2 ]);
        if (inBuffer[1] != END_OF_INPUT){
            result += (base64Chars [(( inBuffer[0] << 4 ) & 0x30) | (inBuffer[1] >> 4) ]);
            if (inBuffer[2] != END_OF_INPUT){
                result += (base64Chars [((inBuffer[1] << 2) & 0x3c) | (inBuffer[2] >> 6) ]);
                result += (base64Chars [inBuffer[2] & 0x3F]);
            } else {
                result += (base64Chars [((inBuffer[1] << 2) & 0x3c)]);
                result += ('=');
                done = true;
            }
        } else {
            result += (base64Chars [(( inBuffer[0] << 4 ) & 0x30)]);
           ...