const input = document.getElementById("input");
const defaultContent = input.placeholder;

let focused = false;

input.addEventListener("focus", () => {
  focused = true;
  input.placeholder = "";
});

input.addEventListener("blur", () => {
  focused = false;
  input.placeholder = defaultContent;
});

function resizeInput() {
  input.style.height = 0;
  input.style.height = `${input.scrollHeight}px`;
}

input.addEventListener("input", resizeInput);

window.addEventListener("resize", resizeInput);

document.addEventListener("keypress", event => {
  if (event.key == "Enter") {
    event.preventDefault();
    if (focused) {
      input.blur();
    }
    else {
      input.focus();
      input.setSelectionRange(input.value.length, input.value.length);
    }
    input.value = input.value.replace(/\n/g, "");
  }
})

resizeInput();