SHORK

scripts/shork.js

@@ -0,0 +1,84 @@
+let shork_image = document.getElementById("shork");
+
+let shork = {x: 0, y: 0};
+let mouse = {x: 0, y: 0};
+
+let zoomies = 4;
+
+onmousemove = function(e){
+	mouse.x = e.clientX;
+	mouse.y = e.clientY;
+}
+
+function vector(a, b) {
+	return {
+		x: b.x - a.x,
+		y: b.y - a.y
+	};
+}
+
+function angle(v) {
+	return Math.atan2(v.y, v.x);
+}
+
+function norm(v) {
+	return Math.sqrt(Math.pow(v.x, 2) + Math.pow(v.y, 2));
+}
+
+function unit(v) {
+	let length = norm(v);
+
+	if (length == 0) return {x: 0, y: 0};
+
+	return {x: v.x / length, y: v.y / length};
+}
+
+function scalar(v, a) {
+	return {x: v.x * a, y: v.y * a};
+}
+
+function add(v, u) {
+	return {x: v.x + u.x, y: v.y + u.y};
+}
+
+function equal(v, u, a) {
+	return (Math.abs(v.x - u.x) < a && Math.abs(v.y - u.y) < a);
+}
+
+function distance(x, y, a) {
+	return (norm(vector(x, y)) >= a);
+}
+
+function round(v) {
+	return {x: Math.round(v.x), y: Math.round(v.y)};
+}
+
+function transform(v, a) {
+	return {a: Math.cos(a), b: -Math.sin(a), c: Math.sin(a), d: Math.cos(a), x: v.x, y: v.y};
+}
+
+let direction = vector(shork, mouse)
+let movement = scalar(unit(direction), zoomies);
+let rotation = angle(direction);
+
+function move() { 
+	direction = vector(shork, mouse)
+
+	if (norm(direction) < 4) {
+		shork = mouse;
+	}
+
+	movement = scalar(unit(direction), zoomies * norm(direction)/128);
+	shork = add(shork, movement);
+
+	if (norm(direction) >= 16) {
+		rotation = -(angle(direction) - Math.PI/2 + Math.sin(norm(movement)*2)/8);
+	}
+
+	let trans = transform(shork, rotation);
+	shork_image.style.transform = `matrix(${trans.a}, ${trans.b}, ${trans.c}, ${trans.d}, ${trans.x}, ${trans.y})`;
+	
+	setTimeout(move, 30);
+}
+
+shork_image.addEventListener("click", function(e) {move()}, {once: true});