blob: 7371a95d8d5035e6f6d7501e4ae84c154ea4a957 (
plain)
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
|
<style>
body.loading { opacity: 0 }
body { font-size: 20px; transition: opacity 0.1s; }
label { min-width: 50px; display: inline-block; text-align: right; }
input { text-align: right; }
#numbers, #buttons { float: left; margin: 20px; }
#buttons { margin: 20px; }
button { font-size: 200%; }
</style>
<body class="loading">
<div id="numbers">
<script type="text/html" id="number-template">
<div>
<label for="base-{{base}}">{{base}}</label>
<input id="base-{{base}}" type="text">
</div>
</script>
</div>
<div id="buttons">
<button id="add">+</button>
<button id="sub">-</button>
<button id="inv">(-)</button>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="./index.js"></script>
<script>
var MAX_BASE = 16
var $inputs = {}
var template = $("#number-template").html()
function init () {
iter(build)
bind()
rebuild(0)
$("body").removeClass("loading")
}
function bind () {
$("#add").click(add)
$("#sub").click(sub)
$("#inv").click(inv)
}
function build (base) {
var $div, $input
$div = $(template.replace(/{{base}}/g, base))
$input = $div.find("input")
$input.on("input", function(){
var n = basic.toNumber( $input.val(), base )
if (isNaN(n)) {
return
}
rebuild(n, base)
})
$inputs[base] = $input
$("#numbers").prepend($div)
}
function rebuild (n, base) {
iter(function(i){
if (i == base) return
var $i = $inputs[i]
var v = basic.toString(n, i)
$i.val(v)
})
}
function iter (f) {
for (var i = -MAX_BASE; i <= MAX_BASE; i++) {
if (basic.validate_base(i)) {
f(i)
}
}
}
function current () {
var n = basic.toNumber( $inputs[2].val(), 2 )
if (isNaN(n)) n = 2
return n
}
function add () {
rebuild( current() + 1 )
}
function sub () {
rebuild( current() - 1 )
}
function inv () {
rebuild( current() * -1 )
}
init()
</script>
|