function doEncode() {
	var original = $original.val();
	original = (original === "") ? $original.attr("placeholder") : original;
	var sResult = HTMLEncode(original);
	$encoded.attr("placeholder", sResult).val(sResult);
}

var encodings = {
	34: """,
	38: "&",
	39: "'",
	60: "<",
	62: ">",
	160: " ",
	161: "¡",
	162: "¢",
	163: "£",
	164: "¤",
	165: "¥",
	166: "¦",
	167: "§",
	168: "¨",
	169: "©",
	170: "ª",
	171: "«",
	172: "¬",
	173: "­",
	174: "®",
	175: "¯",
	176: "°",
	177: "±",
	178: "²",
	179: "³",
	180: "´",
	181: "µ",
	182: "¶",
	183: "·",
	184: "¸",
	185: "¹",
	186: "º",
	187: "»",
	188: "¼",
	189: "½",
	190: "¾",
	191: "¿",
	192: "À",
	193: "Á",
	194: "Â",
	195: "Ã",
	196: "Ä",
	197: "Å",
	198: "Æ",
	199: "Ç",
	200: "È",
	201: "É",
	202: "Ê",
	203: "Ë",
	204: "Ì",
	205: "Í",
	206: "Î",
	207: "Ï",
	208: "Ð",
	209: "Ñ",
	210: "Ò",
	211: "Ó",
	212: "Ô",
	213: "Õ",
	214: "Ö",
	215: "×",
	216: "Ø",
	217: "Ù",
	218: "Ú",
	219: "Û",
	220: "Ü",
	221: "Ý",
	222: "Þ",
	223: "ß",
	224: "à",
	225: "á",
	226: "â",
	227: "ã",
	228: "ä",
	229: "å",
	230: "æ",
	231: "ç",
	232: "è",
	233: "é",
	234: "ê",
	235: "ë",
	236: "ì",
	237: "í",
	238: "î",
	239: "ï",
	240: "ð",
	241: "ñ",
	242: "ò",
	243: "ó",
	244: "ô",
	245: "õ",
	246: "ö",
	247: "÷",
	248: "ø",
	249: "ù",
	250: "ú",
	251: "û",
	252: "ü",
	253: "ý",
	254: "þ",
	255: "ÿ",
	338: "Œ",
	339: "œ",
	352: "Š",
	353: "š",
	376: "Ÿ",
	402: "ƒ",
	710: "ˆ",
	732: "˜",
	913: "Α",
	914: "Β",
	915: "Γ",
	916: "Δ",
	917: "Ε",
	918: "Ζ",
	919: "Η",
	920: "Θ",
	921: "Ι",
	922: "Κ",
	923: "Λ",
	924: "Μ",
	925: "Ν",
	926: "Ξ",
	927: "Ο",
	928: "Π",
	929: "Ρ",
	931: "Σ",
	932: "Τ",
	933: "Υ",
	934: "Φ",
	935: "Χ",
	936: "Ψ",
	937: "Ω",
	945: "α",
	946: "β",
	947: "γ",
	948: "δ",
	949: "ε",
	950: "ζ",
	951: "η",
	952: "θ",
	953: "ι",
	954: "κ",
	955: "λ",
	956: "μ",
	957: "ν",
	958: "ξ",
	959: "ο",
	960: "π",
	961: "ρ",
	962: "ς",
	963: "σ",
	964: "τ",
	965: "υ",
	966: "φ",
	967: "χ",
	968: "ψ",
	969: "ω",
	977: "ϑ",
	978: "ϒ",
	982: "ϖ",
	8194: " ",
	8195: " ",
	8201: " ",
	8204: "‌",
	8205: "‍",
	8206: "‎",
	8207: "‏",
	8211: "–",
	8212: "—",
	8216: "‘",
	8217: "’",
	8218: "‚",
	8220: "“",
	8221: "”",
	8222: "„",
	8224: "†",
	8225: "‡",
	8226: "•",
	8230: "…",
	8240: "‰",
	8242: "′",
	8243: "″",
	8249: "‹",
	8250: "›",
	8254: "‾",
	8260: "⁄",
	8364: "€",
	8465: "ℑ",
	8472: "℘",
	8476: "ℜ",
	8482: "™",
	8501: "ℵ",
	8592: "←",
	8593: "↑",
	8594: "→",
	8595: "↓",
	8596: "↔",
	8629: "↵",
	8656: "⇐",
	8657: "⇑",
	8658: "⇒",
	8659: "⇓",
	8660: "⇔",
	8704: "∀",
	8706: "∂",
	8707: "∃",
	8709: "∅",
	8711: "∇",
	8712: "∈",
	8713: "∉",
	8715: "∋",
	8719: "∏",
	8721: "∑",
	8722: "−",
	8727: "∗",
	8730: "√",
	8733: "∝",
	8734: "∞",
	8736: "∠",
	8743: "∧",
	8744: "∨",
	8745: "∩",
	8746: "∪",
	8747: "∫",
	8756: "∴",
	8764: "∼",
	8773: "≅",
	8776: "≈",
	8800: "≠",
	8801: "≡",
	8804: "≤",
	8805: "≥",
	8834: "⊂",
	8835: "⊃",
	8836: "⊄",
	8838: "⊆",
	8839: "⊇",
	8853: "⊕",
	8855: "⊗",
	8869: "⊥",
	8901: "⋅",
	8942: "⋮",
	8968: "⌈",
	8969: "⌉",
	8970: "⌊",
	8971: "⌋",
	9001: "⟨",
	9002: "⟩",
	9674: "◊",
	9824: "♠",
	9827: "♣",
	9829: "♥",
	9830: "♦"
};

function HTMLEncode(original) {

	var encoded = "";
	var c = "",
		ccode;
	for (var i = 0; i < original.length; i++) {
		ccode = original.charCodeAt(i);
		c = encodings[ccode];
		encoded += (typeof c !== "undefined") ? c : String.fromCharCode(ccode);
	}
	return encoded;
}

function showKnownEntities() {
	var $entities = $(".entities");
	var sHTML = "";
	for (var code in encodings) {
		sHTML += "<div title=\"" + code+" - "+ encodings[code].replace(/[\&;]/g, "") + "\">" + encodings[code] + "</div>";
	}
	$entities.html(sHTML);
}

var $original, $encoded;
$(function () {
	$original = $("#original");
	$encoded = $("#encoded");
	$original.on("keyup", doEncode);
	doEncode();

	showKnownEntities();
});