diff --git a/app/renderer/components/bookmarksToolbar.js b/app/renderer/components/bookmarksToolbar.js index 291fbce3f53..ce30dee56b0 100644 --- a/app/renderer/components/bookmarksToolbar.js +++ b/app/renderer/components/bookmarksToolbar.js @@ -32,9 +32,15 @@ class BookmarkToolbarButton extends ImmutableComponent { this.onDragOver = this.onDragOver.bind(this) this.onContextMenu = this.onContextMenu.bind(this) } + componentDidMount () { + this.bookmarkNode.addEventListener('auxclick', this.onAuxClick.bind(this)) + } get activeFrame () { return windowStore.getFrame(this.props.activeFrameKey) } + onAuxClick (e) { + this.onClick(e) + } onClick (e) { if (!this.props.clickBookmarkItem(this.props.bookmark, e) && this.props.bookmark.get('tags').includes(siteTags.BOOKMARK_FOLDER)) { diff --git a/app/renderer/components/urlBarSuggestionItem.js b/app/renderer/components/urlBarSuggestionItem.js new file mode 100644 index 00000000000..2cc98535376 --- /dev/null +++ b/app/renderer/components/urlBarSuggestionItem.js @@ -0,0 +1,44 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +const React = require('react') +const ImmutableComponent = require('../../../js/components/immutableComponent') +const suggestionTypes = require('../../../js/constants/suggestionTypes') +const cx = require('../../../js/lib/classSet') + +class UrlBarSuggestionItem extends ImmutableComponent { + componentDidMount () { + this.node.addEventListener('auxclick', this.props.onClick) + } + componentWillUpdate (nextProps) { + if (!this.props.selected && nextProps.selected) { + this.node.scrollIntoView() + } + } + render () { + return
  • { this.node = node }} + className={cx({ + selected: this.props.selected, + suggestionItem: true, + [this.props.suggestion.type]: true + })}> + { + this.props.suggestion.type !== suggestionTypes.TOP_SITE && this.props.suggestion.title + ?
    {this.props.suggestion.title}
    + : null + } + { + this.props.suggestion.type !== suggestionTypes.SEARCH && this.props.suggestion.type !== suggestionTypes.ABOUT_PAGES + ?
    {this.props.suggestion.location}
    + : null + } +
  • + } +} + +module.exports = UrlBarSuggestionItem diff --git a/app/renderer/components/urlBarSuggestions.js b/app/renderer/components/urlBarSuggestions.js index f0aaf1693ef..1254a84eb71 100644 --- a/app/renderer/components/urlBarSuggestions.js +++ b/app/renderer/components/urlBarSuggestions.js @@ -3,10 +3,10 @@ * You can obtain one at http://mozilla.org/MPL/2.0/. */ const React = require('react') - -const windowActions = require('../../../js/actions/windowActions') const ImmutableComponent = require('../../../js/components/immutableComponent') +const UrlBarSuggestionItem = require('./urlBarSuggestionItem') +const windowActions = require('../../../js/actions/windowActions') const suggestionTypes = require('../../../js/constants/suggestionTypes') const cx = require('../../../js/lib/classSet') const locale = require('../../../js/l10n') @@ -16,6 +16,7 @@ class UrlBarSuggestions extends ImmutableComponent { constructor () { super() this.onSuggestionClicked = this.onSuggestionClicked.bind(this) + this.onMouseOver = this.onMouseOver.bind(this) } get activeIndex () { @@ -63,27 +64,13 @@ class UrlBarSuggestions extends ImmutableComponent { items = items.concat(suggestions.map((suggestion, i) => { const currentIndex = index + i const selected = this.activeIndex === currentIndex || (!this.activeIndex && currentIndex === 0 && this.props.hasLocationValueSuffix) - return
  • { selected && (this.selectedElement = node) }} - className={cx({ - selected, - suggestionItem: true, - [suggestion.type]: true - })}> - { - suggestion.type !== suggestionTypes.TOP_SITE && suggestion.title - ?
    {suggestion.title}
    - : null - } - { - suggestion.type !== suggestionTypes.SEARCH && suggestion.type !== suggestionTypes.ABOUT_PAGES - ?
    {suggestion.location}
    - : null - } -
  • + return })) index += suggestions.size } @@ -109,12 +96,6 @@ class UrlBarSuggestions extends ImmutableComponent { componentDidMount () { } - componentWillUpdate (nextProps) { - if (this.selectedElement) { - this.selectedElement.scrollIntoView() - } - } - updateSuggestions (newIndex) { const suggestions = this.suggestionList || this.props.suggestionList if (!suggestions) { diff --git a/js/components/contextMenu.js b/js/components/contextMenu.js index 82cb02a14e3..a6d62954008 100644 --- a/js/components/contextMenu.js +++ b/js/components/contextMenu.js @@ -13,6 +13,11 @@ const separatorMenuItem = require('../../app/common/commonMenu').separatorMenuIt const keyCodes = require('../../app/common/constants/keyCodes') class ContextMenuItem extends ImmutableComponent { + componentDidMount () { + if (this.node) { + this.node.addEventListener('auxclick', this.onAuxClick.bind(this)) + } + } get submenu () { return this.props.contextMenuItem.get('submenu') } @@ -65,6 +70,9 @@ class ContextMenuItem extends ImmutableComponent { } windowActions.setContextMenuDetail() } + onAuxClick (e) { + this.onClick(this.props.contextMenuItem.get('click'), true, e) + } onMouseEnter (e) { let openedSubmenuDetails = this.props.contextMenuDetail.get('openedSubmenuDetails') @@ -156,6 +164,7 @@ class ContextMenuItem extends ImmutableComponent { } return
    { this.node = node }} draggable={this.props.contextMenuItem.get('draggable')} onDragStart={this.onDragStart.bind(this)} onDragEnd={this.onDragEnd.bind(this)} diff --git a/js/components/longPressButton.js b/js/components/longPressButton.js index 59fa6863090..d13471fa203 100644 --- a/js/components/longPressButton.js +++ b/js/components/longPressButton.js @@ -15,6 +15,10 @@ class LongPressButton extends ImmutableComponent { this.onMouseLeave = this.onMouseLeave.bind(this) } + componentDidMount (e) { + this.buttonNode.addEventListener('auxclick', this.onAuxClick.bind(this)) + } + onMouseDown (e) { if (e.target.attributes.getNamedItem('disabled')) { return @@ -67,11 +71,16 @@ class LongPressButton extends ImmutableComponent { } } + onAuxClick (e) { + this.onClick(e) + } + render () { return