summaryrefslogtreecommitdiffstats
path: root/die.mjs
diff options
context:
space:
mode:
Diffstat (limited to 'die.mjs')
-rw-r--r--die.mjs64
1 files changed, 64 insertions, 0 deletions
diff --git a/die.mjs b/die.mjs
new file mode 100644
index 0000000..6b3d4fc
--- /dev/null
+++ b/die.mjs
@@ -0,0 +1,64 @@
+class Die {
+ constructor(elt) {
+ this.elt = elt
+
+ this.value = '--'
+ this._boundRollHandler = this.rollHandler.bind(this)
+ this.disable()
+ }
+
+ get valueElt() {
+ if (this._valueElt === undefined) {
+ this._valueElt = this.elt.querySelector('.value')
+ }
+ return this._valueElt
+ }
+
+ get value() {
+ return this.valueElt.innerText
+ }
+
+ set value(val) {
+ this.valueElt.innerText = val
+ }
+
+ get button() {
+ if (this._button === undefined) {
+ this._button = this.elt.querySelector('button')
+ }
+ return this._button
+ }
+
+ enable() {
+ this.elt.classList.add('enabled')
+ this.elt.classList.remove('disabled')
+ this.button.disabled = false
+ this.button.addEventListener('click', this._boundRollHandler)
+ }
+
+ disable() {
+ this.elt.classList.add('disabled')
+ this.elt.classList.remove('enabled')
+ this.button.disabled = true
+ this.button.removeEventListener('click', this._boundRollHandler)
+ }
+
+ get onChanged() {
+ if (this._onChanged !== undefined) {
+ return this._onChanged
+ }
+ return () => {}
+ }
+
+ set onChanged(fn) {
+ this._onChanged = fn
+ }
+
+ rollHandler() {
+ this.value = Math.floor(Math.random() * Die.size) + 1
+ this.onChanged(this.value)
+ }
+}
+Die.size = 20
+
+export default Die