dev-interaction

interaction resource with keyboard keys icons for Alt:V

colors

black

green

red

blue

yellow

pink

• Keyboard Keys
• Positions
• Colors

function parameters

• DrawSingleKey client side (key, text, color, position, rtl, timeout, onClick, onDestroyed)

• DrawSingleKey server side (player, key, text, color, position, rtl, timeout, onClick, onDestroyed)

• DrawMultipleKey client side (keys, text, color, position, rtl, timeout, onClick, onDestroyed)

• DrawMultipleKey server side (player, keys, text, color, position, rtl, timeout, onClick, onDestroyed)

example

import * as inter from 'dev-interaction'
inter.DrawSingleKey(inter.KeyCodes.E, 'Open shop', inter.Color.BLUE, inter.Position.TOP_LEFT, false, 30000,
() => {
  console.log('Target key clicked')
},
() => {
  console.log('Timeout or view has replaced with other.')
})

// server side is same like client side but only the first parm should be player example
inter.DrawSingleKey(player, inter.KeyCodes.E, 'Open shop', inter.Color.BLUE, inter.Position.TOP_LEFT, false, 30000,
() => {
  console.log('Target key clicked')
},
() => {
  console.log('Timeout or view has replaced with other.')
})

// ~key~ to put key image on text position
inter.DrawSingleKey(inter.KeyCodes.E, 'Press ~key~ to open shop', inter.Color.BLACK, inter.Position.TOP_LEFT, false, 30000,
() => { /*clicked*/},() => {/*destroyed or timeout*/})

// put text before image
inter.DrawSingleKey(inter.KeyCodes.E, 'open shop ~key~', inter.Color.RED, inter.Position.TOP_LEFT, false, 30000,
() => { /*clicked*/},() => {/*destroyed or timeout*/})

// support rtl
inter.DrawSingleKey(inter.KeyCodes.E, 'أضغط ~key~ لفتح المتاجر', inter.Color.BLACK, inter.Position.TOP_LEFT, true, 30000,
() => { /*clicked*/},() => {/*destroyed or timeout*/})

multiple keys

const id = inter.DrawMultipleKey([inter.KeyCodes.ArrowUp, inter.KeyCodes.ArrowDown], 'Press some of this keys', inter.Color.BLACK, inter.Position.TOP_LEFT, false, 3000,
(key) => {
  console.log(`key ${key.icon} code: ${key.code} pressed.`) // some of target keys has been pressed.
  // hide it?
  inter.Hide(id)
  // key checker
  if(inter.isEquals(key, inter.KeyCodes.ArrowUp)){
    // arrow up has clicked.
  }
},
() => { /*timeout or destroyed.*/})

// also we can parse our keys positions.
const id = inter.DrawMultipleKey([inter.KeyCodes.ArrowUp, inter.KeyCodes.ArrowDown], 'Press ~key~ to move up or ~key~ to move down', inter.Color.BLACK, inter.Position.TOP_LEFT, false, 3000,
(key) => {
  console.log(`key ${key.icon} code: ${key.code} pressed.`) // some of target keys has been pressed.
  // hide it?
  inter.Hide(id)
  // key checker
  if(inter.isEquals(key, inter.KeyCodes.ArrowUp)){
    // arrow up has clicked.
  }
},
() => { /*timeout or destroyed.*/})

// or groub to text position.
const id = inter.DrawMultipleKey([inter.KeyCodes.ArrowUp, inter.KeyCodes.ArrowDown], 'Press some of this keys ~keys~ to do something.', inter.Color.BLACK, inter.Position.TOP_LEFT, false, 3000,
(key) => {
  console.log(`key ${key.icon} code: ${key.code} pressed.`) // some of target keys has been pressed.
  // hide it?
  inter.Hide(id)
  // key checker
  if(inter.isEquals(key, inter.KeyCodes.ArrowUp)){
    // arrow up has clicked.
  }
},
() => { /*timeout or destroyed.*/})

// serve side is also same like client side only first parm should be player
const id = inter.DrawMultipleKey(player, [inter.KeyCodes.E, inter.KeyCodes.F], 'Press ~key~ from server side ~key~ this also', inter.Color.BLACK, inter.Position.TOP_LEFT, false, 3000,
(key) => {
  console.log(inter.isEquals(key, inter.KeyCodes.E))
  inter.Hide(id)
})

• q2apro thanks for icons

• don't forget to install packages by npm for Alt:V client & server side

• note: you can show key with text without background color. use inter.Color.NONE