76 lines
1.5 KiB
JavaScript
76 lines
1.5 KiB
JavaScript
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 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});
|