forked from cybrespace/pinafore
simplify click delegates
This commit is contained in:
parent
1b7a01f1ee
commit
160e763e0d
|
@ -4,8 +4,7 @@
|
|||
aria-pressed="{{!!pressed}}"
|
||||
class="{{computedClass}}"
|
||||
disabled="{{disabled}}"
|
||||
delegate-click-key="{{delegateKey}}"
|
||||
delegate-keydown-key="{{delegateKey}}"
|
||||
delegate-key="{{delegateKey}}"
|
||||
on:click
|
||||
>
|
||||
<svg>
|
||||
|
@ -17,8 +16,7 @@
|
|||
aria-label="{{label}}"
|
||||
class="{{computedClass}}"
|
||||
disabled="{{disabled}}"
|
||||
delegate-click-key="{{delegateKey}}"
|
||||
delegate-keydown-key="{{delegateKey}}"
|
||||
delegate-key="{{delegateKey}}"
|
||||
on:click
|
||||
>
|
||||
<svg>
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
<article class="status-article {{getClasses(originalStatus, timelineType, isStatusInOwnThread)}}"
|
||||
tabindex="0"
|
||||
delegate-click-key="{{elementKey}}"
|
||||
delegate-keydown-key="{{elementKey}}"
|
||||
delegate-key="{{elementKey}}"
|
||||
focus-key="{{elementKey}}"
|
||||
aria-posinset="{{index}}"
|
||||
aria-setsize="{{length}}"
|
||||
|
@ -91,7 +90,7 @@
|
|||
import { store } from '../../_store/store'
|
||||
import identity from 'lodash/identity'
|
||||
import { goto } from 'sapper/runtime.js'
|
||||
import { registerDelegate, unregisterDelegate } from '../../_utils/delegate'
|
||||
import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate'
|
||||
|
||||
export default {
|
||||
oncreate() {
|
||||
|
@ -99,15 +98,13 @@
|
|||
let onClickOrKeydown = this.onClickOrKeydown.bind(this)
|
||||
if (!this.get('isStatusInOwnThread')) {
|
||||
// the whole <article> is clickable in this case
|
||||
registerDelegate('click', elementKey, onClickOrKeydown)
|
||||
registerDelegate('keydown', elementKey, onClickOrKeydown)
|
||||
registerClickDelegate(elementKey, onClickOrKeydown)
|
||||
}
|
||||
},
|
||||
ondestroy() {
|
||||
let elementKey = this.get('elementKey')
|
||||
if (!this.get('isStatusInOwnThread')) {
|
||||
unregisterDelegate('click', elementKey)
|
||||
unregisterDelegate('keydown', elementKey)
|
||||
unregisterClickDelegate(elementKey)
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
<script>
|
||||
import IconButton from '../IconButton.html'
|
||||
import { store } from '../../_store/store'
|
||||
import { registerDelegate, unregisterDelegate } from '../../_utils/delegate'
|
||||
import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate'
|
||||
import { setFavorited } from '../../_actions/favorite'
|
||||
|
||||
export default {
|
||||
|
@ -44,13 +44,11 @@
|
|||
this.onFavoriteClick = this.onFavoriteClick.bind(this)
|
||||
|
||||
let favoriteKey = this.get('favoriteKey')
|
||||
registerDelegate('click', favoriteKey, this.onFavoriteClick)
|
||||
registerDelegate('keydown', favoriteKey, this.onFavoriteClick)
|
||||
registerClickDelegate(favoriteKey, this.onFavoriteClick)
|
||||
},
|
||||
ondestroy() {
|
||||
let favoriteKey = this.get('favoriteKey')
|
||||
unregisterDelegate('click', favoriteKey, this.onFavoriteClick)
|
||||
unregisterDelegate('keydown', favoriteKey, this.onFavoriteClick)
|
||||
unregisterClickDelegate(favoriteKey)
|
||||
},
|
||||
components: {
|
||||
IconButton
|
||||
|
|
|
@ -15,7 +15,7 @@ function onEvent (e) {
|
|||
return
|
||||
}
|
||||
mark('delegate onEvent')
|
||||
let attr = `delegate-${type}-key`
|
||||
let attr = `delegate-key`
|
||||
let key
|
||||
let element = target
|
||||
while (element) {
|
||||
|
@ -24,24 +24,18 @@ function onEvent (e) {
|
|||
}
|
||||
element = element.parentElement
|
||||
}
|
||||
if (key && callbacks[type] && callbacks[type][key]) {
|
||||
callbacks[type][key](e)
|
||||
if (key && callbacks[key]) {
|
||||
callbacks[key](e)
|
||||
}
|
||||
stop('delegate onEvent')
|
||||
}
|
||||
|
||||
export function registerDelegate (type, key, callback) {
|
||||
mark('delegate registerDelegate')
|
||||
callbacks[type] = callbacks[type] || {}
|
||||
callbacks[type][key] = callback
|
||||
stop('delegate registerDelegate')
|
||||
export function registerClickDelegate (key, callback) {
|
||||
callbacks[key] = callback
|
||||
}
|
||||
|
||||
export function unregisterDelegate (type, key) {
|
||||
mark('delegate unregisterDelegate')
|
||||
callbacks[type] = callbacks[type] || {}
|
||||
delete callbacks[type][key]
|
||||
stop('delegate unregisterDelegate')
|
||||
export function unregisterClickDelegate (key) {
|
||||
delete callbacks[key]
|
||||
}
|
||||
|
||||
if (process.browser) {
|
||||
|
|
Loading…
Reference in New Issue