From e4a5df1706dba7959da59cd83ad19280e18b2928 Mon Sep 17 00:00:00 2001 From: Araxeus Date: Wed, 5 May 2021 15:29:17 +0300 Subject: [PATCH] dynamic update radio group --- src/menu/menu.ts | 10 +++++----- src/menu/menuitem.ts | 32 ++++++++++++++++++++++++++------ 2 files changed, 31 insertions(+), 11 deletions(-) diff --git a/src/menu/menu.ts b/src/menu/menu.ts index 0816acd..faacbd8 100644 --- a/src/menu/menu.ts +++ b/src/menu/menu.ts @@ -257,7 +257,7 @@ export class CETMenu extends Disposable { item = new Separator(menuItem, this.options); } else if (menuItem.type === 'submenu' || menuItem.submenu) { const submenuItems = (menuItem.submenu as Menu).items; - item = new Submenu(menuItem, submenuItems, this.parentData, this.options, this.closeSubMenu); + item = new Submenu(menuItem, this.items, submenuItems, this.parentData, this.options, this.closeSubMenu); if (this.options.enableMnemonics) { const mnemonic = item.getMnemonic(); @@ -274,7 +274,7 @@ export class CETMenu extends Disposable { } } else { const menuItemOptions: IMenuOptions = { enableMnemonics: this.options.enableMnemonics }; - item = new CETMenuItem(menuItem, menuItemOptions, this.closeSubMenu); + item = new CETMenuItem(menuItem, menuItemOptions, this.closeSubMenu, this.items); if (this.options.enableMnemonics) { const mnemonic = item.getMnemonic(); @@ -463,8 +463,8 @@ class Submenu extends CETMenuItem { private showScheduler: RunOnceScheduler; private hideScheduler: RunOnceScheduler; - constructor(item: MenuItem, private submenuItems: MenuItem[], private parentData: ISubMenuData, private submenuOptions?: IMenuOptions, closeSubMenu = () => {}) { - super(item, submenuOptions, closeSubMenu); + constructor(item: MenuItem, menuContainer: IMenuItem[], private submenuItems: MenuItem[], private parentData: ISubMenuData, private submenuOptions?: IMenuOptions, closeSubMenu = () => {}) { + super(item, submenuOptions, closeSubMenu, menuContainer); this.showScheduler = new RunOnceScheduler(() => { if (this.mouseOver) { this.cleanupExistingSubmenu(false); @@ -659,7 +659,7 @@ class Separator extends CETMenuItem { private separatorElement: HTMLElement; constructor(item: MenuItem, options: IMenuOptions) { - super(item, options); + super(item, options, null, null); } render(container: HTMLElement) { diff --git a/src/menu/menuitem.ts b/src/menu/menuitem.ts index 31a32fd..bd2cafc 100644 --- a/src/menu/menuitem.ts +++ b/src/menu/menuitem.ts @@ -39,17 +39,19 @@ export class CETMenuItem extends Disposable implements IMenuItem { private iconElement: HTMLElement; private mnemonic: KeyCode; protected closeSubMenu: () => void; + protected menuContainer: IMenuItem[]; private event: Electron.Event; private currentWindow: BrowserWindow; - constructor(item: MenuItem, options: IMenuOptions = {}, closeSubMenu = () => { }) { + constructor(item: MenuItem, options: IMenuOptions = {}, closeSubMenu = () => {}, menuContainer: IMenuItem[]) { super(); this.item = item; this.options = options; this.currentWindow = remote.getCurrentWindow(); this.closeSubMenu = closeSubMenu; + this.menuContainer = menuContainer; // Set mnemonic if (this.item.label && options.enableMnemonics) { @@ -139,10 +141,13 @@ export class CETMenuItem extends Disposable implements IMenuItem { } if (this.item.type === 'checkbox') { - this.updateChecked(); - } else { - this.closeSubMenu(); - } + this.updateChecked(); + } else if(this.item.type === 'radio') { + this.updateRadioGroup(); + } else { + this.closeSubMenu(); + } + } focus(): void { @@ -228,7 +233,8 @@ export class CETMenuItem extends Disposable implements IMenuItem { pressKey(key: string, modifiers: string[] = []): void { this.currentWindow.webContents.sendInputEvent({ - type: "keydown", + type: "keyDown", + // @ts-ignore -> modifiers will always be of the right type modifiers, keyCode: key, }); @@ -348,6 +354,20 @@ export class CETMenuItem extends Disposable implements IMenuItem { } } + updateRadioGroup() { + for (let menuItem of this.menuContainer) { + if (menuItem instanceof CETMenuItem && menuItem.item.type === 'radio' && menuItem !== this) { + removeClass(menuItem.itemElement, 'checked'); + menuItem.itemElement.setAttribute('role', 'menuitem'); + menuItem.itemElement.setAttribute('aria-checked', 'false'); + } + } + addClass(this.itemElement, 'checked'); + this.itemElement.setAttribute('role', 'menuitemcheckbox'); + this.itemElement.setAttribute('aria-checked', 'true'); + } + + dispose(): void { if (this.itemElement) { removeNode(this.itemElement);