| 12345678910111213 |
- export default class RadioSetting{constructor(options,setting,description){this._setting=setting;this._options=options;this.element=createElement('div','audits-radio-group');this.element.title=description;UI.ARIAUtils.setDescription(this.element,description);UI.ARIAUtils.markAsRadioGroup(this.element);this._radioElements=[];for(const option of this._options){const fragment=UI.Fragment.build`
- <label $="label" class="audits-radio">
- <input $="input" type="radio" value=${option.value} name=${setting.name}>
- ${option.label}
- </label>
- `;this.element.appendChild(fragment.element());if(option.title){UI.Tooltip.install(fragment.$('label'),option.title);}
- const radioElement=fragment.$('input');radioElement.addEventListener('change',this._valueChanged.bind(this));this._radioElements.push(radioElement);}
- this._ignoreChangeEvents=false;this._selectedIndex=-1;setting.addChangeListener(this._settingChanged,this);this._settingChanged();}
- _updateUI(){this._ignoreChangeEvents=true;this._radioElements[this._selectedIndex].checked=true;this._ignoreChangeEvents=false;}
- _settingChanged(){const value=this._setting.get();this._selectedIndex=this._options.findIndex(option=>option.value===value);this._updateUI();}
- _valueChanged(event){if(this._ignoreChangeEvents){return;}
- const selectedRadio=this._radioElements.find(radio=>radio.checked);this._setting.set(selectedRadio.value);}}
- self.Audits=self.Audits||{};Audits=Audits||{};Audits.RadioSetting=RadioSetting;
|
