webOS devlog 5
two-in-one?? paint app and start menu!

in record time (yes, 4 hours is record time), i managed to create a basic painting app and a start menu!
carrying over my knowledge about localStorage to making the save and new functions of Paint really sped things up. that said, setting up the viewport of the canvas so that you could edit a whole screen worth of content was a bit of a headache:
i tried setting the paint window to just clip content, but that meant when it was resized from a larger to smaller then larger size again, only the content visible in the smaller size was preserved. so i had to set up a big, invisible viewport and a window so that you can scroll the viewport, and the whole beautiful art you made can be restored.

features included in Paint™:

• draw. can u believe that? can u believe u can draw in a Paint app?
• change the brush colour (i know, mindblowing)
• fill the canvas with your choice of colour
• erase (this took me wayyyy too long to figure out wth)
• make multiple paintings and save each. that’s right, u can make and save as many incomplete art panels as the average manga artist (no shade).
• view all of your paintings. each painting is saved like a clickable file on the desktop. that’s so cool, as long as you don’t refresh the page because idk how to write to ur pc storage. sue me.

start menu was very easy, probably cuz it’s so basic but i’m not really building it beyond that for now.

unfortunately for the 0.5 people that have been following along, this might be my last devlog… before my first ship! i want to account for all the progress i’ve made thus far, so i’ll be shipping the first rendition of donOS X later today for the world to enjoy (or hate on, whichever fits ur personality).

thanks for reading! like this devlog. now.

webOS devlog 4
notepad babyyy!!

update: you can now try out my website live on my project page! go on,
treat yourself…

my coding efficiency needs to be studied…. wdym 6 hours for a notepad
app… 🫩🫩🫩
anywayss, i got it done nice and clean, and now i have something
actually functional!! and the best part is, i did it 99% without AI!!

the all-new Notepad™ features:

• bold and italic formatting. now your notes look expressive. whoop whoop

• the ability to save your notes to the desktop! as long as you
  don’t refresh your tab, your cute little notes stay on the desktop, with
  your questionably long names dynamically fitting with some fancy
  flexbox formatting

• the ability to make NEW notes. that’s right, you can populate this
  poor desktop with a bajillion notes if you want, as long as bajllion
  means less than around 20. don’t push it buddy.

• soon: tails appears if you call out to him 👀👀👀

things i’ll definitely do in the next devlog:

• manage time properly (yikes)
• browser. what’s a desktop without a means to doomscroll
• a game. if i can’t code solitaire, sorry guys, pong is the best i can do
• ….tails….

ok byebye

webOS devlog 3
draggable and closable windows!!

i need to speed this up wthhh
but yeah, u read the title. we now have proper dragging windows. last time, they cursor would fly off screen if u dragged too far (it still kinda does if u shake the windows too much, but no idea how to fix that yet), but now, they, y’know. Drag
hmm what else. oh, right. i added

• desktop icons, so that you can access your favourite time-wasting apps more efficiently
• close buttons, so that you can kill your favorite time-wasting apps. sidenote on this, this took longest because the guide initially just set it up for one window, so i had to basically learn javascript myself to learn how to apply it to all windows.
• Hope.
• Tails!!!! not enough yet tho >:(

webOS devlog 2
welcome screen!!! yippee
i managed to make my welcome screen, fitting neatly inside a draggable window template which i’ll apply to other windows in the future.
this took way longer than expected again, mostly because the drag function allowed the user to drag beyond the screen boundaries, which i fixed by adding clampPosition function that ensures the window never crosses the screen’s dimensions.
i also created custom window buttons and dialog buttons, though none of them are functional just yet.
things to do:

• more Tails. duh.
• make the window buttons do stuff
• add desktop icons
• games?? 👀👀 (foreshadowing x2)

see y’all tomorrow. i’m so tired

webOS devlog 1
seven hours over 3 days for… almost nothing huh 😭😭.

i actually spent most of this time trying to decide what design style i’d use. i tried mimicking the Wii U, then the Wii, then the PS VITA, then i read the mission requirements and realized it needs to have draggable windows… sigh…. anyway, i managed to set the base desktop for my OS with a LOT of enhancements, including:

• a CRT monitor frame, complete with shadows and gradients to create the illusion of 3 dimensions
• great responsiveness to ensure the monitor maintains its aspect ratio while fitting on practically any screen
• a custom cursor within the screen to mimic the old windows XP look
• a desktop wallpaper. it really is cool enough to have its own bullet point

problems i faced? oh, boy.
first of all, i had no idea how responsiveness actually worked, so i initially set all my units in px and the layout would break horribly on any display other than mine. so i had to learn to use cqi units instead and change EVERY. SINGLE. ONE.
then i spent about an hour trying to figure out why everything was still broken and the gradients weren’t working, only to realize i hadn’t linked my .css file in the header. AAAAA

what i’m going to add

• the welcome screen (should’ve been the first thing bruh)
• draggable windows
• Tails, because… Tails
• games? 👀👀

ok see y’all tomorrow (or probably later today yayaya)

icing on the cake: stickers!!
i learnt a little bit of JavaScript today, especially focusing on mouse interactions, and i figured i’d apply it to my website. and what better way to do that than adding stickers!
i was so sure they were gonna take 15 minutes tops but nope. for some reason, the stickers initially just vanished when you tried to grab them, and i spent about an hour trying to fix it, only to realize the problem was the sticker-container being set to position: relative;. that was literally it ://
anyways, i think i’ll stop tinkering with this website for now, but i will add stickers, maybe copious amounts for all you sticker-loving maniacs. ok byebye!

to-do:

• add more tails

OmoriOS devlog #4

I hate to break it to you all, but I may have to switch to only WASD for movement… Because debugging states is HELL on earth and to spare my sanity, I decided arrow keys will be for selection ONLY instead of using it for movement as well. Does anyone actually care which is which? Ehhhh… probably not. But it’s farther from the original game now.

what else is new¿?¿?

Now the typing animation works!! YAYYAYAY ok but i legit spent 4 hours trying to make it work cuz the same instance of words kept popping up even though i told it NOT to (that was my fault i didn’t know what i was doing my code is a mess D:) Ah yeah, the clock works too, it doesn’t just say 0:00 AM.

and???

On to the sketchbook next, and then mewo, and then the box of tissues to wipe our, yes OUR, sorrows away, and then the lightbulb of eternal darkness. Will design the sketchbook layout mayyybe 2 days from now. (And no, the door will NOT work. We are stuck here forever now.)

(ignore how there’s a random floating hand, i don’t know how to get rid of it :/)

OmoriOS devlog #5

Wow i might have lied. It certainly hasn’t only been a day or two.

I know this isn’t going to seem like a lot changed since my previous dev log, but heck, I’ve fixed a LOT of bugs. And I decided it was better to fix them now instead of letting the problem marinate.

why the heck do you have so many problems???

While writing the code, I ignored a lot of naming conventions, which uh, might have caused me a bit of trouble. (lie #7 or smth I forgot that much alr) Also, since I had so many html elements, making the ones I needed visible and invisible at different times was a pain in the butt.

what bugs?

fatal:

-interacting with the laptop twice would not show anything
-exiting the laptop was impossible (since z is for exiting and interacting at the same time save me it took so long to fix it)
-conditionals would not reset after exiting (THERE WERE CONFLICTING STATEMENTS IN THE CODE I HATE LIFE)

minor inconveniences:

-two instances of the same would appear for seemingly no reason (turns out it was cuz i didn’t delete them after they became redundant)
-some elements were still on the screen after I had EXPLICITLY told them to stay away (THERE WERE MORE CONFLICTING STATEMENTS IN THE CODE!!!)

what now??????

I WILL add more interactive objects soon, I promise. I swear. I vow. And I WILL add games. I promise. I swear. I vow. Can you guys handle jumpscares?

got a question for you all

HOW THE HECK DO YOU GUYS CODE SO FAST. LIKE WDYM YOU CAN PUMP OUT THAT MANY FEATURES IN A FEW HOURS. I WAS JUST DEBUGGING AND CLEANING UP CODE FOR 9 HOURS. AM I JUST INCOMPETENT???

yeah i gotta fix the clock ik

but now you can interact with it infinitely :DD without any problems :DDDDD

day 4 of making my personal website: final commit!

today was so packed oml. i might be ready to ship this already!
there are so many changes i introduced today, including

• changing the header to a more readable “THE CAFFEINE HERALD”
• making a carousel for my artworks (day 2 me would be proud)
• adding 2 google docs embeds so that i can bless my viewers with my beautiful works of literature
• added a whole column of spotify embed widgets so that y’all can enjoy my atrocious music taste
• added a music recommendations article so that you can not only listen to, but read about my atrocious music taste
• added a projects section with, get this, actual projects!
• added images from my gallery because there was empty space lol

i’ll yap a bit about my design choices:

• the orange accent is a call back to tails, who’s basically part of me atp
• the off-white background is meant to mimic old fading newspapers
• the terminal-like font (Iosevka Charon) is meant to contrast with the old design, so the result is a fresh combo of digital and analog media.

anyways, i’m so proud of how this turned out and i can’t wait for you guys to be able to check it out. it’s all done (in only 11 hours!) and i’ll ship it later today. yayayayayay!

day 3 of making my personal website. i completely overhauled the design to match this newspaper aesthetic and i really love how it looks!! getting the columns right was def the most difficult part, but now that i got it down, i only need to add a couple of sections and i’ll be done! yay!

day third time’s a charm

i spent WAYYYY too much time on Figma (pls add hackatime to figma 😭) drafting how i want my website to look, and i think I got something i like!
i settled for a newspaper-layout style website when i realized there’s no better way to cram info onto a screen than by packing it in columns. i have so many idea planned for this, including interactive advertisements and maybe even a music widget, and i am so excited to see how it’ll turn out.
for today tho, i only managed to make a neat little header for my newspaper, which definitely took a reasonable amount of time (cough 55 minutes cough). can’t wait to make the rest tomorrow!

day two of making my personal website!

finished the about me section and moving on to the projects page… and i’m stuck again.
i tried making a carousel for my images but it no-clipped out of the page. so i tried to lock them in a container, but now the carousel doesn’t move. so i got rid of the carousel and stacked the images, and now ALL of them clip out of the container.
ended up giving up cuz it got too late, but i’ll fix it tomorrow promise 🙏
i’ve also finally decided that i’ll completely change the design of my website, and i got the perfect idea while reading a newspaper (subtle foreshadowing?? 👀👀👀)
see y’all tomorrow :DD

and so it begins…

day 1 of making my personal website and i am… so lost.
i have not done html/css in quite a while, but i was way rustier than i expected and i spent WAY too long trying to figure out how to organize and format divs. (why does align-items:center; not always, you know, align items in the center??)
i’m not too sure about where i’m going with the design, but it doesn’t look too bad honestly.
by far my proudest achievement was figuring out how to make the bullet point lists all by myself. even if it’s like, what, 2 lines of code, i love how it looks and that it’s not AI.
to-do:

• design the projects page (doesn’t exist rn)
• add more stuff to my home page
• add more tails (most important)