Ensure shortcuts don't collide in inputs

This commit is contained in:
Eliot Berriot 2017-12-12 22:15:50 +01:00
parent a52d8a25b2
commit 37383a53b2
No known key found for this signature in database
GPG Key ID: DD6965E2476E5C27
4 changed files with 54 additions and 3 deletions

View File

@ -18,7 +18,6 @@
"js-logger": "^1.3.0",
"semantic-ui-css": "^2.2.10",
"vue": "^2.3.3",
"vue-global-events": "^1.0.2",
"vue-resource": "^1.3.4",
"vue-router": "^2.3.1",
"vuedraggable": "^2.14.1"

View File

@ -94,7 +94,7 @@
</template>
<script>
import GlobalEvents from 'vue-global-events'
import GlobalEvents from '@/components/utils/global-events'
import Player from '@/components/audio/Player'
import favoriteTracks from '@/favorites/tracks'

View File

@ -68,7 +68,7 @@
</template>
<script>
import GlobalEvents from 'vue-global-events'
import GlobalEvents from '@/components/utils/global-events'
import queue from '@/audio/queue'
import Track from '@/audio/track'

View File

@ -0,0 +1,52 @@
<script>
import $ from 'jquery'
const modifiersRE = /^[~!&]*/
const nonEventNameCharsRE = /\W+/
const names = {
'!': 'capture',
'~': 'once',
'&': 'passive'
}
function extractEventOptions (eventDescriptor) {
const [modifiers] = eventDescriptor.match(modifiersRE)
return modifiers.split('').reduce((options, modifier) => {
options[names[modifier]] = true
return options
}, {})
}
export default {
render: h => h(),
mounted () {
this._listeners = Object.create(null)
Object.keys(this.$listeners).forEach(event => {
const handler = this.$listeners[event]
let wrapper = function (event) {
// we check here the event is not triggered from an input
// to avoid collisions
if (!$(event.target).is(':input, [contenteditable]')) {
handler(event)
}
}
document.addEventListener(
event.replace(nonEventNameCharsRE, ''),
wrapper,
extractEventOptions(event)
)
this._listeners[event] = handler
})
},
beforeDestroy () {
for (const event in this._listeners) {
document.removeEventListener(
event.replace(nonEventNameCharsRE, ''),
this._listeners[event]
)
}
}
}
</script>