Website is done, writing posts now

This commit is contained in:
Joshua Higgins
2025-05-26 22:33:44 -04:00
parent 7eac18bbc3
commit bed36c8d7c
24 changed files with 162 additions and 11 deletions

19
package-lock.json generated
View File

@@ -12,6 +12,7 @@
"lucide-react": "^0.511.0",
"next": "15.3.2",
"react": "^19.0.0",
"react-audio-player": "^0.17.0",
"react-dom": "^19.0.0",
"react-markdown": "^10.1.0"
},
@@ -4385,7 +4386,6 @@
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
"dev": true,
"license": "MIT"
},
"node_modules/js-yaml": {
@@ -4780,7 +4780,6 @@
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
"dev": true,
"license": "MIT",
"dependencies": {
"js-tokens": "^3.0.0 || ^4.0.0"
@@ -5632,7 +5631,6 @@
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
"dev": true,
"license": "MIT",
"engines": {
"node": ">=0.10.0"
@@ -5956,7 +5954,6 @@
"version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
"dev": true,
"license": "MIT",
"dependencies": {
"loose-envify": "^1.4.0",
@@ -6014,6 +6011,19 @@
"node": ">=0.10.0"
}
},
"node_modules/react-audio-player": {
"version": "0.17.0",
"resolved": "https://registry.npmjs.org/react-audio-player/-/react-audio-player-0.17.0.tgz",
"integrity": "sha512-aCZgusPxA9HK7rLZcTdhTbBH9l6do9vn3NorgoDZRxRxJlOy9uZWzPaKjd7QdcuP2vXpxGA/61JMnnOEY7NXeA==",
"license": "MIT",
"dependencies": {
"prop-types": "^15.7.2"
},
"peerDependencies": {
"react": ">=16",
"react-dom": ">=16"
}
},
"node_modules/react-dom": {
"version": "19.1.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz",
@@ -6030,7 +6040,6 @@
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
"dev": true,
"license": "MIT"
},
"node_modules/react-markdown": {

View File

@@ -13,6 +13,7 @@
"lucide-react": "^0.511.0",
"next": "15.3.2",
"react": "^19.0.0",
"react-audio-player": "^0.17.0",
"react-dom": "^19.0.0",
"react-markdown": "^10.1.0"
},

BIN
public/banner_alt.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 335 KiB

BIN
public/banner_final.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

View File

@@ -1 +0,0 @@
<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>

Before

Width:  |  Height:  |  Size: 391 B

View File

@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

BIN
public/musical_notes.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

View File

@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

Before

Width:  |  Height:  |  Size: 1.3 KiB

33
public/record_player.svg Normal file
View File

@@ -0,0 +1,33 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!-- License: CC0. Made by SVG Repo: https://www.svgrepo.com/svg/289929/record-player-vinyl -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<path style="fill:#E8E8E8;" d="M489.168,512H22.832C10.24,511.968,0.032,501.76,0,489.168V22.832C0.032,10.24,10.24,0.032,22.832,0
H489.16c12.6,0.032,22.808,10.232,22.84,22.832V489.16C511.968,501.76,501.768,511.968,489.168,512z"/>
<circle style="fill:#303030;" cx="249.68" cy="256" r="184"/>
<circle cx="256" cy="256" r="206.336"/>
<circle cx="256" cy="256" r="184"/>
<path style="fill:#999999;" d="M256,443.248c-103.416,0.024-187.272-83.784-187.296-187.2
c-0.024-103.416,83.784-187.272,187.2-187.296s187.272,83.784,187.296,187.2c0,0.016,0,0.032,0,0.048
C443.088,359.344,359.344,443.104,256,443.248z M256,75.2C156.12,75.176,75.128,156.12,75.104,256s80.92,180.872,180.8,180.896
s180.872-80.92,180.896-180.8c0-0.032,0-0.064,0-0.096C436.664,156.2,355.8,75.336,256,75.2z"/>
<circle style="fill:#E21B1B;" cx="256" cy="256" r="68.4"/>
<circle cx="40.4" cy="36.552" r="9.136"/>
<g>
<circle style="fill:#AAAAAA;" cx="65.656" cy="36.552" r="9.136"/>
<circle style="fill:#AAAAAA;" cx="90.904" cy="36.552" r="9.136"/>
</g>
<circle style="fill:#E21B1B;" cx="40.528" cy="442.08" r="9.136"/>
<circle style="fill:#AAAAAA;" cx="74.912" cy="442.08" r="9.136"/>
<rect x="31.4" y="463.008" width="73.064" height="8.952"/>
<g>
<polygon style="fill:#AAAAAA;" points="351.248,367.184 335.176,356.704 424.448,219.784 424.448,53.416 443.648,53.416
443.648,225.488 "/>
<polygon style="fill:#AAAAAA;" points="397.08,296.952 340.144,384.176 321.416,346.544 355.088,294.96 "/>
</g>
<polygon style="fill:#CCCBCA;" points="334.416,372.672 340.144,384.176 443.648,225.488 443.648,53.416 434.048,53.416
434.048,219.784 "/>
<circle style="fill:#AAAAAA;" cx="434.08" cy="64.64" r="37.208"/>
<circle cx="434.08" cy="64.64" r="20.408"/>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>

Before

Width:  |  Height:  |  Size: 128 B

View File

@@ -1 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>

Before

Width:  |  Height:  |  Size: 385 B

View File

@@ -5,6 +5,7 @@ import { ChevronDown } from "lucide-react"
import Navbar from "@/components/navbar";
import {Post} from "@/lib/posts";
import Link from "next/link";
import RecordBox from "@/components/recordbox";
export default function Home() {
const [scrollY, setScrollY] = useState(0)
@@ -43,6 +44,7 @@ export default function Home() {
return (
<div className="relative font-mono">
<title>DAMN.</title>
<RecordBox />
<Navbar />
{/* Parallax Hero Section */}
@@ -51,7 +53,7 @@ export default function Home() {
<div
className="absolute inset-0 w-full h-[120%] bg-cover bg-center bg-no-repeat"
style={{
backgroundImage: `url('/banner.png')`,
backgroundImage: `url('/banner_final.jpg')`,
transform: `translateY(${scrollY * 0.5}px)`,
filter: "brightness(0.7) contrast(1.1)",
}}

View File

@@ -4,6 +4,8 @@ import Link from "next/link"
import Markdown from 'react-markdown'
import { ArrowLeft } from "lucide-react"
import Navbar from "@/components/navbar";
import Image from "next/image";
import RecordBox from "@/components/recordbox";
interface PostPageProps {
params: Promise<{ slug: string }>
@@ -20,6 +22,8 @@ export default async function PostPage({ params }: PostPageProps) {
return (
<div className="min-h-screen bg-black text-white font-mono">
<Navbar />
<RecordBox />
<title>{post.title}</title>
<div className="container mx-auto px-4 py-20">
<div className="max-w-4xl mx-auto">

View File

@@ -0,0 +1,107 @@
"use client";
import Image from "next/image";
import ReactAudioPlayer from "react-audio-player";
import {useEffect, useState} from "react";
export default function RecordBox() {
let player: ReactAudioPlayer | null = null;
let notes: HTMLImageElement | null = null;
const [firstSong, setFirstSong] = useState<string | undefined>();
useEffect(() => {
setFirstSong(randomSong());
}, []);
return <div>
<Image
className="hidden bottom-23 right-0 fixed z-50 pb-2 pr-2"
alt={"It's Playing"} width={100} height={100} src={"/musical_notes_final.gif"}
unoptimized={true}
ref={(ref) => { notes = ref; }}
/>
<button>
<Image className="bottom-0 right-0 fixed z-50 pb-2 pr-2 cursor-pointer"
src={"/record_player.svg"} width={100} height={100} alt={"Player"}
onClick={() => {
if (player != null && notes != null) {
if (player.audioEl.current.paused) {
player.audioEl.current.play().then();
notes.className = "bottom-23 right-0 fixed z-50 pb-2 pr-2";
} else {
player.audioEl.current.pause();
notes.className = "hidden bottom-23 right-0 fixed z-50 pb-2 pr-2";
}
}
}}
/>
</button>
<ReactAudioPlayer
autoPlay={true} controls={false} className=""
volume={0.2}
ref={(element) => { player = element; }}
src={firstSong}
onPlay={() => {started(player, notes)}}
onEnded={() => {ended(player, notes)}}
onPause={() => {stopped(player, notes)}}
/>
</div>
}
function started(player: ReactAudioPlayer | null, notes: HTMLImageElement | null) {
if (player != null && notes != null) {
notes.className = "bottom-23 right-0 fixed z-50 pb-2 pr-2";
}
}
function stopped(player: ReactAudioPlayer | null, notes: HTMLImageElement | null) {
if (player != null && notes != null) {
notes.className = "hidden bottom-23 right-0 fixed z-50 pb-2 pr-2";
}
}
function ended(player: ReactAudioPlayer | null, notes: HTMLImageElement | null) {
if (player != null && notes != null) {
notes.className = "hidden bottom-23 right-0 fixed z-50 pb-2 pr-2";
player.audioEl.current.src = randomSong();
player.audioEl.current.play().then();
}
}
function randomSong(): string {
const rand = Math.floor(Math.random() * 9);
let path = "/songs/";
if (rand == 0) {
path += "blood"
}
if (rand == 1) {
path += "dna"
}
if (rand == 2) {
path += "duckworth"
}
if (rand == 3) {
path += "fear"
}
if (rand == 4) {
path += "feel"
}
if (rand == 5) {
path += "god"
}
if (rand == 6) {
path += "humble"
}
if (rand == 7) {
path += "xxx"
}
if (rand == 8) {
path += "yah"
}
path += "_instrumental.mp3";
return path;
}