Index: sky/examples/radio.sky |
diff --git a/sky/examples/radio.sky b/sky/examples/radio.sky |
index ec666d9ec94f99399c781bfe644e2a52eb9a7697..5c9be9dbf1840203500f9790fc41cbab7bba79e5 100644 |
--- a/sky/examples/radio.sky |
+++ b/sky/examples/radio.sky |
@@ -11,32 +11,36 @@ SKY MODULE - radio button and radio button group |
</template> |
<script> |
module.exports = {}; |
- module.exports.RadioElement = sky.registerElement('radio', class extends Element { |
- constructor () { |
- super(); |
- this.addEventListener('click', (event) => this.checked = true); |
- this.addShadowRoot(new sky.ShadowRoot(module.document.findId('radio-shadow').content.cloneNode(true))); |
- } |
- get checked () { |
- return this.hasAttribute('checked'); |
- } |
- set checked (value) { |
- if (value) |
- this.setAttribute('checked', ''); |
- else |
- this.removeAttribute('checked'); |
- } |
- get value () { |
- return this.getAttribute('name'); |
- } |
- set value (value) { |
- this.setAttribute('value', value); |
- } |
- attributeChanged(name, oldValue, newValue) { |
- if ((name == 'checked') && (newValue != null)) |
- if (this.parentNode instanceof module.exports.RadioGroupElement) |
- this.parentNode.setChecked(this); |
- } |
+ module.exports.RadioElement = sky.registerElement({ |
+ tagName: 'radio', |
+ shadow: true, |
+ prototype: class extends Element { |
+ constructor () { |
+ super(); |
+ this.addEventListener('click', (event) => this.checked = true); |
+ this.shadowRoot.appendChild(module.document.findId('radio-shadow').content.cloneNode(true)); |
+ } |
+ get checked () { |
+ return this.hasAttribute('checked'); |
+ } |
+ set checked (value) { |
+ if (value) |
+ this.setAttribute('checked', ''); |
+ else |
+ this.removeAttribute('checked'); |
+ } |
+ get value () { |
+ return this.getAttribute('name'); |
+ } |
+ set value (value) { |
+ this.setAttribute('value', value); |
+ } |
+ attributeChanged(name, oldValue, newValue) { |
+ if ((name == 'checked') && (newValue != null)) |
+ if (this.parentNode instanceof module.exports.RadioGroupElement) |
+ this.parentNode.setChecked(this); |
+ } |
+ }, |
}); |
</script> |
@@ -47,34 +51,38 @@ SKY MODULE - radio button and radio button group |
</style> |
</template> |
<script> |
- module.exports.RadioGroupElement = sky.registerElement('radiogroup', class extends Element { |
- constructor () { |
- super(); |
- this.addShadowRoot(new sky.ShadowRoot(module.document.findId('radiogroup-shadow').content.cloneNode(true))); |
- } |
- get value () { |
- let children = this.getChildNodes(); |
- for (let child of children) |
- if (child instanceof module.exports.RadioElement) |
- if (child.checked) |
- return child.name; |
- return ''; |
- } |
- set value (name) { |
- let children = this.getChildNodes(); |
- for (let child of children) |
- if (child instanceof module.exports.RadioElement) |
- if (child.value == name) |
- child.checked = true; |
- } |
- setChecked(radio) { |
- if (!((radio instanceof module.exports.Radio) && radio.parentNode == this)) |
- throw; |
- let children = this.getChildNodes(); |
- for (let child of children) |
- if (child instanceof module.exports.RadioElement) |
- if (child != radio) |
- child.checked = false; |
- } |
+ module.exports.RadioGroupElement = sky.registerElement({ |
+ tagName: 'radiogroup', |
+ shadow: true, |
+ prototype: class extends Element { |
+ constructor () { |
+ super(); |
+ this.shadowRoot.appendChild(module.document.findId('radiogroup-shadow').content.cloneNode(true)); |
+ } |
+ get value () { |
+ let children = this.getChildNodes(); |
+ for (let child of children) |
+ if (child instanceof module.exports.RadioElement) |
+ if (child.checked) |
+ return child.name; |
+ return ''; |
+ } |
+ set value (name) { |
+ let children = this.getChildNodes(); |
+ for (let child of children) |
+ if (child instanceof module.exports.RadioElement) |
+ if (child.value == name) |
+ child.checked = true; |
+ } |
+ setChecked(radio) { |
+ if (!((radio instanceof module.exports.Radio) && radio.parentNode == this)) |
+ throw; |
+ let children = this.getChildNodes(); |
+ for (let child of children) |
+ if (child instanceof module.exports.RadioElement) |
+ if (child != radio) |
+ child.checked = false; |
+ } |
+ }, |
}); |
</script> |