diff --git a/bun.lockb b/bun.lockb index 7e04572..a18a950 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/global.d.ts b/global.d.ts index f7088f6..2c67759 100644 --- a/global.d.ts +++ b/global.d.ts @@ -1,15 +1,5 @@ -import P5 from "p5" -import * as p5Sound from 'p5/lib/addons/p5.sound' -import * as p5Global from 'p5/global' - -export = P5; -export as namespace p5; - declare global { - interface Window { - p5: typeof P5, - setup: () => void, - preload: () => void, - draw: () => void - } -} \ No newline at end of file + let __BLOG_POSTS__: string[] + let __STICKERS__: string[] +} +export { }; diff --git a/package.json b/package.json index cfe6a40..304be8c 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,6 @@ "esbuild": "^0.23.0", "marked": "^13.0.2", "mime-types": "^2.1.35", - "nano-jsx": "^0.1.0", - "p5": "^1.9.4" + "nano-jsx": "^0.1.0" } } \ No newline at end of file diff --git a/src/plugins/dev.ts b/src/plugins/dev.ts index 7fc1305..844e667 100644 --- a/src/plugins/dev.ts +++ b/src/plugins/dev.ts @@ -66,6 +66,9 @@ export default class DevPlugin extends Plugin { } return new Response(rawFile, { headers: { + "Cache-Control": "no-cache, no-store, must-revalidate", + "Pragma": "no-cache", + "Expires": "0", "Content-Type": (mime.lookup(type) || "application/octet-stream") + "; charset=utf-8", }, }); diff --git a/src/plugins/variables.ts b/src/plugins/variables.ts index a73abfe..b83de4b 100644 --- a/src/plugins/variables.ts +++ b/src/plugins/variables.ts @@ -15,6 +15,9 @@ export default class Variables extends Plugin { this.variables["__BLOG_POSTS__"] = JSON.stringify( fs.readdirSync("./website/blogs").map((z) => z.replace(".md", "")) ); + this.variables["__STICKERS__"] = JSON.stringify( + fs.readdirSync("./website/assets/stickers") + ); const templatePath = path.resolve(__dirname, "../../website/templates"); if (fs.existsSync(templatePath)) { for (const file of fs.readdirSync(templatePath)) { diff --git a/website/assets/stickers/meow_sticker.webp b/website/assets/stickers/meow_sticker.webp new file mode 100644 index 0000000..4f2c49b Binary files /dev/null and b/website/assets/stickers/meow_sticker.webp differ diff --git a/website/assets/sticker.webp b/website/assets/stickers/monero1_sticker.webp similarity index 100% rename from website/assets/sticker.webp rename to website/assets/stickers/monero1_sticker.webp diff --git a/website/assets/stickers/monero2_sticker.webp b/website/assets/stickers/monero2_sticker.webp new file mode 100644 index 0000000..aef5a09 Binary files /dev/null and b/website/assets/stickers/monero2_sticker.webp differ diff --git a/website/assets/stickers/monero3_sticker.webp b/website/assets/stickers/monero3_sticker.webp new file mode 100644 index 0000000..aabdbb9 Binary files /dev/null and b/website/assets/stickers/monero3_sticker.webp differ diff --git a/website/assets/stickers/ovpn_sticker.webp b/website/assets/stickers/ovpn_sticker.webp new file mode 100644 index 0000000..07f260a Binary files /dev/null and b/website/assets/stickers/ovpn_sticker.webp differ diff --git a/website/assets/style.css b/website/assets/style.css index 5bfef93..bd30cf7 100644 --- a/website/assets/style.css +++ b/website/assets/style.css @@ -1,36 +1,127 @@ -body[data-theme="light"] { - color: #31363F; +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Noto+Emoji:wght@300..700&display=swap"); + +body { + font-family: "Inter", sans-serif; + font-optical-sizing: auto; + font-style: normal; + font-variation-settings: "slnt" 0; + scrollbar-color: #ffffffae #000000a1; + scrollbar-width: thin; } -body[data-theme="dark"] { - color: #eeeeee; +.order { + display: grid; + grid-template-areas: + "one two" + "four blog" + "three blog"; + grid-gap: 5px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + height: 98vh; +} +@media only screen and (max-width: 600px) { + .order { + grid-template-areas: + "one " + "two " + "blog " + "blog "; + grid-template-columns: 1fr; + } + .three { + display: none !important; + } + body { + scrollbar-width: auto !important; + } +} +.emoji { + font-family: "Noto Emoji", sans-serif; + font-optical-sizing: auto; + font-style: normal; + font-variation-settings: "slnt" 0; +} +.paper > h1, +h2, +h3, +h4, +h5, +h6, +h6s { + margin: 0; + padding: 0; +} +.paper { + color: white; + background-color: #000000de; + padding: 15px; + border: 1px black solid; + border-radius: 5px; + word-wrap: break-word; + overflow: auto; +} +.blog { + grid-area: blog; +} +.one { + grid-area: one; +} +.two { + grid-area: two; +} +.three { + grid-area: three; + display: flex; + flex-direction: row; + gap: 20px; +} +.three > img, +.three > video { + height: 100%; +} +.four { + grid-area: four; +} +.e-mail { + font-size: small; +} +/*https://danmarshall.github.io/google-font-to-svg-path/*/ +/*https://yoksel.github.io/url-encoder/*/ +.repeating-bg { + background-image: url("data:image/svg+xml,%3Csvg width='99.612' height='99.612' viewBox='0 0 99.612 99.612' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='svgGroup' stroke-linecap='round' fill-rule='evenodd' font-size='9pt' stroke='%23000' stroke-width='0.25mm' fill='%23000' style='stroke:%23000;stroke-width:0.25mm;fill:%23000'%3E%3Cpath d='M 30.47 95.753 A 48.715 48.715 0 0 0 49.806 99.611 Q 60.109 99.611 69.142 95.729 Q 78.175 91.847 85.011 85.011 Q 91.847 78.175 95.729 69.142 Q 99.611 60.109 99.611 49.806 Q 99.611 39.503 95.729 30.47 Q 91.847 21.437 85.011 14.601 Q 78.175 7.765 69.142 3.883 Q 60.109 0.001 49.806 0.001 A 48.715 48.715 0 0 0 30.47 3.859 Q 21.437 7.716 14.576 14.576 Q 7.716 21.437 3.859 30.445 A 46.98 46.98 0 0 0 3.169 32.146 A 48.984 48.984 0 0 0 0.001 49.806 A 48.715 48.715 0 0 0 3.859 69.142 Q 7.716 78.175 14.576 85.035 Q 21.437 91.896 30.47 95.753 Z M 49.806 97.657 A 46.875 46.875 0 0 0 68.409 93.946 Q 77.101 90.236 83.668 83.668 Q 90.236 77.101 93.946 68.409 A 46.875 46.875 0 0 0 97.657 49.806 A 46.875 46.875 0 0 0 93.946 31.202 Q 90.236 22.511 83.668 15.944 Q 77.101 9.376 68.409 5.665 A 46.875 46.875 0 0 0 49.806 1.954 A 46.875 46.875 0 0 0 31.202 5.665 Q 22.511 9.376 15.944 15.944 Q 9.376 22.511 5.665 31.202 A 46.875 46.875 0 0 0 1.954 49.806 A 46.875 46.875 0 0 0 5.665 68.409 Q 9.376 77.101 15.944 83.668 Q 22.511 90.236 31.202 93.946 A 46.875 46.875 0 0 0 49.806 97.657 Z M 25.636 75.441 L 23.976 74.464 Q 26.271 70.314 30.299 67.213 Q 34.327 64.112 39.381 62.355 A 31.511 31.511 0 0 1 49.806 60.597 A 31.511 31.511 0 0 1 60.231 62.355 A 31.668 31.668 0 0 1 69.313 67.237 A 24.816 24.816 0 0 1 74.121 72.115 A 22.347 22.347 0 0 1 75.636 74.464 L 73.976 75.441 A 21.687 21.687 0 0 0 69.296 69.752 A 25.564 25.564 0 0 0 68.043 68.727 A 29.994 29.994 0 0 0 59.547 64.186 Q 54.835 62.55 49.806 62.55 Q 44.777 62.55 40.04 64.186 A 30.049 30.049 0 0 0 32.025 68.342 A 28.374 28.374 0 0 0 31.544 68.702 A 22.453 22.453 0 0 0 26.811 73.573 A 20.69 20.69 0 0 0 25.636 75.441 Z M 29.355 43.927 A 4.755 4.755 0 0 0 32.618 45.216 Q 34.913 45.216 36.549 43.263 A 6.833 6.833 0 0 0 37.75 41.187 A 7.624 7.624 0 0 0 38.185 38.575 A 8.876 8.876 0 0 0 38.177 38.195 A 6.983 6.983 0 0 0 36.549 33.888 A 6.828 6.828 0 0 0 36.126 33.427 A 4.823 4.823 0 0 0 32.618 31.935 A 4.64 4.64 0 0 0 30.025 32.707 A 6.163 6.163 0 0 0 28.712 33.888 Q 27.052 35.841 27.052 38.575 A 8.824 8.824 0 0 0 27.056 38.841 A 6.945 6.945 0 0 0 28.712 43.263 A 6.831 6.831 0 0 0 29.355 43.927 Z M 63.73 43.927 A 4.755 4.755 0 0 0 66.993 45.216 Q 69.288 45.216 70.924 43.263 A 6.833 6.833 0 0 0 72.125 41.187 A 7.624 7.624 0 0 0 72.56 38.575 A 8.876 8.876 0 0 0 72.552 38.195 A 6.983 6.983 0 0 0 70.924 33.888 A 6.828 6.828 0 0 0 70.501 33.427 A 4.823 4.823 0 0 0 66.993 31.935 A 4.64 4.64 0 0 0 64.4 32.707 A 6.163 6.163 0 0 0 63.087 33.888 Q 61.427 35.841 61.427 38.575 A 8.824 8.824 0 0 0 61.431 38.841 A 6.945 6.945 0 0 0 63.087 43.263 A 6.831 6.831 0 0 0 63.73 43.927 Z' vector-effect='non-scaling-stroke'/%3E%3C/g%3E%3C/svg%3E"); + background-position: 20px 20px; } -body[data-theme="dark"]>.center>a { - color: #eeeeee !important; +a { + color: white; +} +.fake-input > .input { + border: none; + border-bottom: 2px solid black; +} +.fake-input > .input:focus { + border-bottom: 2px solid red; + outline: none; +} +.fake-input { + border-radius: 6px; + border: 3px solid black; + padding: 2px; +} +.button { + background-color: transparent; + border-radius: 6px; + border: 3px dotted black; + padding: 6px; } -body[data-theme="light"]>.center>a { - color: #31363F !important; +.body-center { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 100%; + display: flex; + justify-content: center; + align-items: center; } - -:root { - font-family: Inter, sans-serif; - font-feature-settings: 'liga' 1, 'calt' 1; -} - -@supports (font-variation-settings: normal) { - :root { - font-family: InterVariable, sans-serif; - } -} - -.center { - position: absolute; - top: 10px; - left: 10px; -} - -.selected { - font-weight: bold; -} \ No newline at end of file diff --git a/website/blog.html b/website/blog.html deleted file mode 100644 index 2daa940..0000000 --- a/website/blog.html +++ /dev/null @@ -1,10 +0,0 @@ -__TEMPLATE_HEAD__ - - - - -
- - - - \ No newline at end of file diff --git a/website/index.html b/website/index.html index 1d5b6f0..b9dd077 100644 --- a/website/index.html +++ b/website/index.html @@ -1,54 +1,83 @@ __TEMPLATE_HEAD__ - + + + for (const sticker of __STICKERS__) { + const img = document.createElement("img"); + img.src = "assets/stickers/" + sticker; + stickers.appendChild(img); + } + }) + + - - -
- | | - + +
+
+

☹️☹️☹️.ovh

+

I'm Latvian, 17. My name's Sophie meows a lot. I love listening to music.

+ +

I love to play games with peeps! My favorite games recently have been Minecraft and Stardew Valley! DM me + if you wanna play with me ^w^

+ +

+ DNI: +
+ Interact: Any person ever +

+

Contact me at matrix, discord, github (view projects here), sadgit, or mastodon. + +

+

E-mail: (run in JS) new TextDecoder().decode(new Uint8Array([115, 111, 102, 105, + 106, 97, 64, + 100, 117, 99, 107, 46, 99, 111, 109]))

+ Signing PGP key downloadable here.
- - I'm Latvian, 17. My name's Sophie. I love listening to music, I have <loading...> song plays. -
- I am a JS/TS developer, mostly specializing in backend work. -
- I play minecraft, and upgun with friends. I have developed many bukkit plugins for Paper/Folia/Spigot - before, and am pretty well versed in them. -
- Contact me at matrix, discord, github (view projects here), sadgit, or mastodon -
- Here's my PGP key. -
-
\ No newline at end of file diff --git a/website/scripts/blog.tsx b/website/scripts/blog.tsx index 1340f42..8476ba5 100644 --- a/website/scripts/blog.tsx +++ b/website/scripts/blog.tsx @@ -10,7 +10,6 @@ export interface Metadata { filename: string; } -//@ts-expect-error const blog_posts = __BLOG_POSTS__ as string[]; const fetchBlogPosts = async () => { @@ -55,34 +54,31 @@ class Main extends Component { } render(blogPosts: Metadata[]) { + const pageOpen = useState(undefined, "pageOpen"); const md = new URLSearchParams(location.search).get("md"); + let pageOpenValueRender = pageOpen[0]; if (blogPosts) { const found = blogPosts.find(z => z.filename == md); if (found) { pageOpen[1](found); - //@ts-expect-error - pageOpen[0] = found; + pageOpenValueRender = found; } } - if (pageOpen[0]) { - return
+ if (pageOpenValueRender) { + return
} - - return
-

sophie's blog

- - back to main page? - {() => { - if (blogPosts) return this.list(blogPosts) - else return

Loading...

- }} - -
+ return <> +

blog

+ {() => { + if (blogPosts) return this.list(blogPosts) + else return

Loading...

+ }} + + } } diff --git a/website/scripts/giscus.tsx b/website/scripts/giscus.tsx index 16910c5..4224f47 100644 --- a/website/scripts/giscus.tsx +++ b/website/scripts/giscus.tsx @@ -1,4 +1,4 @@ -export function Giscus({searchTerm}: {searchTerm: string}) { +export function Giscus({ searchTerm }: { searchTerm: string }) { let config: Record = { "repo": "fucksophie/blog_comments", "repo-id": "R_kgDOMY4cfw", @@ -14,9 +14,9 @@ export function Giscus({searchTerm}: {searchTerm: string}) { "lang": "en", "loading": "lazy", } - for(const x of Object.entries(config)) { + for (const x of Object.entries(config)) { delete config[x[0]]; - config["data-"+x[0]] = x[1]; + config["data-" + x[0]] = x[1]; } return
diff --git a/website/scripts/index.ts b/website/scripts/index.ts deleted file mode 100644 index 12edcd8..0000000 --- a/website/scripts/index.ts +++ /dev/null @@ -1,385 +0,0 @@ -/* - The original version of this ProcessingJava script was written by - Jason Labbe (available here: https://openprocessing.org/sketch/377231/) - - This is a highly modified version by Sophie, firstly re-written using JS, and then - improved using newer techniques (no more pGraphics, using font toPoints now as an example). - Jason Labbe's version is licensed under CC BY-SA 3.0 DEED, and so is this version. - - https://creativecommons.org/licenses/by-sa/3.0/deed.en -*/ - -import type { Keyboard } from "puppeteer"; - -/* - You won't believe what they say about us, bad PR - Bad chemistry between the 9 and 3-Star - Only real fanatics know, TL;DR - In the ER, at the hotel, two key-cards - GTB, they still want to hear "GT-R" - Black Discharge top, G-Star Raw's - Sing Peroxide on the stage in B-sharp - black windows on the strip, black Dodge Charge -*/ - -// Global variables -let particles: Particle[] = []; -let font: p5.Font; -let bgColor: p5.Color; - -let darkMode = false; - -let darkTheme: p5.Color; -let lightTheme: p5.Color; - -interface Bounds { - x: number; - y: number; - w: number; - h: number; -} - -function generateRandomPos(x: number, y: number, mag: number) { - let randomDir = createVector(random(0, width), random(0, height)); - - let pos = createVector(x, y); - pos.sub(randomDir); - pos.normalize(); - pos.mult(mag); - pos.add(x, y); - - return pos; -} - -function getTextSize(text: string, font: p5.Font) { - let fontSize = 1200; // Wait, doesn't this impact performance heavily? - // Nope, a single iteration (once warmed up) only takes around - // 0.04799999999254942ms. This means, that for a 8K screen it'd take - // 11ms, and for normal 1080P screen it takes 20-40ms (891 iterations). - // This can be optimized further, but it's a single run of this function - // every time the word is rerendered. I don't think it matters nearly as much.. - // Pouring too much time into this single number.. what the hell - - let bounds: Bounds; - - //let iters = 0; - //let time = 0; - do { - //const loopstart = performance.now(); - fontSize--; - bounds = font.textBounds(text, 0, 0, fontSize) as Bounds; - // const loopend = performance.now(); - // time += loopend - loopstart; - // iters += 1; - } while (bounds.w > windowWidth - 100); - //console.log("Took " + time + "ms for " + iters + " iterations"); - return fontSize; -} - -class Particle { - pos: p5.Vector; - vel: p5.Vector; - acc: p5.Vector; - - target: p5.Vector; - - closeEnoughTarget: number; - maxSpeed: number; - maxForce: number; - particleSize: number; - isKilled: boolean; - startColor: p5.Color; - targetColor: p5.Color; - colorWeight: number; - colorBlendRate: number; - - constructor() { - this.pos = createVector(0, 0); - this.vel = createVector(0, 0); - this.acc = createVector(0, 0); - this.target = createVector(0, 0); - - this.closeEnoughTarget = 50; - this.maxSpeed = 4.0; - this.maxForce = 0.1; - this.particleSize = 5; - this.isKilled = false; - - this.startColor = color(0); - this.targetColor = color(0); - this.colorWeight = 0; - this.colorBlendRate = 0.025; - } - - move() { - // Check if particle is close enough to its target to slow down - let proximityMult = 1.0; - let distance = dist(this.pos.x, this.pos.y, this.target.x, this.target.y); - if (distance < this.closeEnoughTarget) { - proximityMult = distance / this.closeEnoughTarget; - } - - //.push force towards target - let towardsTarget = createVector(this.target.x, this.target.y); - towardsTarget.sub(this.pos); - towardsTarget.normalize(); - towardsTarget.mult(this.maxSpeed * proximityMult); - - let steer = createVector(towardsTarget.x, towardsTarget.y); - steer.sub(this.vel); - steer.normalize(); - steer.mult(this.maxForce); - this.acc.add(steer); - - // Move particle - this.vel.add(this.acc); - this.pos.add(this.vel); - this.acc.mult(0); - } - - draw() { - // Draw particle - let currentColor = lerpColor( - this.startColor, - this.targetColor, - this.colorWeight - ); - - noStroke(); - fill(currentColor); - ellipse(this.pos.x, this.pos.y, this.particleSize, this.particleSize); - - // Blend towards its target color - if (this.colorWeight < 1.0) { - this.colorWeight = min(this.colorWeight + this.colorBlendRate, 1.0); - } - } - - kill() { - if (!this.isKilled) { - // Set its target outside the scene - let randomPos = generateRandomPos( - width / 2, - height / 2, - (width + height) / 2 - ); - this.target.x = randomPos.x; - this.target.y = randomPos.y; - - // Begin blending its color to black - this.startColor = lerpColor( - this.startColor, - this.targetColor, - this.colorWeight - ); - this.targetColor = color(0); - this.colorWeight = 0; - - this.isKilled = true; - } - } -} - -window.preload = function() { - font = loadFont("https://rsms.me/inter/font-files/InterVariable.ttf"); - darkTheme = color(34, 40, 49, 255); - lightTheme = color(238, 238, 238, 255); -} - -function nextWord(word: string) { - const fontSize = getTextSize(word, font); - const bounds = font.textBounds(word, 0, 0, fontSize) as Bounds; - let sampleFactor = 0.2; - - if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){ - sampleFactor = 0.1; - } - - let points = font.textToPoints( - word, - (windowWidth - 25 - bounds.w) / 2, - (windowHeight + bounds.h / 2) / 2, - fontSize, - { - sampleFactor, - simplifyThreshold: 0, - } - ); - - let newColor = color( - random(0.0, 255.0), - random(0.0, 255.0), - random(0.0, 255.0) - ); - - let particleCount = particles.length; - let particleIndex = 0; - - for (let i = 0; i < points.length; i++) { - let randomIndex = Math.floor(random(0, points.length)); - const point = points[randomIndex]; - - let newParticle; - - if (particleIndex < particleCount) { - newParticle = particles[particleIndex]; - newParticle.isKilled = false; - particleIndex += 1; - } else { - newParticle = new Particle(); - - let randomPos = generateRandomPos( - width / 2, - height / 2, - (width + height) / 2 - ); - newParticle.pos.x = randomPos.x; - newParticle.pos.y = randomPos.y; - - newParticle.maxSpeed = random(2.0, 5.0); - newParticle.maxForce = newParticle.maxSpeed * 0.025; - newParticle.particleSize = random(3, 6); - newParticle.colorBlendRate = random(0.0025, 0.03); - - particles.push(newParticle); - } - - newParticle.startColor = lerpColor( - newParticle.startColor, - newParticle.targetColor, - newParticle.colorWeight - ); - newParticle.targetColor = newColor; - newParticle.colorWeight = 0; - - newParticle.target.x = point.x; - newParticle.target.y = point.y; - } - - if (particleIndex < particleCount) { - for (let i = particleIndex; i < particleCount; i++) { - let particle = particles[i]; - particle.kill(); - } - } -} - -window.windowResized = function() { - resizeCanvas(windowWidth, windowHeight); -} - -window.setup = function() { - // selection - let pages = ["home", "donations"]; - let selected = "home"; - pages.forEach(z => { - const buttonElement = document.getElementById(z+"-button")!; - const element = document.getElementById(z)!; - buttonElement.addEventListener("click", _ => { - if(z !== selected) { - const selectedElement = document.getElementById(selected)! - const selectedButton = document.getElementById(selected+"-button")! - selectedElement.style.display = "none"; - element.style.display = "block"; - selectedButton.className = "" - buttonElement.className = "selected"; - selected = z; - - - } - }) - }); - - // lastfm - (async () => { - const lastfm = await fetch( - "https://ws.audioscrobbler.com/2.0/?method=user.getinfo&user=yourfriendoss&api_key=8d983789c771afaeb7412ac358d4bad0&format=json" - ); - const json = await lastfm.json(); - document.getElementById("songplays")!.innerText = json.user.playcount; - })(); - - const theme = localStorage.getItem("theme"); - if (theme == "dark") { - bgColor = darkTheme; - darkMode = true; - } else { - bgColor = lightTheme; - darkMode = false; - } - document.body.setAttribute("data-theme", darkMode ? "dark" : "light"); - const canvas = createCanvas(windowWidth, windowHeight); - canvas.position(0, 0); - canvas.style("zIndex", "-1"); - background(bgColor); - const p = "sad.ovh" - nextWord(p); - - let ticks = 0; - - setInterval(() => { - const a = particles.filter(z => { - const x = Math.abs(Math.floor(z.vel.x)) - const y = Math.abs(Math.floor(z.vel.y)) - if (x == 1 || y == 1 || x == 0 || y == 0) { - return false; - } else { - return true; - } - }).length; - - if (a == 0) ticks++; - if (a != 0) ticks = 0; - - if (ticks == 60 * 8) { - ticks = 0; - nextWord(p) - } - }, 1) -} -window.keyPressed = function (a) { - if(!a) return; - const event = a as KeyboardEvent; - if (event.code == "Space") { - if (darkMode) { - bgColor = lightTheme; - } else { - bgColor = darkTheme; - } - darkMode = !darkMode; - document.body.setAttribute("data-theme", darkMode ? "dark" : "light"); - localStorage.setItem("theme", darkMode ? "dark" : "light"); - } -} -window.draw = function () { - fill(bgColor); - noStroke(); - rect(0, 0, width * 2, height * 2); - - for (let x = particles.length - 1; x > -1; x--) { - let particle = particles[x]; - particle.move(); - particle.draw(); - - if (particle.isKilled) { - if ( - particle.pos.x < 0 || - particle.pos.x > width || - particle.pos.y < 0 || - particle.pos.y > height - ) { - particles.splice(x, 1); - } - } - } -} - -window.mouseDragged = function () { - if (mouseButton == LEFT) { - for (const particle of particles) { - if (dist(particle.pos.x, particle.pos.y, mouseX, mouseY) < 50) { - particle.kill(); - } - } - } -} \ No newline at end of file