diff options
author | Rasmus Andersson <rasmus@notion.se> | 2018-02-20 13:10:20 +0300 |
---|---|---|
committer | Rasmus Andersson <rasmus@notion.se> | 2018-02-20 13:10:20 +0300 |
commit | edfd4883002ec944c92bbf98a7a51f2629efc879 (patch) | |
tree | 7e8f21294cd8ad29cb52e740960535924c1f3f46 /docs/res | |
parent | cbba5f8113430de7b8b29832ff15a7f7338feffd (diff) | |
download | inter-edfd4883002ec944c92bbf98a7a51f2629efc879.tar.xz |
website
Diffstat (limited to 'docs/res')
-rw-r--r-- | docs/res/bindings.js | 37 |
1 files changed, 30 insertions, 7 deletions
diff --git a/docs/res/bindings.js b/docs/res/bindings.js index eb51b87d5..901b4ac37 100644 --- a/docs/res/bindings.js +++ b/docs/res/bindings.js @@ -6,6 +6,7 @@ function Binding(name){ this.name = name this.value = undefined this.inputs = [] + this.outputs = [] this.listeners = [] this.parser = undefined this.formatter = passThrough @@ -30,6 +31,13 @@ Binding.prototype.addInput = function(el) { el.addEventListener('input', _onInput, {passive:true}) } +Binding.prototype.addOutput = function(el) { + this.outputs.push(el) + if (this.value !== undefined) { + el.innerText = this.formatter(this.value) + } +} + // listener signature: // function(nextval string, prevval string, b Binding)void @@ -40,7 +48,6 @@ Binding.prototype.addListener = function(listener) { Binding.prototype.setValue = function(nextval, origin) { - // console.log('Binding.setValue nextval:', nextval, {origin}) var prevval = this.value if (this.parser) { nextval = this.parser(nextval, prevval) @@ -50,11 +57,15 @@ Binding.prototype.setValue = function(nextval, origin) { } var binding = this this.value = nextval + var value = binding.formatter(nextval) this.inputs.forEach(function(input) { if (input.el !== origin) { - input.el.value = binding.formatter(nextval) + input.el.value = value } }) + this.outputs.forEach(function(el) { + el.innerText = value + }) this.listeners.forEach(function(listener) { listener(nextval, prevval, this) }) @@ -75,23 +86,35 @@ Bindings.prototype.getBinding = function(name, input) { } Bindings.prototype.bindInput = function(name, input) { - // console.log('bindInput', name, input) var binding = this.getBinding(name) binding.addInput(input) } +Bindings.prototype.bindOutput = function(name, el) { + var binding = this.getBinding(name) + binding.addOutput(el) +} + Bindings.prototype.bindAllInputs = function(queryOrInputElementList) { var bindings = this - var inputs = ( + var elements = ( typeof queryOrInputElementList == 'string' ? $$(queryOrInputElementList) : queryOrInputElementList ) - inputs.forEach(function(input) { - var bindingName = input.dataset.binding + elements.forEach(function(el) { + var bindingName = el.dataset.binding if (bindingName) { - bindings.bindInput(bindingName, input) + if ( + el.tagName == 'INPUT' || + el.tagName == 'TEXTAREA' || + el.tagName == 'SELECT' + ) { + bindings.bindInput(bindingName, el) + } else { + bindings.bindOutput(bindingName, el) + } } }) } |