bradharms/index.html

## index.html
<!doctype html>
<html>
<head>
  <title>Rotate</title>
  <style>
    body {
      background-color: #443366;
    }
    #thing {
      background-color: #FF3344;
      border: 2px solid #FFFF00;
      box-shadow: 0 3px 6px #000;
      width: 140px;
      height: 140px;
      position: absolute;
      left: 100px;
      top: 100px;
      cursor: pointer;
      color: #fff;
    }
  </style>
</head>
<body>
  <div id="thing">Text</div>
  <script>
    let isDragging = false;
    let angle = 0;
    const thing = document.getElementById('thing');
    thing.addEventListener('mousedown', e => {
      isDragging = true;
    });
    window.addEventListener('mousemove', e => {
      if (isDragging) {
        angle = Math.atan2(e.clientY - (thing.clientHeight * 0.5), e.clientX - (thing.clientWidth * 0.5));
        refresh();
      }
    });
    window.addEventListener('mouseup', e => {
      isDragging = false;
    });

    function refresh() {
      thing.style.transformOrigin = '70px 70px';
      thing.style.transform = `rotate(${angle}rad)`;
    }
  </script>
</body>
</html>
	<!doctype html>
	<html>
	<head>
	<title>Rotate</title>
	<style>
	body {
	background-color: #443366;
	}
	#thing {
	background-color: #FF3344;
	border: 2px solid #FFFF00;
	box-shadow: 0 3px 6px #000;
	width: 140px;
	height: 140px;
	position: absolute;
	left: 100px;
	top: 100px;
	cursor: pointer;
	color: #fff;
	}
	</style>
	</head>
	<body>
	<div id="thing">Text</div>
	<script>
	let isDragging = false;
	let angle = 0;
	const thing = document.getElementById('thing');
	thing.addEventListener('mousedown', e => {
	isDragging = true;
	});
	window.addEventListener('mousemove', e => {
	if (isDragging) {
	angle = Math.atan2(e.clientY - (thing.clientHeight * 0.5), e.clientX - (thing.clientWidth * 0.5));
	refresh();
	}
	});
	window.addEventListener('mouseup', e => {
	isDragging = false;
	});

	function refresh() {
	thing.style.transformOrigin = '70px 70px';
	thing.style.transform = `rotate(${angle}rad)`;
	}
	</script>
	</body>
	</html>