Skip to content

Commit

Permalink
chore: remove underscores from menuitem and menu (#6567)
Browse files Browse the repository at this point in the history 
* chore: remove underscores in menuitem.ts

* chore: remove underscores in menu.ts

* chore: format
  • Loading branch information
@rachel-fenichel
rachel-fenichel authored Oct 25, 2022
1 parent f22303b commit a46e12b
Show file tree
Hide file tree
Showing 2 changed files with 114 additions and 122 deletions.
169 changes: 81 additions & 88 deletions core/menu.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export class Menu {
* (Nulls are never in the array, but typing the array as nullable prevents
* the compiler from objecting to .indexOf(null))
*/
private readonly menuItems_: MenuItem[] = [];
private readonly menuItems: MenuItem[] = [];

/**
* Coordinates of the mousedown event that caused this menu to open. Used to
Expand All @@ -46,28 +46,28 @@ export class Menu {
* This is the element that we will listen to the real focus events on.
* A value of null means no menu item is highlighted.
*/
private highlightedItem_: MenuItem|null = null;
private highlightedItem: MenuItem|null = null;

/** Mouse over event data. */
private mouseOverHandler_: browserEvents.Data|null = null;
private mouseOverHandler: browserEvents.Data|null = null;

/** Click event data. */
private clickHandler_: browserEvents.Data|null = null;
private clickHandler: browserEvents.Data|null = null;

/** Mouse enter event data. */
private mouseEnterHandler_: browserEvents.Data|null = null;
private mouseEnterHandler: browserEvents.Data|null = null;

/** Mouse leave event data. */
private mouseLeaveHandler_: browserEvents.Data|null = null;
private mouseLeaveHandler: browserEvents.Data|null = null;

/** Key down event data. */
private onKeyDownHandler_: browserEvents.Data|null = null;
private onKeyDownHandler: browserEvents.Data|null = null;

/** The menu's root DOM element. */
private element_: HTMLDivElement|null = null;
private element: HTMLDivElement|null = null;

/** ARIA name for this menu. */
private roleName_: aria.Role|null = null;
private roleName: aria.Role|null = null;

/** Constructs a new Menu instance. */
constructor() {}
Expand All @@ -79,7 +79,7 @@ export class Menu {
* @internal
*/
addChild(menuItem: MenuItem) {
this.menuItems_.push(menuItem);
this.menuItems.push(menuItem);
}

/**
Expand All @@ -93,27 +93,27 @@ export class Menu {
// goog-menu is deprecated, use blocklyMenu. May 2020.
element.className = 'blocklyMenu goog-menu blocklyNonSelectable';
element.tabIndex = 0;
if (this.roleName_) {
aria.setRole(element, this.roleName_);
if (this.roleName) {
aria.setRole(element, this.roleName);
}
this.element_ = element;
this.element = element;

// Add menu items.
for (let i = 0, menuItem; menuItem = this.menuItems_[i]; i++) {
for (let i = 0, menuItem; menuItem = this.menuItems[i]; i++) {
element.appendChild(menuItem.createDom());
}

// Add event handlers.
this.mouseOverHandler_ = browserEvents.conditionalBind(
element, 'mouseover', this, this.handleMouseOver_, true);
this.clickHandler_ = browserEvents.conditionalBind(
element, 'click', this, this.handleClick_, true);
this.mouseEnterHandler_ = browserEvents.conditionalBind(
element, 'mouseenter', this, this.handleMouseEnter_, true);
this.mouseLeaveHandler_ = browserEvents.conditionalBind(
element, 'mouseleave', this, this.handleMouseLeave_, true);
this.onKeyDownHandler_ = browserEvents.conditionalBind(
element, 'keydown', this, this.handleKeyEvent_);
this.mouseOverHandler = browserEvents.conditionalBind(
element, 'mouseover', this, this.handleMouseOver, true);
this.clickHandler = browserEvents.conditionalBind(
element, 'click', this, this.handleClick, true);
this.mouseEnterHandler = browserEvents.conditionalBind(
element, 'mouseenter', this, this.handleMouseEnter, true);
this.mouseLeaveHandler = browserEvents.conditionalBind(
element, 'mouseleave', this, this.handleMouseLeave, true);
this.onKeyDownHandler = browserEvents.conditionalBind(
element, 'keydown', this, this.handleKeyEvent);

container.appendChild(element);
return element;
Expand All @@ -126,7 +126,7 @@ export class Menu {
* @internal
*/
getElement(): HTMLDivElement|null {
return this.element_;
return this.element;
}

/**
Expand All @@ -143,7 +143,7 @@ export class Menu {
}

/** Blur the menu element. */
private blur_() {
private blur() {
const el = this.getElement();
if (el) {
el.blur();
Expand All @@ -158,38 +158,38 @@ export class Menu {
* @internal
*/
setRole(roleName: aria.Role) {
this.roleName_ = roleName;
this.roleName = roleName;
}

/** Dispose of this menu. */
dispose() {
// Remove event handlers.
if (this.mouseOverHandler_) {
browserEvents.unbind(this.mouseOverHandler_);
this.mouseOverHandler_ = null;
if (this.mouseOverHandler) {
browserEvents.unbind(this.mouseOverHandler);
this.mouseOverHandler = null;
}
if (this.clickHandler_) {
browserEvents.unbind(this.clickHandler_);
this.clickHandler_ = null;
if (this.clickHandler) {
browserEvents.unbind(this.clickHandler);
this.clickHandler = null;
}
if (this.mouseEnterHandler_) {
browserEvents.unbind(this.mouseEnterHandler_);
this.mouseEnterHandler_ = null;
if (this.mouseEnterHandler) {
browserEvents.unbind(this.mouseEnterHandler);
this.mouseEnterHandler = null;
}
if (this.mouseLeaveHandler_) {
browserEvents.unbind(this.mouseLeaveHandler_);
this.mouseLeaveHandler_ = null;
if (this.mouseLeaveHandler) {
browserEvents.unbind(this.mouseLeaveHandler);
this.mouseLeaveHandler = null;
}
if (this.onKeyDownHandler_) {
browserEvents.unbind(this.onKeyDownHandler_);
this.onKeyDownHandler_ = null;
if (this.onKeyDownHandler) {
browserEvents.unbind(this.onKeyDownHandler);
this.onKeyDownHandler = null;
}

// Remove menu items.
for (let i = 0, menuItem; menuItem = this.menuItems_[i]; i++) {
for (let i = 0, menuItem; menuItem = this.menuItems[i]; i++) {
menuItem.dispose();
}
this.element_ = null;
this.element = null;
}

// Child component management.
Expand All @@ -201,7 +201,7 @@ export class Menu {
* @param elem DOM element whose owner is to be returned.
* @returns Menu item for which the DOM element belongs to.
*/
private getMenuItem_(elem: Element): MenuItem|null {
private getMenuItem(elem: Element): MenuItem|null {
const menuElem = this.getElement();
// Node might be the menu border (resulting in no associated menu item), or
// a menu item's div, or some element within the menu item.
Expand All @@ -211,7 +211,7 @@ export class Menu {
while (currentElement && currentElement !== menuElem) {
if (currentElement.classList.contains('blocklyMenuItem')) {
// Having found a menu item's div, locate that menu item in this menu.
for (let i = 0, menuItem; menuItem = this.menuItems_[i]; i++) {
for (let i = 0, menuItem; menuItem = this.menuItems[i]; i++) {
if (menuItem.getElement() === currentElement) {
return menuItem;
}
Expand All @@ -231,14 +231,14 @@ export class Menu {
* @internal
*/
setHighlighted(item: MenuItem|null) {
const currentHighlighted = this.highlightedItem_;
const currentHighlighted = this.highlightedItem;
if (currentHighlighted) {
currentHighlighted.setHighlighted(false);
this.highlightedItem_ = null;
this.highlightedItem = null;
}
if (item) {
item.setHighlighted(true);
this.highlightedItem_ = item;
this.highlightedItem = item;
// Bring the highlighted item into view. This has no effect if the menu is
// not scrollable.
const el = this.getElement() as Element;
Expand All @@ -255,10 +255,10 @@ export class Menu {
* @internal
*/
highlightNext() {
const index = this.highlightedItem_ ?
this.menuItems_.indexOf(this.highlightedItem_) :
const index = this.highlightedItem ?
this.menuItems.indexOf(this.highlightedItem) :
-1;
this.highlightHelper_(index, 1);
this.highlightHelper(index, 1);
}

/**
Expand All @@ -268,20 +268,20 @@ export class Menu {
* @internal
*/
highlightPrevious() {
const index = this.highlightedItem_ ?
this.menuItems_.indexOf(this.highlightedItem_) :
const index = this.highlightedItem ?
this.menuItems.indexOf(this.highlightedItem) :
-1;
this.highlightHelper_(index < 0 ? this.menuItems_.length : index, -1);
this.highlightHelper(index < 0 ? this.menuItems.length : index, -1);
}

/** Highlights the first highlightable item. */
private highlightFirst_() {
this.highlightHelper_(-1, 1);
private highlightFirst() {
this.highlightHelper(-1, 1);
}

/** Highlights the last highlightable item. */
private highlightLast_() {
this.highlightHelper_(this.menuItems_.length, -1);
private highlightLast() {
this.highlightHelper(this.menuItems.length, -1);
}

/**
Expand All @@ -291,10 +291,10 @@ export class Menu {
* @param startIndex Start index.
* @param delta Step direction: 1 to go down, -1 to go up.
*/
private highlightHelper_(startIndex: number, delta: number) {
private highlightHelper(startIndex: number, delta: number) {
let index = startIndex + delta;
let menuItem;
while (menuItem = this.menuItems_[index]) {
while (menuItem = this.menuItems[index]) {
if (menuItem.isEnabled()) {
this.setHighlighted(menuItem);
break;
Expand All @@ -310,12 +310,12 @@ export class Menu {
*
* @param e Mouse event to handle.
*/
private handleMouseOver_(e: Event) {
const menuItem = this.getMenuItem_(e.target as Element);
private handleMouseOver(e: Event) {
const menuItem = this.getMenuItem(e.target as Element);

if (menuItem) {
if (menuItem.isEnabled()) {
if (this.highlightedItem_ !== menuItem) {
if (this.highlightedItem !== menuItem) {
this.setHighlighted(menuItem);
}
} else {
Expand All @@ -329,7 +329,7 @@ export class Menu {
*
* @param e Click event to handle.
*/
private handleClick_(e: Event) {
private handleClick(e: Event) {
const oldCoords = this.openingCoords;
// Clear out the saved opening coords immediately so they're not used twice.
this.openingCoords = null;
Expand All @@ -351,7 +351,7 @@ export class Menu {
}
}

const menuItem = this.getMenuItem_(e.target as Element);
const menuItem = this.getMenuItem(e.target as Element);
if (menuItem) {
menuItem.performAction();
}
Expand All @@ -362,7 +362,7 @@ export class Menu {
*
* @param _e Mouse event to handle.
*/
private handleMouseEnter_(_e: Event) {
private handleMouseEnter(_e: Event) {
this.focus();
}

Expand All @@ -371,9 +371,9 @@ export class Menu {
*
* @param _e Mouse event to handle.
*/
private handleMouseLeave_(_e: Event) {
private handleMouseLeave(_e: Event) {
if (this.getElement()) {
this.blur_();
this.blur();
this.setHighlighted(null);
}
}
Expand All @@ -387,27 +387,20 @@ export class Menu {
*
* @param e Key event to handle.
*/
private handleKeyEvent_(e: Event) {
if (!this.menuItems_.length) {
private handleKeyEvent(e: Event) {
if (!this.menuItems.length) {
// Empty menu.
return;
}
// AnyDuringMigration because: Property 'altKey' does not exist on type
// 'Event'. AnyDuringMigration because: Property 'metaKey' does not exist
// on type 'Event'. AnyDuringMigration because: Property 'ctrlKey' does not
// exist on type 'Event'. AnyDuringMigration because: Property 'shiftKey'
// does not exist on type 'Event'.
if ((e as AnyDuringMigration).shiftKey ||
(e as AnyDuringMigration).ctrlKey ||
(e as AnyDuringMigration).metaKey || (e as AnyDuringMigration).altKey) {
const keyboardEvent = e as KeyboardEvent;
if (keyboardEvent.shiftKey || keyboardEvent.ctrlKey ||
keyboardEvent.metaKey || keyboardEvent.altKey) {
// Do not handle the key event if any modifier key is pressed.
return;
}

const highlighted = this.highlightedItem_;
// AnyDuringMigration because: Property 'keyCode' does not exist on type
// 'Event'.
switch ((e as AnyDuringMigration).keyCode) {
const highlighted = this.highlightedItem;
switch (keyboardEvent.keyCode) {
case KeyCodes.ENTER:
case KeyCodes.SPACE:
if (highlighted) {
Expand All @@ -425,12 +418,12 @@ export class Menu {

case KeyCodes.PAGE_UP:
case KeyCodes.HOME:
this.highlightFirst_();
this.highlightFirst();
break;

case KeyCodes.PAGE_DOWN:
case KeyCodes.END:
this.highlightLast_();
this.highlightLast();
break;

default:
Expand All @@ -449,10 +442,10 @@ export class Menu {
* @internal
*/
getSize(): Size {
const menuDom = this.getElement();
const menuSize = style.getSize(menuDom as Element);
const menuDom = this.getElement() as HTMLDivElement;
const menuSize = style.getSize(menuDom);
// Recalculate height for the total content, not only box height.
menuSize.height = menuDom!.scrollHeight;
menuSize.height = menuDom.scrollHeight;
return menuSize;
}
}
Loading

0 comments on commit a46e12b

Please sign in to comment.