IMPL: Projects update pre 2025

package.json

@@ -23,6 +23,8 @@
   },
   "type": "module",
   "dependencies": {
-    "@sveltejs/adapter-static": "^2.0.3"
+    "@sveltejs/adapter-static": "^2.0.3",
+    "@types/three": "^0.171.0",
+    "three": "^0.171.0"
   }
 }

src/lib/ArcText.ts

@@ -0,0 +1,28 @@
+import * as THREE from 'three';
+/*
+This creates a dynamic object with a lot of features.
+Notable features include: onhover
+*/
+
+class ArcText {
+    TEXT: string;
+    scene: THREE.Scene
+    object: THREE.Mesh
+
+    constructor(text: string, scene: THREE.Scene) {
+        this.TEXT = text
+        const geometry = new THREE.BoxGeometry( 1, 1, 1 );
+        const material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
+        const cube = new THREE.Mesh( geometry, material );
+        scene.add( cube );
+        this.scene = scene;
+        this.object = cube;
+    }
+
+    animate() {
+
+    }
+}
+
+
+

src/routes/+layout.svelte

@@ -1,20 +1,68 @@
 <script>
     import "../app.css";
+    import * as THREE from 'three';
+    import { onMount } from "svelte";
+
+    /*onMount(() => {
+        const scene = new THREE.Scene();
+        const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
+
+        const renderer = new THREE.WebGLRenderer();
+        renderer.setSize( window.innerWidth, window.innerHeight );
+        renderer.setAnimationLoop( animate );
+        document.body.appendChild( renderer.domElement );
+
+        const geometry = new THREE.BoxGeometry( 1, 1, 1 );
+        const material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
+        const cube = new THREE.Mesh( geometry, material );
+        scene.add( cube );
+
+        camera.position.z = 5;
+
+        // Raycaster and mouse
+const raycaster = new THREE.Raycaster();
+const mouse = new THREE.Vector2();
+
+// Add mousemove event listener
+window.addEventListener('mousemove', (event) => {
+    // Convert mouse position to normalized device coordinates
+    mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
+    mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
+});
+
+
+
+    function animate() {
+        raycaster.setFromCamera(mouse, camera);
+        const intersects = raycaster.intersectObject(cube);
+        if (intersects.length > 0) {
+        // If the mouse is hovering, change color
+        cube.material.color.set(0xff0000);
+    } else {
+        // Reset color
+        cube.material.color.set(0x00ff00);
+    }
+        cube.rotation.x += 0.01;
+        cube.rotation.y += 0.01;
+
+        renderer.render( scene, camera );
+
+    }
+    })*/
 </script>
 
 <div class = "flex flex-row">
     <div class="sidebar bg-purple-300 w-1/4 max-w-[250px] min-h-screen p-5">
         <h2 class="text-xl font-bold text-white mb-4">Mike Zeng</h2>
         <ul class="space-y-3">
             <li><a href="/" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Home</a></li>
-            <li><a href="/research" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Research</a></li>
             <li><a href="/education" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Education</a></li>
+            <li><a href="/research" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Research</a></li>
             <li><a href="/projects" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Projects</a></li>
             <li><a href="/contact" class="block text-white text-lg py-2 px-4 rounded hover:bg-purple-400">Contact</a></li>
         </ul>
     </div>
-
     <div class="py-4 px-16 w-3/4">
-    <slot />
-    </div>
+        <slot />
+        </div>
 </div>

src/routes/education/+page.svelte

@@ -19,10 +19,12 @@ competitions such as USACO and AMCs, as well as having online coursework.
     <h3 class="text-lg text-slate-600 mb-2">Lead Researcher</h3>
     AI application research in the context of human recreation.
     Developed a SOTA retrieval structure for LLMs, improving memory recall compared to prev systems by 50%. Working on reinforcement judgement system for personification of LLM output. Developing a model for real-time AI actions. DM for technical blog.
-
+    See projects tab.
+
     <h2 class="text-xl mt-8">Homelab</h2>
     <h3 class="text-lg text-slate-600 mb-2">System Administrator</h3>
     Designed & maintained an HPC cluster to for server hosting & CPU/GPU compute services for SaaS products & AI inference. Dense virtualization environment running NAS, DNS/DHCP, Postgres, NGINX, Kubernates, remote workstations, OpenVPN, Red Hat Enterprise Linux.
+    See projects tab.
 
     <h2 class="text-xl mt-8">West Computing Club</h2>
     <h3 class="text-lg text-slate-600 mb-2">Co-Founder</h3>

src/routes/projects/+page.svelte

@@ -6,13 +6,41 @@
             img: "https://raw.githubusercontent.com/mzen17/Page-Processor/refs/heads/main/demos/WriterDEMO.png",
             description: "Web-based word processor for editing single-page natured writing (blogs, WNs, etc)",
             tags: ["fastapi", "js", "fullstack", "2024"]
-        },            
+        },
+        {
+            url: "    https://github.com/mzen17/Shards-of-the-Grid",
+            title: "Shards of the Grid",
+            img: "https://github.com/user-attachments/assets/211a1915-21a7-4e43-bdd3-cdbac9906730",
+            description: "A web-based, grid adventure MORPG built with SaaS principles for UIowa Masters Capstone project.",
+            tags: ["rails", "js", "openai", "2024"]
+        },    
         {
             url: "https://github.com/mzen17/HonyakuBot",
             title: "HonyakuBot",
             img: "https://raw.githubusercontent.com/mzen17/HonyakuBot/refs/heads/main/gallery/answer.jpg",
             description: "A game designed to train human beings for translation like an AI. Large datasets with semantic analysis to judge accuracy.",
             tags: ["python", "similarity", "NLP", "2023"]
+        },        
+        {
+            url: "https://github.com/mzen17/cookiemonster/",
+            title: "Cookie Monster",
+            img: "https://raw.githubusercontent.com/mzen17/cookiemonster/refs/heads/main/CookieGraphData.png",
+            description: "A web scrapper for understanding cookies. This is the codebase for our paper about GDPR policies and its affect on cookie use.",
+            tags: ["research", "networks", "internet", "2023"]
+        },
+        {
+            url: "https://github.com/mzen17/ShooterGame-Unity",
+            title: "Shooter Game",
+            img: "https://raw.githubusercontent.com/mzen17/ShooterGame-Unity/refs/heads/master/ShooterGame.png",
+            description: "A build of a shooter game made in Unity with player turns and movement, a unity feature testing experiement.",
+            tags: ["unity3d", "C#", "art", "2022"]
+        },      
+        {
+            url: "https://github.com/mzen17/ping-traceroute",
+            title: "Ping & Traceroute",
+            img: "https://raw.githubusercontent.com/mzen17/ping-traceroute/refs/heads/main/ping.png",
+            description: "A generic implementation of ping and traceroutes in python using socketes and dpkt packet for my networks class.",
+            tags: ["python", "networks", "routers", "2022"]
         },
         {
             url: "https://github.com/mzen17/ThreeJS-Donut",
@@ -43,7 +71,6 @@
             tags: ["fastapi", "react", "openai", "2023"]
         }
     ];
-
     let portdata = [
         {
             title: "Desert",
@@ -92,20 +119,23 @@
         }
     ]
 </script>
-<h1 class="text-2xl mb-5">Active Projects</h1>
+<h1 class="text-2xl mb-5">Active Project/Activities</h1>
 <div class="mb-10 flex flex-row">
-    <a class="bg-green-400 w-96 h-64 mr-10 flex relative" href="https://ltw.pages.dev">
+    <a class="bg-green-400 w-96 h-64 mr-10 flex relative" href="https://ltw.misekai.net">
         <video class="absolute top-0 left-0 w-full h-full object-cover" autoplay loop muted>
             <source src="https://ltw-cdn.starlitex.com/ltw-1mb.mp4" type="video/mp4">
             Your browser does not support the video tag.
         </video>
         <p class="my-auto mx-auto text-white z-10">Light the World</p>
     </a>
-    <div class="bg-[url(/AXNE.png)] w-96 h-64 flex relative">
-        <div class="absolute top-0 left-0 w-full h-full object-cover bg-black bg-opacity-60"></div>
-
-        <p class="my-auto mx-auto text-white z-10", title="Advancing Towards Human Recreation">ATHR Project</p>
-    </div>
+    <a class="bg-[url(/AXNE-DEMO.png)] w-96 h-64 flex relative mr-10 bg-cover bg-center" href="https://github.com/mzen17/Energy-Chan">
+        <div class="absolute top-0 left-0 w-full h-full object-cover bg-black bg-opacity-40"></div>
+        <p class="my-auto mx-auto text-white z-10" title="Advancing Towards Human Recreation">ATHR Project</p>
+    </a>
+    <a class="bg-[url(/Datacenter.png)] w-96 h-64 flex relative bg-cover bg-center" href="https://gist.github.com/mzen17/0fda82381c1f09f746ec1d94e4fa76fc">
+        <div class="absolute top-0 left-0 w-full h-full object-cover bg-black bg-opacity-40"></div>
+        <p class="my-auto mx-auto text-white z-10" title="Advancing Towards Human Recreation">Homelab</p>
+    </a>
 </div>
 <h1 class="text-2xl mb-5">Selected Projects</h1>
 

src/routes/research/+page.svelte

@@ -7,17 +7,23 @@
 
 
 <div class="mb-4">
-<h1 class = "text-2xl mb-1">Experience</h1>
-<h2 class="text-xl">University of Iowa CS:5990</h2>
-<h3 class="text-lg text-slate-600 mb-4">Incoming Networks Researcher, Professor Rishab Nithyanand, Jan 2024-May 2024</h3>
+    <h1 class = "text-2xl mb-1">Experience</h1>
+    <h2 class="text-xl">University of Iowa CS:5990</h2>
+    <h3 class="text-lg text-slate-600 mb-4">Incoming Networks Researcher, Professor Rishab Nithyanand, Jan 2024-May 2024</h3>
+
+    <h2 class="text-xl">UI Hydroinformatics Laboratory</h2>
+    <h3 class="text-lg text-slate-600 mb-2">Interdisplinary Research - Geographic information sciences, Dr. Omer Mermer, Oct 2024-Present</h3>
+    I am currently working as a research assistant with the UI Hydroinformatics Laboratory. My current project is 
+    system for reducing onsite visit costs with a web platform predicting harmful algae blooms through satellite data.
+    </div>
+
+    <h2 class="text-xl">ATHR Lab</h2>
+    <h3 class="text-lg text-slate-600 mb-2">AI Software Research, Feb 2023-Present</h3>
+    I am currently conducting research on human-recreation using software systems. Modules of this project will be submitted for various science fair competitions and peer-reviewed
+    venures such as ACL/NeuralIPS. See more details of this on the projects page.
+
 
-<h2 class="text-xl">UI Hydroinformatics Laboratory</h2>
-<h3 class="text-lg text-slate-600 mb-2">Interdisplinary Research - Systems and Environmental Science, Dr. Omer Mermer, Oct 2024-Present</h3>
-I am currently working as a research assistant with the UI Hydroinformatics Laboratory. My current project is 
-system for reducing onsite visit costs with a web platform predicting harmful algae blooms through satellite data.
-</div>
-
-<div class="mb-4">
+<div class="mb-4 mt-4">
 <h1 class = "text-2xl mb-1">Publications</h1>    
 To be updated later.
 </div>