updated resume

JS/glitch.js

@@ -0,0 +1,134 @@
+async function triggerVirus() {
+	const stage1 = 3000; // 3 s red alert
+	const stage2 = 3000; // next 3 s data corruption
+
+	const snapshot = await html2canvas(document.body);
+	const img = PIXI.Sprite.from(snapshot.toDataURL());
+
+	// wipe page & set black background
+	document.body.innerHTML = "";
+	document.documentElement.style.cssText =
+		"background: black; margin: 0; padding: 0; overflow: hidden;";
+
+	// container for overlays/canvas
+	const container = document.createElement("div");
+	container.id = "virusContainer";
+	Object.assign(container.style, {
+		position: "fixed", top: 0, left: 0,
+		width: "100vw", height: "100vh",
+		display: "flex", alignItems: "center",
+		justifyContent: "center", flexDirection: "column",
+		color: "white", fontFamily: "monospace",
+	});
+	document.body.appendChild(container);
+
+	// -- stage 1: red alert + countdown --
+	const alert = document.createElement("div");
+	alert.id = "virusAlert";
+	container.appendChild(alert);
+
+	let countdown = 10;
+	alert.textContent = `⚠️ SYSTEM PURGE IN ${countdown} ⚠️`;
+	alert.style.cssText = "font-size: 3rem; color: #f00;";
+
+	const timerId = setInterval(() => {
+		countdown -= 1;
+		alert.textContent = `⚠️ SYSTEM PURGE IN ${countdown} ⚠️`;
+		// flash effect
+		alert.style.visibility =
+			alert.style.visibility === "hidden" ? "visible" : "hidden";
+	}, 500);
+
+	// after stage1 ms → stage 2
+	setTimeout(() => {
+		clearInterval(timerId);
+		container.removeChild(alert);
+
+		// -- stage 2: hex stream + shake/flicker --
+		const hex = document.createElement("pre");
+		hex.id = "virusHex";
+		hex.style.cssText = "font-size:1rem; width:80vw; height:100vh; overflow:hidden;";
+		container.appendChild(hex);
+
+		// stream fake hex
+		const hexChars = "0123456789ABCDEF";
+		const streamId = setInterval(() => {
+			let line = "";
+			for (let i = 0; i < 64; i++) {
+				line += hexChars.charAt(Math.random() * 16 | 0);
+			}
+			hex.textContent += line + "\n";
+			hex.scrollTop = hex.scrollHeight;
+		}, 50);
+
+		document.body.classList.add("shake", "flicker");
+
+		setTimeout(() => {
+			console.debug("▶️ entering stage 3 (glitch filter)");
+
+			clearInterval(streamId);
+			container.removeChild(hex);
+
+			// -- stage 3: pixi.js glitch filter on canvas --
+			const canvas = document.createElement("canvas");
+			canvas.id = "virusCanvas";
+
+			canvas.addEventListener('webglcontextlost', event => {
+				event.preventDefault();            // opt into manual recovery
+				console.warn('⚠️ my WebGL context was lost');
+			}, false);
+
+			canvas.width = window.innerWidth;
+			canvas.height = window.innerHeight;
+
+			Object.assign(canvas.style, {
+				position: "fixed", top: 0, left: 0,
+				width: "100vw", height: "100vh", zIndex: 9999,
+			});
+
+
+			container.appendChild(canvas);
+
+			// initialize PixiJS application
+			const app = new PIXI.Application({
+				view: canvas,
+				resizeTo: window,
+				resolution: 1,            // force 1× device pixel ratio
+				autoDensity: true         // keep CSS size but lower GPU size
+			});
+
+			app.renderer.view.addEventListener('webglcontextlost', (e) => {
+				e.preventDefault();
+				console.warn('WebGL lost, falling back to CanvasRenderer');
+				app.destroy(true, { children: true });
+			});
+
+
+			// Create a full-screen white rectangle as the sprite
+			img.width = window.innerWidth;
+			img.height = window.innerHeight;
+			app.stage.addChild(img);
+
+			// apply realistic glitch filter
+			const filter = new PIXI.filters.GlitchFilter({ slices: 20, offset: 10 });
+			app.stage.filters = [filter];
+
+			// animate the filter
+			app.ticker.add(() => {
+				filter.slices = 10 + Math.random() * 30;
+				filter.offset = Math.random() * 20;
+			});
+
+			console.log(app.renderer)
+
+			// block all input
+			const block = (e) => { e.preventDefault(); e.stopImmediatePropagation(); };
+			window.addEventListener("keydown", block, true);
+			window.addEventListener("mousedown", block, true);
+			window.addEventListener("touchstart", block, true);
+
+		}, stage2);
+	}, stage1);
+
+	return "";
+}