←back to thread

513 points ayaros | 8 comments | | HN request time: 0.415s | source | bottom

https://lisagui.com/info.html

This is a web OS I wrote in vanilla JS that looks like the Apple Lisa Office System (1983-85), with other contemporaneous influences and additional improvements and features. It's currently in alpha and isn't remotely bug free. I had been holding off on posting this here until it was somewhat presentable and useful. Please note; the Lisa conforms more literally to the desktop metaphor than most modern GUIs - some of the important differences are mentioned in the readme.

This is a complete recreation of the UI in JS; it all renders to a single canvas element. It's not a CSS theme, and not an emulator ported to JS. None of the code is written by Apple. I'll be happy to elaborate more in the comments, but the short version is the entire UI is defined outside the DOM using JS objects. Thus, every interface element - menus, windows, controls, and even typefaces - was recreated from scratch. There are no font files - I wrote my own typesetting system, which supports combining multiple text styles and generates new glyph variants on the fly.

Many of the technical decisions I made were motivated by a desire to have this look the same in every browser. That's harder to do with the DOM and CSS, and why I moved as much logic as I could to JS. Also, the only part of the project outside of vanilla JS and standard web APIs is the Gulp toolkit, which I'm using as a minification/build tool. No vibe coding was used to make this!

This is based on a UI from the 80s, and won't work well on your phone. If you insist on running it that way, turn on trackpad mode in the touchscreen settings panel of the preferences app. For best results, install it as a PWA (add it to your home screen). Also there are some odd Android bugs; the native touchscreen keyboard is currently broken, and there's an issue with the cursor when dragging windows.

I realize there's not a whole lot to do within LisaGUI right now; I've got a big list of additional features and apps I'll be adding in the future. I've been working on this project for a while, and I'm eager to hear people's feedback and answer questions about it.

1. Cieric ◴[] No.44484223[source]
This is pretty cool and it's surprising how well it works on mobile. I think the shuffle puzzle game has a bug where it can generate unsolvable puzzles. I ran into a parity issue. I solved it with the blank in the upper left but got no response from the game so I don't believe that was the intended solution.

Also checked with an online solver and it verified that there was no solution.

replies(1): >>44484441 #
2. ayaros ◴[] No.44484441[source]
I haven't gone as far as verifying puzzles are solvable - right now I only verify the state of the puzzle is valid. Maybe in the future. For now I guess it will be like solitaire, where if you can't solve it you'll have to reshuffle it.

Incidentally, I'm planning on adding solitaire as the next game!

replies(4): >>44484560 #>>44484726 #>>44484947 #>>44486808 #
3. Shorel ◴[] No.44484560[source]
I remember making that puzzle in C++.

Half of the random states created are solvable, and the other half are unsolvable.

My solution was not checking if the puzzle is solvable (the mathematics of this seem complicated), but starting with a solved one and then do a fixed number of random movements.

replies(1): >>44484675 #
4. ayaros ◴[] No.44484675{3}[source]
That's a good idea.
5. Cieric ◴[] No.44484726[source]
Oh nice. I don't actually know how to play solitaire, but I know Microsoft used the method of randomly generating them, solving them and then saving solvable seeds. (I believe they had 2 that weren't solvable somehow though so maybe it was a human solving them and it was a typo or mistake)

Also, I was just checking around to see if there were any good methods for telling if a puzzle is solvable without solving it. Seems geeks for geeks have some code for it.

https://www.geeksforgeeks.org/dsa/check-instance-15-puzzle-s... The only other solution I can think of is detecting both configurations (blank in bottom right or top left) and displaying something when either is reached.

6. BubbleRings ◴[] No.44484947[source]
Great work, great memories on the Lisa.

But sheesh! The first time I play the numbers puzzle on a computer in my life, and the first time in 30 years that I play it at all, and I find out some joker has snapped two of the pieces out and reversed them, making it unsolvable?! Diabolical!

7. pedroslopez ◴[] No.44486808[source]
I spent so long fiddling with the puzzle game, trying to get a final 2 tiles swapped, just to find it was unsolvable sigh

Cool stuff though!

replies(1): >>44487858 #
8. jcheng ◴[] No.44487858{3}[source]
Same here, I spent forever on it :(