| OLD | NEW |
|---|
| (Empty) |
| 1 SKY MODULE - radio button and radio button group | |
| 2 <!-- accessibility handling not implemented yet, pending mojo service --> | |
| 3 | |
| 4 <!-- <radio> --> | |
| 5 <template id="radio-shadow"> | |
| 6 <style> | |
| 7 :host { width: 1em; height: 1em; border: solid; background: white; } | |
| 8 :host[checked] { background: black; } | |
| 9 </style> | |
| 10 </template> | |
| 11 <script> | |
| 12 module.exports.RadioElement = module.registerElement( | |
| 13 class extends Element { | |
| 14 static get tagName() { return 'radio'; } | |
| 15 static get shadow() { return true; } | |
| 16 constructor (hostModule) { | |
| 17 super(hostModule); | |
| 18 this.addEventListener('click', (event) => this.checked = true); | |
| 19 this.shadowRoot.append(module.document.findId('radio-shadow').content.clo
neNode(true)); | |
| 20 } | |
| 21 get checked () { | |
| 22 return this.hasAttribute('checked'); | |
| 23 } | |
| 24 set checked (value) { | |
| 25 if (value) | |
| 26 this.setAttribute('checked', ''); | |
| 27 else | |
| 28 this.removeAttribute('checked'); | |
| 29 } | |
| 30 get value () { | |
| 31 return this.getAttribute('name'); | |
| 32 } | |
| 33 set value (value) { | |
| 34 this.setAttribute('value', value); | |
| 35 } | |
| 36 attributeChanged(name, oldValue, newValue) { | |
| 37 if ((name == 'checked') && (newValue != null)) | |
| 38 if (this.parentNode instanceof module.exports.RadioGroupElement) | |
| 39 this.parentNode.setChecked(this); | |
| 40 } | |
| 41 } | |
| 42 ); | |
| 43 </script> | |
| 44 | |
| 45 <!-- <radiogroup> --> | |
| 46 <template id="radiogroup-shadow"> | |
| 47 <style> | |
| 48 :host { padding: 1em; border: thin solid; } | |
| 49 </style> | |
| 50 </template> | |
| 51 <script> | |
| 52 module.exports.RadioGroupElement = module.registerElement( | |
| 53 class extends Element { | |
| 54 static get tagName() { return 'radiogroup'; } | |
| 55 static get shadow() { return true; } | |
| 56 constructor (hostModule) { | |
| 57 super(hostModule); | |
| 58 this.shadowRoot.append(module.document.findId('radiogroup-shadow').conten
t.cloneNode(true)); | |
| 59 } | |
| 60 get value () { | |
| 61 let children = this.getChildNodes(); | |
| 62 for (let child of children) | |
| 63 if (child instanceof module.exports.RadioElement) | |
| 64 if (child.checked) | |
| 65 return child.name; | |
| 66 return ''; | |
| 67 } | |
| 68 set value (name) { | |
| 69 let children = this.getChildNodes(); | |
| 70 for (let child of children) | |
| 71 if (child instanceof module.exports.RadioElement) | |
| 72 if (child.value == name) | |
| 73 child.checked = true; | |
| 74 } | |
| 75 setChecked(radio) { | |
| 76 if (!((radio instanceof module.exports.Radio) && radio.parentNode == this
)) | |
| 77 throw; | |
| 78 let children = this.getChildNodes(); | |
| 79 for (let child of children) | |
| 80 if (child instanceof module.exports.RadioElement) | |
| 81 if (child != radio) | |
| 82 child.checked = false; | |
| 83 } | |
| 84 } | |
| 85 ); | |
| 86 </script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 951673003:
Remove outdated examples and framework pieces (Closed)
Base URL: git@github.com:domokit/mojo.git@master