JSFiddle - React, Tailwind, and code Playground

by kein1945

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<form class="form-horizontal">
    <legend>
       <a href="http://www.movable-type.co.uk/scripts/tea-block.html">Tiny Encryption Algorithm</a>
    </legend>
<div class="control-group">
    <label class="control-label" for="password">Password</label>
    <div class="controls">
        <input id="password" type="password"/>
    </div>
</div>
    
<div class="control-group">
    <label class="control-label" for="text" id="text-label">Text</label>
    <div class="controls">
        <input id="text" type="text"/>
    </div>
</div>
    
<div class="control-group">
    <label class="control-label" for="encrypt" id="encrypt-label">Encrypt</label>
    <div class="controls">
        <input id="encrypt" type="text"/>
    </div>
</div>
    
</form>

CSS

body {
    padding: 20px 40px
}

JavaScript

var password = $('#password'),
    text = $('#text'),
    enc = $('#encrypt')
    , encrypt = function() {
        enc.val(Tea.encrypt(text.val(), password.val()))
    }, decrypt = function() {
        text.val(Tea.decrypt(enc.val(), password.val()))
    };
$('#text-label').click(decrypt)
$('#encrypt-label').click(encrypt)
text.on('blur', encrypt)
enc.on('blur', decrypt);

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
/*  Block TEA (xxtea) Tiny Encryption Algorithm implementation in JavaScript                      */
/*     (c) Chris Veness 2002-2012: www.movable-type.co.uk/tea-block.html                          */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */
/*  Algorithm: David Wheeler & Roger Needham, Cambridge University Computer Lab                   */
/*             http://www.cl.cam.ac.uk/ftp/papers/djw-rmn/djw-rmn-tea.html (1994)                 */
/*             http://www.cl.cam.ac.uk/ftp/users/djw3/xtea.ps (1997)                              */
/*             http://www.cl.cam.ac.uk/ftp/users/djw3/xxtea.ps (1998)                             */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  */

var Tea = {}; // Tea namespace
/*
 * encrypt text using Corrected Block TEA (xxtea) algorithm
 *
 * @param {string} plaintext String to be encrypted (multi-byte safe)
 * @param {string} password  Password to be used for encryption (1st 16 chars)
 * @returns {string} encrypted text
 */
Tea.encrypt = function(plaintext, password) {
    if (plaintext.length == 0) return (''); // nothing to encrypt
    // convert string to array of longs after converting any multi-byte chars to UTF-8
    var v = Tea.strToLongs(Utf8.encode(plaintext));
    if (v.length <= 1) v[1] = 0; // algorithm doesn't work for n<2 so...