Dafrok/v-hotkey

Is it possible to load keymap dynamically?

amirshawn opened this issue · 8 comments

amirshawn commented

I'm curious if there's a way to load the keymap dynamically from an object? If so what would work for that?

Here is what I've tried, it creates the object but it doesn't trigger the function:

keymap () {
  var jsonObj = {};
  for(var i=0; i<this.shipping_presets.length; i++){
    jsonObj[this.shipping_presets[i].hotkey.title] = this.selectPreset;
  }
   return jsonObj;
},

Thank you for your help!

amirshawn commented

I figured it out! I just needed to create a seperate component and use a v-if to mount the component once the data from the database was done loading. Now I'm able to pass the keyboard event back to the parent. Thank you for your plugin!

Dafrok commented

Dynamic keymap as a feature sounds useful, I'll have a try to implement it.

amirshawn commented

Yeah, it's definitely a necessity! It seems to be working great as is though as long as you wrap the hotkey computed properties in a component and don't render it until all the database data is loaded. It probably could be done in a more elegant way though. I'm interested in seeing how you approach it.

Dafrok commented

Hello there, dynamic keymaps has been supported @0.3.0 version, enjoy it!

Just try this https://dafrok.github.io/v-hotkey/#/step/6

amirshawn commented

Hi Dafrok,
Thank you for implementing that. Do you have a code example of how to implement that?
Thank you,
Amir

Dafrok commented

Change the return value of keymap properties, without anything else.

amirshawn commented

It would be nice if it were possible to pass data to the method that is being called.
Let's say you had this object:
presets:{ 0:{ hotkey: 'alt+1', data:{ somedata: 'data' } }, 1:{ hotkey: 'alt+2', data:{ somedata: 'more data' } }, },
if you could then loop through the object in the keymap, then pass the data to the function that you are calling I think that would be great. Sort of like this maybe:
computed: { keymap(){ var obj = {}; this.presets.forEach((preset) => { obj[preset.hotkey] = this.selectPreset(preset) }); return obj; } },