summaryrefslogtreecommitdiff
path: root/index.html
blob: 8a50c743a3b33bb49e3474c3c44c7267b724cdfe (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>