amy/amy.rip
1
0
Fork 0
Code Activity Actions

3d shit

Browse source
This commit is contained in:
amy 2025-05-28 05:42:37 +03:30
parent 83a18f250d
commit 8e249599c9
No known key found for this signature in database
5 changed files with 190 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

4
package.json
View file

@ -10,7 +10,9 @@
},
"dependencies": {
"@types/node": "^20.14.10",
"solid-js": "^1.8.17"
"@types/three": "^0.176.0",
"solid-js": "^1.8.17",
"three": "^0.176.0"
},
"devDependencies": {
"typescript": "^5.2.2",

59
pnpm-lock.yaml generated
View file

@ -11,9 +11,15 @@ importers:
'@types/node':
specifier: ^20.14.10
version: 20.14.10
'@types/three':
specifier: ^0.176.0
version: 0.176.0
solid-js:
specifier: ^1.8.17
version: 1.8.17
three:
specifier: ^0.176.0
version: 0.176.0
devDependencies:
typescript:
specifier: ^5.2.2
@ -132,6 +138,9 @@ packages:
resolution: {integrity: sha512-XEFXSlxiG5td2EJRe8vOmRbaXVgfcBlszKujvVmWIK/UpywWljQCfzAv3RQCGujWQ1RD4YYWEAqDXfuJiy8f5Q==}
engines: {node: '>=6.9.0'}
'@dimforge/rapier3d-compat@0.12.0':
resolution: {integrity: sha512-uekIGetywIgopfD97oDL5PfeezkFpNhwlzlaEYNOA0N6ghdsOvh/HYjSMek5Q2O1PYvRSDFcqFVJl4r4ZBwOow==}
'@esbuild/aix-ppc64@0.21.5':
resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==}
engines: {node: '>=12'}
@ -368,6 +377,9 @@ packages:
cpu: [x64]
os: [win32]
'@tweenjs/tween.js@23.1.3':
resolution: {integrity: sha512-vJmvvwFxYuGnF2axRtPYocag6Clbb5YS7kLL+SO/TeVFzHqDIWrNKYtcsPMibjDx9O+bu+psAy9NKfWklassUA==}
'@types/babel__core@7.20.5':
resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==}
@ -386,6 +398,18 @@ packages:
'@types/node@20.14.10':
resolution: {integrity: sha512-MdiXf+nDuMvY0gJKxyfZ7/6UFsETO7mGKF54MVD/ekJS6HdFtpZFBgrh6Pseu64XTb2MLyFPlbW6hj8HYRQNOQ==}
'@types/stats.js@0.17.4':
resolution: {integrity: sha512-jIBvWWShCvlBqBNIZt0KAshWpvSjhkwkEu4ZUcASoAvhmrgAUI2t1dXrjSL4xXVLB4FznPrIsX3nKXFl/Dt4vA==}
'@types/three@0.176.0':
resolution: {integrity: sha512-FwfPXxCqOtP7EdYMagCFePNKoG1AGBDUEVKtluv2BTVRpSt7b+X27xNsirPCTCqY1pGYsPUzaM3jgWP7dXSxlw==}
'@types/webxr@0.5.22':
resolution: {integrity: sha512-Vr6Stjv5jPRqH690f5I5GLjVk8GSsoQSYJ2FVd/3jJF7KaqfwPi3ehfBS96mlQ2kPCwZaX6U0rG2+NGHBKkA/A==}
'@webgpu/types@0.1.60':
resolution: {integrity: sha512-8B/tdfRFKdrnejqmvq95ogp8tf52oZ51p3f4QD5m5Paey/qlX4Rhhy5Y8tgFMi7Ms70HzcMMw3EQjH/jdhTwlA==}
ansi-styles@3.2.1:
resolution: {integrity: sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==}
engines: {node: '>=4'}
@ -449,6 +473,9 @@ packages:
resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
engines: {node: '>=0.8.0'}
fflate@0.8.2:
resolution: {integrity: sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==}
fsevents@2.3.3:
resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@ -493,6 +520,9 @@ packages:
resolution: {integrity: sha512-eRtbOb1N5iyH0tkQDAoQ4Ipsp/5qSR79Dzrz8hEPxRX10RWWR/iQXdoKmBSRCThY1Fh5EhISDtpSc93fpxUniQ==}
engines: {node: '>=12.13'}
meshoptimizer@0.18.1:
resolution: {integrity: sha512-ZhoIoL7TNV4s5B6+rx5mC//fw8/POGyNxS/DZyCJeiZ12ScLfVwRE/GfsxwiTkMYYD5DmK2/JXnEVXqL4rF+Sw==}
ms@2.1.2:
resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
@ -546,6 +576,9 @@ packages:
resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
engines: {node: '>=4'}
three@0.176.0:
resolution: {integrity: sha512-PWRKYWQo23ojf9oZSlRGH8K09q7nRSWx6LY/HF/UUrMdYgN9i1e2OwJYHoQjwc6HF/4lvvYLC5YC1X8UJL2ZpA==}
to-fast-properties@2.0.0:
resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==}
engines: {node: '>=4'}
@ -767,6 +800,8 @@ snapshots:
'@babel/helper-validator-identifier': 7.24.7
to-fast-properties: 2.0.0
'@dimforge/rapier3d-compat@0.12.0': {}
'@esbuild/aix-ppc64@0.21.5':
optional: true
@ -901,6 +936,8 @@ snapshots:
'@rollup/rollup-win32-x64-msvc@4.18.0':
optional: true
'@tweenjs/tween.js@23.1.3': {}
'@types/babel__core@7.20.5':
dependencies:
'@babel/parser': 7.24.7
@ -928,6 +965,22 @@ snapshots:
dependencies:
undici-types: 5.26.5
'@types/stats.js@0.17.4': {}
'@types/three@0.176.0':
dependencies:
'@dimforge/rapier3d-compat': 0.12.0
'@tweenjs/tween.js': 23.1.3
'@types/stats.js': 0.17.4
'@types/webxr': 0.5.22
'@webgpu/types': 0.1.60
fflate: 0.8.2
meshoptimizer: 0.18.1
'@types/webxr@0.5.22': {}
'@webgpu/types@0.1.60': {}
ansi-styles@3.2.1:
dependencies:
color-convert: 1.9.3
@ -1007,6 +1060,8 @@ snapshots:
escape-string-regexp@1.0.5: {}
fflate@0.8.2: {}
fsevents@2.3.3:
optional: true
@ -1034,6 +1089,8 @@ snapshots:
dependencies:
is-what: 4.1.16
meshoptimizer@0.18.1: {}
ms@2.1.2: {}
nanoid@3.3.7: {}
@ -1099,6 +1156,8 @@ snapshots:
dependencies:
has-flag: 3.0.0
three@0.176.0: {}
to-fast-properties@2.0.0: {}
typescript@5.5.2: {}

1
src/App.tsx
View file

@ -1,3 +1,4 @@
// src/App.tsx
import "./App.css";
import {AdvancedBr, Singular88, SingularOomfie} from "./components/comps.tsx";
import {createSignal, onMount} from "solid-js";

37
src/components/pfp.tsx
View file

@ -1,5 +1,7 @@
import HoverComponent from "./name";
import "./pfp.css";
import {RotatingCubeButton} from "./rotatingCubeButton.tsx";
import {createSignal} from "solid-js";
export function Bdpfp({
setpopupEasterEgg,
@ -29,41 +31,38 @@ export function Bdpfp({
export function Normalpfp({
setpopupEasterEgg,
}: {
}: {
setpopupEasterEgg: (value: boolean) => void;
}) {
// State to control whether the cube or the image is displayed
const [showCube, setShowCube] = createSignal(false);
return (
<div
onContextMenu={(e) => {
e.preventDefault();
setpopupEasterEgg(true);
}}
// On click, toggle the showCube state
onClick={() => setShowCube(true)}
class="birthdayparent header normal"
style={{ cursor: 'pointer', display: 'flex', "justify-content": 'center', "align-items": 'center' }} // Added styles for centering content
>
{showCube() ? (
// If showCube is true, render the RotatingCubeButton
// The onClick for the cube itself can be an empty function or trigger something else
<RotatingCubeButton onClick={() => console.log("Cube pfp clicked!")} />
) : (
// Otherwise, render the original image and HoverComponent
<>
<img
class="initialanim"
src="https://dp.nea.moe/avatar/603229858612510720.png"
alt="amy's current discord pfp"
onMouseEnter={(e) => {
(e.target as HTMLImageElement).animate(
[{ transform: "rotateZ(0deg)" }, { transform: "rotateZ(360deg)" }],
{
duration: 400,
iterations: 1,
},
);
}}
onClick={(e) => {
(e.target as HTMLImageElement).animate(
[{ transform: "rotateY(0deg)" }, { transform: "rotateY(360deg)" }],
{
duration: 150,
iterations: 1,
},
);
}}
/>
<HoverComponent />
</>
)}
</div>
);
}

90
src/components/rotatingCubeButton.tsx Normal file
View file

@ -0,0 +1,90 @@
// src/components/RotatingCubeButton.tsx
import { onCleanup, onMount } from 'solid-js';
import * as THREE from 'three';
interface RotatingCubeButtonProps {
onClick: () => void;
}
export const RotatingCubeButton = (props: RotatingCubeButtonProps) => {
let mountRef: HTMLDivElement | undefined;
let renderer: THREE.WebGLRenderer;
let scene: THREE.Scene;
let camera: THREE.PerspectiveCamera;
let cube: THREE.Mesh;
let animationFrameId: number;
onMount(() => {
if (mountRef) {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, 1, 0.1, 1000);
camera.position.z = 2;
renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
renderer.setSize(mountRef.clientWidth, mountRef.clientHeight);
mountRef.appendChild(renderer.domElement);
const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load(
'https://dp.nea.moe/avatar/603229858612510720.png',
undefined,
() => {
cube.material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
}
);
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ map: texture });
cube = new THREE.Mesh(geometry, material);
scene.add(cube);
const animate = () => {
animationFrameId = requestAnimationFrame(animate);
cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
renderer.render(scene, camera);
};
animate();
const handleResize = () => {
if (mountRef) {
camera.aspect = mountRef.clientWidth / mountRef.clientHeight;
camera.updateProjectionMatrix();
renderer.setSize(mountRef.clientWidth, mountRef.clientHeight);
}
};
window.addEventListener('resize', handleResize);
onCleanup(() => {
window.removeEventListener('resize', handleResize);
cancelAnimationFrame(animationFrameId);
if (mountRef && renderer.domElement) {
mountRef.removeChild(renderer.domElement);
}
geometry.dispose();
material.dispose();
texture.dispose();
renderer.dispose();
});
}
});
return (
<div
ref={mountRef}
onClick={props.onClick}
style={{
width: '20em',
height: '20em',
display: 'flex',
"justify-content": 'center',
"align-items": 'center',
overflow: 'hidden',
}}
>
</div>
);
};