tben/personal-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updates

Browse Source
This commit is contained in:
Benjamin Toby
2023-10-24 18:59:00 +01:00
parent d163438f7b
commit b9364a702c
68 changed files with 4701 additions and 4697 deletions
Download Patch File Download Diff File Expand all files Collapse all files
functions/frontend/submitContactForm.ts
+40 -40
View File
@@ -1,40 +1,40 @@
import { Dispatch, SetStateAction } from "react";
export default async function submitContactForm(e: any, setSuccess: Dispatch<SetStateAction<string | null>>, setLoading: Dispatch<SetStateAction<boolean>>) {
e.preventDefault();
setLoading(true);
let name = e.target[0].value;
let email = e.target[1].value;
let message = e.target[2].value;
let body = {
name: name,
email: email,
message: message,
};
let res = await fetch("/api/contactForm", {
method: "post",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(body),
});
let data = await res.json();
console.log(data);
if (data.msg === "Success") {
setSuccess("Success");
setTimeout(() => {
window.location.reload();
}, 1000);
} else {
setSuccess("Failed");
}
setLoading(false);
}
import { Dispatch, SetStateAction } from "react";
export default async function submitContactForm(e: any, setSuccess: Dispatch<SetStateAction<string | null>>, setLoading: Dispatch<SetStateAction<boolean>>) {
e.preventDefault();
setLoading(true);
let name = e.target[0].value;
let email = e.target[1].value;
let message = e.target[2].value;
let body = {
name: name,
email: email,
message: message,
};
let res = await fetch("/api/contactForm", {
method: "post",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(body),
});
let data = await res.json();
console.log(data);
if (data.msg === "Success") {
setSuccess("Success");
setTimeout(() => {
window.location.reload();
}, 1000);
} else {
setSuccess("Failed");
}
setLoading(false);
}
functions/frontend/textShuffle.js
+12 -12
View File
@@ -1,13 +1,13 @@
export const textSHuffle = (text, dispatch) => {
let shuffleTimer = 0;
let startText = text;
let shuffledtext
setInterval(()=>{
shuffleTimer++
shuffledtext = startText + "whatever";
}, 200);
return shuffledtext
export const textSHuffle = (text, dispatch) => {
let shuffleTimer = 0;
let startText = text;
let shuffledtext
setInterval(()=>{
shuffleTimer++
shuffledtext = startText + "whatever";
}, 200);
return shuffledtext
}
functions/frontend/threeJsAnimations.js
+132 -132
View File
@@ -1,132 +1,132 @@
import * as THREE from "three";
export default function threeJsAnimations() {
const animationWrapper = document.getElementById("homepage-animation-wrapper");
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, animationWrapper.clientWidth / animationWrapper.clientHeight, 0.1, 1000);
const light = new THREE.PointLight(0xff0000, 1, 200);
light.position.set(-1, -1, 5);
const ambientLight = new THREE.AmbientLight("#adb2d3");
const pointLight = new THREE.PointLight(0xffffff, 1, 100);
pointLight.position.set(10, 10, 10);
const sphereSize = 1;
const pointLightHelper = new THREE.PointLightHelper(pointLight, sphereSize);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(animationWrapper.clientWidth, animationWrapper.clientHeight);
animationWrapper.appendChild(renderer.domElement);
const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "rgb(30, 33, 68)",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: true,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube = new THREE.Mesh(geometry, material);
const material2 = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "#1668e4",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: false,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube2 = new THREE.Mesh(geometry, material2);
cube2.position.x = window.innerWidth > 500 ? 1.5 : -0.5;
cube2.position.y = window.innerWidth > 500 ? 1.5 : 1.8;
cube2.position.z = -1;
cube2.scale.x = 0.3;
cube2.scale.y = 0.3;
cube2.scale.z = 0.3;
const material3 = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "rgb(53, 65, 194)",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: false,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube3 = new THREE.Mesh(geometry, material3);
scene.add(cube);
scene.add(cube2);
scene.add(cube3);
scene.add(ambientLight);
scene.add(light);
scene.add(pointLight);
scene.add(pointLightHelper);
cube3.position.x = -1.5;
cube3.position.y = -1.5;
cube3.position.z = -1;
cube3.scale.x = 0.2;
cube3.scale.y = 0.2;
cube3.scale.z = 0.2;
camera.position.z = 2;
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
cube.rotation.x += 0.002;
cube.rotation.y += 0.002;
cube2.rotation.x += 0.005;
cube2.rotation.y += 0.005;
cube3.rotation.x += 0.01;
cube3.rotation.y += 0.01;
scene.rotation.z += 0.0003;
}
animate();
window.addEventListener("mousemove", (e) => {
let relMouseX = e.x - window.innerWidth / 2;
let relMouseY = e.y - window.innerHeight / 2;
// console.log("X pos: ", relMouseX);
// console.log("Y pos: ", relMouseY);
// console.log(e.y);
relMouseX < 0 ? (cube.rotation.x += 0.003) : (cube.rotation.x += 0.003);
relMouseY > 0 ? (cube.rotation.y += 0.003) : (cube.rotation.y += 0.003);
relMouseX < 0 ? (cube2.position.x += 0.001) : (cube2.position.x -= 0.001);
relMouseY > 0 ? (cube2.position.y += 0.001) : (cube2.position.y -= 0.001);
relMouseX < 0 ? (cube3.position.x += 0.0007) : (cube3.position.x -= 0.0007);
relMouseY > 0 ? (cube3.position.y += 0.0007) : (cube3.position.y -= 0.0007);
});
window.addEventListener("resize", (e) => {
renderer.setSize(animationWrapper.clientWidth, window.innerHeight);
});
window.addEventListener("scroll", (e) => {
if (window.scrollY > 100) {
scene.remove(cube2);
scene.remove(cube3);
} else {
scene.add(cube2);
scene.add(cube3);
}
});
}
import * as THREE from "three";
export default function threeJsAnimations() {
const animationWrapper = document.getElementById("homepage-animation-wrapper");
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, animationWrapper.clientWidth / animationWrapper.clientHeight, 0.1, 1000);
const light = new THREE.PointLight(0xff0000, 1, 200);
light.position.set(-1, -1, 5);
const ambientLight = new THREE.AmbientLight("#adb2d3");
const pointLight = new THREE.PointLight(0xffffff, 1, 100);
pointLight.position.set(10, 10, 10);
const sphereSize = 1;
const pointLightHelper = new THREE.PointLightHelper(pointLight, sphereSize);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(animationWrapper.clientWidth, animationWrapper.clientHeight);
animationWrapper.appendChild(renderer.domElement);
const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "rgb(30, 33, 68)",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: true,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube = new THREE.Mesh(geometry, material);
const material2 = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "#1668e4",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: false,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube2 = new THREE.Mesh(geometry, material2);
cube2.position.x = window.innerWidth > 500 ? 1.5 : -0.5;
cube2.position.y = window.innerWidth > 500 ? 1.5 : 1.8;
cube2.position.z = -1;
cube2.scale.x = 0.3;
cube2.scale.y = 0.3;
cube2.scale.z = 0.3;
const material3 = new THREE.MeshPhongMaterial({
// light
// specular: "rgb(30, 33, 68)",
// intermediate
color: "rgb(53, 65, 194)",
// dark
// emissive: "rgb(30, 33, 68)",
shininess: 50,
wireframe: false,
// map: THREE.ImageUtils.loadTexture("http://i.imgur.com/xCE2Br4.jpg?1"),
});
const cube3 = new THREE.Mesh(geometry, material3);
scene.add(cube);
scene.add(cube2);
scene.add(cube3);
scene.add(ambientLight);
scene.add(light);
scene.add(pointLight);
scene.add(pointLightHelper);
cube3.position.x = -1.5;
cube3.position.y = -1.5;
cube3.position.z = -1;
cube3.scale.x = 0.2;
cube3.scale.y = 0.2;
cube3.scale.z = 0.2;
camera.position.z = 2;
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
cube.rotation.x += 0.002;
cube.rotation.y += 0.002;
cube2.rotation.x += 0.005;
cube2.rotation.y += 0.005;
cube3.rotation.x += 0.01;
cube3.rotation.y += 0.01;
scene.rotation.z += 0.0003;
}
animate();
window.addEventListener("mousemove", (e) => {
let relMouseX = e.x - window.innerWidth / 2;
let relMouseY = e.y - window.innerHeight / 2;
// console.log("X pos: ", relMouseX);
// console.log("Y pos: ", relMouseY);
// console.log(e.y);
relMouseX < 0 ? (cube.rotation.x += 0.003) : (cube.rotation.x += 0.003);
relMouseY > 0 ? (cube.rotation.y += 0.003) : (cube.rotation.y += 0.003);
relMouseX < 0 ? (cube2.position.x += 0.001) : (cube2.position.x -= 0.001);
relMouseY > 0 ? (cube2.position.y += 0.001) : (cube2.position.y -= 0.001);
relMouseX < 0 ? (cube3.position.x += 0.0007) : (cube3.position.x -= 0.0007);
relMouseY > 0 ? (cube3.position.y += 0.0007) : (cube3.position.y -= 0.0007);
});
window.addEventListener("resize", (e) => {
renderer.setSize(animationWrapper.clientWidth, window.innerHeight);
});
window.addEventListener("scroll", (e) => {
if (window.scrollY > 100) {
scene.remove(cube2);
scene.remove(cube3);
} else {
scene.add(cube2);
scene.add(cube3);
}
});
}