-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
61 lines (49 loc) · 7.2 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="author" content="Andrew Hoyer" />
<meta name="description" content="Converts any positive integer into words" />
<title>Andrew Hoyer | Numbers to Words</title>
<link rel="stylesheet" href="assets/reset.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="assets/main.css" type="text/css" charset="utf-8">
</head>
<body>
<div id="wrapper">
<input id="input" maxlength="66" type="text" size="68" value=""/>
<div id="output"></div>
</div>
<h2>What the what?</h2>
<p>I had seen this done before (just do a google search for 'numbers to words javascript' and you'll see solutions all over the place, but it still seemed like a cool idea to do myself. In the end I finished with 50 lines of very readable, very pretty, recursive code.</p>
<p>Sure thats fine and dandy but I thought I could take it further. After some mulling about and a bit of tinkering I was able to get it down to only 8 lines but at the expense of any form of readability. I did this through the (over) usage of the <code>(condition) ? true : false;</code> shorthand for <code>if (condition){ true } else { false }</code>. By using this I was able to get the brunt of the conversion done in only 2 lines. </p>
<p>Heres what the source looks like:</p>
<pre>
var names = [{"0":"zero","1":"one","2":"two","3":"three","4":"four","5":"five","6":"six","7":"seven","8":"eight","9":"nine" },{"0":"ten","1":"eleven","2":"twelve","3":"thirteen","4":"fourteen","5":"fifteen","6":"sixteen","7":"seventeen","8":"eighteen","9":"nineteen"},{"2":"twenty","3":"thirty","4":"forty","5":"fifty","6":"sixty","7":"seventy","8":"eighty","9":"ninety"},["","thousand","million","billion","trillion","quadrillion","quintillion","sextillion","septillion","octillion","nonillion","decillion","undecillion","duodecillion","tredecillion","quattuordecillion", "quindecillion","sexdecillion","septdecillion","octdecillion","novemdecillion","vigintillion"]];
var to_words = function(s, n){
var ns = s.slice(0,3);
return (ns.length < 1)?"":to_words(s.slice(3,s.length),n+1)+((ns.length>1)?((ns.length==3&&ns[2]!="0")?names[0][ns[2]]+" hundred "+((ns[1]=="1")?names[1][ns[0]]+" ":(ns[1]!="0")?names[2][ns[1]]+" "+((ns[0]!="0")?names[0][ns[0]]+" ":""):(ns[0]!="0"?names[0][ns[0]]+" ":"")):((ns[1]=="1")?names[1][ns[0]]+" ":(ns[1]!="0")?names[2][ns[1]]+" "+((ns[0]!="0")?names[0][ns[0]]+" ":""):(ns[0]!="0"?names[0][ns[0]]+" ":""))) + (((ns.length==3&&(ns[0]!="0"||ns[1]!="0"||ns[2]!="0"))||(ns.length==2&&(ns[0]!="0"||ns[1]!="0"))||(ns.length==1&&ns[0]!="0"))?"<span class='magnitude'>"+names[3][n]+"</span> ":""):((ns.length==1&&ns[0]!="0")?names[0][ns[0]]+" ":"") + (((ns.length==3&&(ns[0]!="0"||ns[1]!="0"||ns[2]!="0"))||(ns.length==2&&(ns[0]!="0"||ns[1]!="0"))||(ns.length==1&&ns[0]!="0"))?"<span class='magnitude'>"+names[3][n]+"</span> ":""));
}, input;
document.getElementById('input').addEventListener('keyup', function(){
document.getElementById('output').innerHTML = to_words(this.value.replace(/[^0-9]/g, '').split('').reverse(), 0);
}, false);
</pre>
<h2>A Quick Example : </h2>
<p>If for some reason you come across an incredibly large number such as: 6, 670, 903, 752, 021, 072, 936, 960. You now know that this number is in fact "<em>six sextillion six hundred seventy quintillion nine hundred three quadrillion seven hundred fifty two trillion twenty one billion seventy two million nine hundred thirty six thousand nine hundred sixty</em>"... This as it turns out is the number of possible sudoku puzzles.</p>
<p class="social"><a href="http://andrew-hoyer.com/experiments/">More Experiments</a></p>
<script type="text/javascript">
(function(){
var names = [{"0":"zero","1":"one","2":"two","3":"three","4":"four","5":"five","6":"six","7":"seven","8":"eight","9":"nine" },{"0":"ten","1":"eleven","2":"twelve","3":"thirteen","4":"fourteen","5":"fifteen","6":"sixteen","7":"seventeen","8":"eighteen","9":"nineteen"},{"2":"twenty","3":"thirty","4":"forty","5":"fifty","6":"sixty","7":"seventy","8":"eighty","9":"ninety"},["","thousand","million","billion","trillion","quadrillion","quintillion","sextillion","septillion","octillion","nonillion","decillion","undecillion","duodecillion","tredecillion","quattuordecillion", "quindecillion","sexdecillion","septdecillion","octdecillion","novemdecillion","vigintillion"]];
var to_words = function(s, n){
var ns = s.slice(0,3);
return (ns.length < 1)?"":to_words(s.slice(3,s.length),n+1)+((ns.length>1)?((ns.length==3&&ns[2]!="0")?names[0][ns[2]]+" hundred "+((ns[1]=="1")?names[1][ns[0]]+" ":(ns[1]!="0")?names[2][ns[1]]+" "+((ns[0]!="0")?names[0][ns[0]]+" ":""):(ns[0]!="0"?names[0][ns[0]]+" ":"")):((ns[1]=="1")?names[1][ns[0]]+" ":(ns[1]!="0")?names[2][ns[1]]+" "+((ns[0]!="0")?names[0][ns[0]]+" ":""):(ns[0]!="0"?names[0][ns[0]]+" ":""))) + (((ns.length==3&&(ns[0]!="0"||ns[1]!="0"||ns[2]!="0"))||(ns.length==2&&(ns[0]!="0"||ns[1]!="0"))||(ns.length==1&&ns[0]!="0"))?"<span class='magnitude'>"+names[3][n]+"</span> ":""):((ns.length==1&&ns[0]!="0")?names[0][ns[0]]+" ":"") + (((ns.length==3&&(ns[0]!="0"||ns[1]!="0"||ns[2]!="0"))||(ns.length==2&&(ns[0]!="0"||ns[1]!="0"))||(ns.length==1&&ns[0]!="0"))?"<span class='magnitude'>"+names[3][n]+"</span> ":""));
}, input;
document.getElementById('input').addEventListener('keyup', function(){
document.getElementById('output').innerHTML = to_words(this.value.replace(/[^0-9]/g, '').split('').reverse(), 0);
}, false);
// Setup code that should not be considered:
document.getElementById('input').value = Math.floor(Math.random() * 1000000000) + '' + Math.floor(Math.random() * 1000000000);
document.getElementById('output').innerHTML = to_words(document.getElementById('input').value.replace(/[^0-9]/g, '').split('').reverse(), 0);
})();
</script>
</body>
</html>