from Hacker News

Show HN: Three.js mirror cube that stays in sync

by mackopes on 8/2/24, 9:19 AM with 11 comments

Hello HN,

Mirror Cube is a Three.js based 3D model of a Rubiks cube variant. It keeps unscrambling itself doing random moves, but the moves are (ehm.. should be) synced across all devices.

I built this over one week and I thought you might find it interesting.

Let me know what you think and if you find any bugs!

Martin

  • by genezeta on 8/2/24, 9:49 AM

    It's nice, pretty. Maybe the background is not the best to appreciate the mirror-ness of the cube. I mean, you can see the reflections but there's not much to notice other than the pink and white lines.

    It doesn't work on Firefox (128.0.3 on Win10), though. I only get a black screen with the countdown and the info button. There are no hard errors on the console but there are various warnings. In particular there are some warnings about not being able to reconstruct an HDR from hdri1.jpg ("Gain map metadata not found in the file, HDRJPGLoader will render the SDR jpeg") and about some image being too large for a texture ("WebGL warning: texImage: Requested size at this level is unsupported.") or buffers exceeding maximum size ("renderbufferStorage(Multisample)?: Width or height exceeds maximum renderbuffer size."). And from there on a lot of warnings about "drawElementsInstanced: Framebuffer not complete. (status: 0x8cd6) COLOR_ATTACHMENT0: Attachment has no width or height."

  • by AliMammadli on 8/3/24, 8:33 AM

    Nice work! It's hard to make project optimal when working with mirror in Three.js. I use it in my workout demo project that there is big mirror in the gym.

    https://workoutme.netlify.app

  • by dole on 8/6/24, 8:07 PM

    I like the music, Burial - Archangel vibes from one track. Have it play the next song after it plays the first otherwise it just goes silent, unless it's intentional.

  • by hollowcrown on 8/7/24, 3:37 AM

    Really cool! Love your solution for achieving synchronisation, so nice to have the site open on both laptop and phone and see the same movements on both devices.

  • by shove on 8/2/24, 9:09 PM

    I have one of these :)