nike/buildoz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

set value for bz-select & bz-toggler

Browse Source
This commit is contained in:
STEINNI
2025-10-20 15:42:41 +00:00
parent 64501453c9
commit 2042a498ec
1 changed files with 42 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
buildoz.js
View File

@@ -39,10 +39,13 @@ class Buildoz extends HTMLElement {
}
class BZselect extends Buildoz {
#value
constructor(){
super()
this.value = null
this.open = false
this.value = null
this.defaultAttrs = {
label: 'Select...',
}
@@ -69,6 +72,22 @@ class BZselect extends Buildoz {
// super.attributeChangedCallback(name, oldValue, newValue)
// }
get value(){ return(this.#value) }
set value(v) {
this.#value = v
if(this.options && this.options.length>0) {
const opt = Array.from(this.options).find(opt => opt.value==v)
if(v || (opt && opt.textContent)) this.button.textContent = opt.textContent
else this.button.textContent = this.getBZAttribute('label')
this.dispatchEvent(new Event('change', {
bubbles: true,
composed: false,
cancelable: false
}))
}
}
toggle(){
for(const opt of this.options){
if(this.open) opt.classList.remove('open')
@@ -85,15 +104,7 @@ class BZselect extends Buildoz {
onOption(value, silent=false){
if(this.getAttribute('disabled') !== null) return
this.value = value
if(!silent) this.toggle()
const opt = Array.from(this.options).find(opt => opt.value==value)
if(value || (opt && opt.textContent)) this.button.textContent = opt.textContent
else this.button.textContent = this.getBZAttribute('label')
this.dispatchEvent(new Event('change', {
bubbles: true,
composed: false,
cancelable: false
}))
if(!silent) this.toggle()
}
addOption(value, markup){
@@ -105,8 +116,9 @@ class BZselect extends Buildoz {
this.options = this.querySelectorAll('option')
}
fillOptions(opts, erase = true){
fillOptions(opts, erase = true){
if(erase){
//this.options = this.querySelectorAll('option')
this.options.forEach(node => { node.remove() })
this.options = this.querySelectorAll('option')
this.onOption('', true) // unselect last
@@ -118,9 +130,10 @@ Buildoz.define('select', BZselect)
class BZtoggler extends Buildoz {
#value
constructor(){
super()
this.value = null
this.open = false
this.defaultAttrs = {
labelLeft:'',
@@ -170,7 +183,7 @@ class BZtoggler extends Buildoz {
if(this.getBZAttribute('classOff')) this.switch.classList.remove(this.getBZAttribute('classOff'))
if(this.getBZAttribute('classOn')) this.switch.classList.add(this.getBZAttribute('classOn'))
this.thumb.classList.add('turned-on')
this.value = this.getBZAttribute('trueValue')
this.#value = this.getBZAttribute('trueValue')
this.focus()
}
@@ -178,14 +191,14 @@ class BZtoggler extends Buildoz {
if(this.getBZAttribute('classOn')) this.switch.classList.remove(this.getBZAttribute('classOn'))
if(this.getBZAttribute('classOff'))this.switch.classList.add(this.getBZAttribute('classOff'))
this.thumb.classList.remove('turned-on')
this.value = this.getBZAttribute('falseValue')
this.#value = this.getBZAttribute('falseValue')
this.focus()
}
toggle(event) {
if(event) { event.preventDefault(); event.stopPropagation(); }
if(this.getBZAttribute('disabled')) return
if(this.value == this.getBZAttribute('trueValue')) this.turnOff()
if(this.#value == this.getBZAttribute('trueValue')) this.turnOff()
else this.turnOn()
this.dispatchEvent(new Event('change', {
bubbles: true,
@@ -193,5 +206,20 @@ class BZtoggler extends Buildoz {
cancelable: false
}))
}
get value(){ return(this.#value) }
set value(v) {
this.#value = v
if(this.defaultAttrs){
if(this.#value == this.getBZAttribute('trueValue')) this.turnOn()
else this.turnOff()
this.dispatchEvent(new Event('change', {
bubbles: true,
composed: false,
cancelable: false
}))
}
}
}
Buildoz.define('toggler', BZtoggler)