bbcode input keybind thingy (made for cytube but honestly who cares)

bbcodifier.js

let binds_to_tags = {
  'KeyB': 'b',
  'KeyI': 'i',
  'KeyU': 'u',
  'KeyS': 's',
  'KeyD': 'color',
  'ArrowUp': 'sup',
  'ArrowDown': 'sub',
  'KeyK': 'spoiler',
}

function insertBBCode(val) {
  let chatline = document.getElementById('chatline');
  let startPos = chatline.selectionStart;
  let endPos = chatline.selectionEnd;
  let startOfStr = `${chatline.value.substring(0, startPos)}[${val}]${chatline.value.substring(startPos, endPos)}`
  let endOfStr = `[/${val}]${chatline.value.substring(endPos, chatline.value.length)}`
  
  chatline.value = startOfStr + endOfStr;
  chatline.selectionEnd = chatline.selectionStart = startOfStr.length; // TODO: keep initial selection, add tags around
}

$(document).ready(function () {
  document.getElementById('chatline').addEventListener('keydown', function (e) {
    if (e.ctrlKey && (e.code in binds_to_tags)) {
      insertBBCode(binds_to_tags[e.code])
      e.preventDefault();
    };
  });
});