Помогите, пожалуйста, с заданием

[Запеканка с изюмом]

1. Создайте текстовое поле. При нажатии на клавиши клавиатуры осуществите вывод номера этой клавиши.
2. Создайте текстовое поле. При нажатии на клавиши клавиатуры осуществите вывод значения этой клавиши.
3. Дана кнопка. Сделайте так, чтобы по нажатию на нее, она окрашивалась в другой цвет, при условии, что при нажатии была зажата клавиша Ctrl.
4. Создайте прямоугольник размера 100px на 100px. Осуществите его перемещение по странице сайта, в зависимости от того, где произошел клик мыши.

[void()]

<textarea></textarea>
<hr>
<button>click me</button>
<hr>
<div class="boll"></div>

<style>
.boll{
  position: absolute;
  left: 10px;
  top: 120px;
  width: 10px;
  height: 10px;
  background-color: #333;
  border-radius: 50%;
  transition: left .5s, top .5s;
}
</style>

<script>
let textBlock = document.querySelector('textarea');
textBlock.addEventListener('keyup', function(e){
        alert(e.keyCode + ' : ' + e.key);
});

let btn = document.querySelector('button');
btn.addEventListener('mouseup', function(e){
if(e.ctrlKey){
        this.style.backgroundColor = 'red';
}
});

let boll = document.querySelector('.boll');
document.addEventListener('click', function(e){
	boll.style.left = e.clientX + 'px';
  boll.style.top = e.clientY + 'px';
});
</script>