264 lines
7.6 KiB
HTML
264 lines
7.6 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#000000" />
|
|
<meta name="apple-mobile-web-app-title" content="Jet Pham" />
|
|
<title>Jet Pham - Software Extremist</title>
|
|
<meta
|
|
name="description"
|
|
content="Jet Pham's personal website. Software extremist."
|
|
/>
|
|
<link rel="canonical" href="https://jetpham.com/" />
|
|
<link rel="manifest" href="/manifest.json" />
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<link rel="apple-touch-icon" href="/apple-icon.png" />
|
|
<link
|
|
rel="preload"
|
|
href="/Web437_IBM_VGA_8x16.woff"
|
|
as="font"
|
|
type="font/woff"
|
|
crossorigin
|
|
/>
|
|
<meta property="og:title" content="Jet Pham - Software Extremist" />
|
|
<meta
|
|
property="og:description"
|
|
content="Jet Pham's personal website. Software extremist."
|
|
/>
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:url" content="https://jetpham.com/" />
|
|
<meta property="og:site_name" content="Jet Pham" />
|
|
<meta
|
|
property="og:image"
|
|
content="https://jetpham.com/web-app-manifest-512x512.png"
|
|
/>
|
|
<meta property="og:image:width" content="512" />
|
|
<meta property="og:image:height" content="512" />
|
|
<meta property="og:image:alt" content="Jet Pham" />
|
|
<meta name="twitter:card" content="summary" />
|
|
<meta name="twitter:title" content="Jet Pham - Software Extremist" />
|
|
<meta
|
|
name="twitter:description"
|
|
content="Jet Pham's personal website. Software extremist."
|
|
/>
|
|
<meta
|
|
name="twitter:image"
|
|
content="https://jetpham.com/web-app-manifest-512x512.png"
|
|
/>
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "Person",
|
|
"name": "Jet Pham",
|
|
"givenName": "Jet",
|
|
"familyName": "Pham",
|
|
"description": "Software extremist.",
|
|
"url": "https://jetpham.com",
|
|
"jobTitle": "Software Extremist",
|
|
"hasOccupation": {
|
|
"@type": "Occupation",
|
|
"name": "Hacker"
|
|
},
|
|
"email": "jet@extremist.software",
|
|
"image": "https://jetpham.com/jet.svg",
|
|
"alumniOf": {
|
|
"@type": "CollegeOrUniversity",
|
|
"name": "University of San Francisco",
|
|
"url": "https://www.usfca.edu"
|
|
},
|
|
"hasCredential": {
|
|
"@type": "EducationalOccupationalCredential",
|
|
"credentialCategory": "degree",
|
|
"name": "Bachelor of Science in Computer Science"
|
|
},
|
|
"homeLocation": {
|
|
"@type": "City",
|
|
"name": "San Francisco, CA"
|
|
},
|
|
"workLocation": {
|
|
"@type": "City",
|
|
"name": "San Francisco, CA"
|
|
},
|
|
"memberOf": {
|
|
"@type": "Organization",
|
|
"name": "Noisebridge",
|
|
"url": "https://www.noisebridge.net"
|
|
},
|
|
"affiliation": {
|
|
"@type": "Organization",
|
|
"name": "Noisebridge",
|
|
"url": "https://www.noisebridge.net"
|
|
},
|
|
"sameAs": [
|
|
"https://github.com/jetpham",
|
|
"https://x.com/exmistsoftware",
|
|
"https://bsky.app/profile/extremist.software",
|
|
"https://git.extremist.software"
|
|
]
|
|
}
|
|
</script>
|
|
</head>
|
|
<body style="background: #000">
|
|
<a class="skip-link" href="#outlet">Skip to content</a>
|
|
<canvas
|
|
id="canvas"
|
|
class="pointer-events-none fixed inset-0 z-0 h-screen w-screen"
|
|
aria-hidden="true"
|
|
></canvas>
|
|
<aside id="effect-tuner" class="effect-tuner" aria-label="Effect tuning">
|
|
<h2>[EFFECT TUNER]</h2>
|
|
<label>
|
|
<span>Blur</span>
|
|
<input
|
|
id="effect-blur"
|
|
type="range"
|
|
min="0"
|
|
max="16"
|
|
step="1"
|
|
value="1"
|
|
/>
|
|
<output for="effect-blur" id="effect-blur-value">1</output>
|
|
</label>
|
|
<label>
|
|
<span>Radius</span>
|
|
<input
|
|
id="effect-radius"
|
|
type="range"
|
|
min="1"
|
|
max="60"
|
|
step="1"
|
|
value="20"
|
|
/>
|
|
<output for="effect-radius" id="effect-radius-value">20.0</output>
|
|
</label>
|
|
<label>
|
|
<span>Darkness</span>
|
|
<input
|
|
id="effect-darkness"
|
|
type="range"
|
|
min="0"
|
|
max="1"
|
|
step="0.005"
|
|
value="0.20"
|
|
/>
|
|
<output for="effect-darkness" id="effect-darkness-value">0.20</output>
|
|
</label>
|
|
<label>
|
|
<span>Smallest</span>
|
|
<input
|
|
id="effect-smallest"
|
|
type="range"
|
|
min="0.25"
|
|
max="32"
|
|
step="0.25"
|
|
value="1"
|
|
/>
|
|
<output for="effect-smallest" id="effect-smallest-value">1.00</output>
|
|
</label>
|
|
<label>
|
|
<span>Largest</span>
|
|
<input
|
|
id="effect-largest"
|
|
type="range"
|
|
min="1"
|
|
max="256"
|
|
step="1"
|
|
value="20"
|
|
/>
|
|
<output for="effect-largest" id="effect-largest-value">20</output>
|
|
</label>
|
|
<label>
|
|
<span>Levels</span>
|
|
<input
|
|
id="effect-levels"
|
|
type="range"
|
|
min="1"
|
|
max="10"
|
|
step="1"
|
|
value="3"
|
|
/>
|
|
<output for="effect-levels" id="effect-levels-value">3</output>
|
|
</label>
|
|
<label>
|
|
<span>Detail</span>
|
|
<input
|
|
id="effect-detail"
|
|
type="range"
|
|
min="0.001"
|
|
max="0.5"
|
|
step="0.001"
|
|
value="0.04"
|
|
/>
|
|
<output for="effect-detail" id="effect-detail-value">0.040</output>
|
|
</label>
|
|
<label>
|
|
<span>Dither</span>
|
|
<input
|
|
id="effect-dither"
|
|
type="range"
|
|
min="0"
|
|
max="2"
|
|
step="0.01"
|
|
value="0.75"
|
|
/>
|
|
<output for="effect-dither" id="effect-dither-value">0.75</output>
|
|
</label>
|
|
<label>
|
|
<span>Edge Bias</span>
|
|
<input
|
|
id="effect-edge"
|
|
type="range"
|
|
min="0"
|
|
max="3"
|
|
step="0.05"
|
|
value="1.35"
|
|
/>
|
|
<output for="effect-edge" id="effect-edge-value">1.35</output>
|
|
</label>
|
|
<label>
|
|
<span>Hue Drift</span>
|
|
<input
|
|
id="effect-hue-drift"
|
|
type="range"
|
|
min="0"
|
|
max="0.25"
|
|
step="0.005"
|
|
value="0.08"
|
|
/>
|
|
<output for="effect-hue-drift" id="effect-hue-drift-value"
|
|
>0.080</output
|
|
>
|
|
</label>
|
|
<label>
|
|
<span>Streak</span>
|
|
<input
|
|
id="effect-streak"
|
|
type="range"
|
|
min="0"
|
|
max="1"
|
|
step="0.01"
|
|
value="0.35"
|
|
/>
|
|
<output for="effect-streak" id="effect-streak-value">0.35</output>
|
|
</label>
|
|
</aside>
|
|
<div class="page-frame relative z-10">
|
|
<nav aria-label="Main navigation" class="site-region">
|
|
<div class="site-shell site-panel-frame px-[2ch] py-[1ch]">
|
|
<div class="site-panel-frost" aria-hidden="true"></div>
|
|
<div class="site-panel-border" aria-hidden="true"></div>
|
|
<div class="site-panel-content flex justify-center gap-[2ch]">
|
|
<a href="/" data-nav-link>[HOME]</a>
|
|
<a href="/qa" data-nav-link>[Q&A]</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<main id="outlet" class="site-region" tabindex="-1"></main>
|
|
<footer class="site-region site-footer">
|
|
<div id="site-footer" class="site-shell"></div>
|
|
</footer>
|
|
</div>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|