https://github.com/alvarosabu/viteconf-pyraminx
Repo for the collaboration between StackBlitz and Tres.js for Viteconf 2024
https://github.com/alvarosabu/viteconf-pyraminx
3d puzzle pyraminx three tresjs vite vitejs
Last synced: 7 months ago
JSON representation
Repo for the collaboration between StackBlitz and Tres.js for Viteconf 2024
- Host: GitHub
- URL: https://github.com/alvarosabu/viteconf-pyraminx
- Owner: alvarosabu
- License: mit
- Created: 2024-06-01T07:54:33.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-08-28T12:38:11.000Z (about 1 year ago)
- Last Synced: 2025-03-15T13:44:13.638Z (7 months ago)
- Topics: 3d, puzzle, pyraminx, three, tresjs, vite, vitejs
- Language: TypeScript
- Homepage: https://viteconf.org/
- Size: 23.7 MB
- Stars: 21
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README

# Viteconf Pyraminx
> Collaboration between [StackBlitz](https://stackblitz.com/) and [Tres.js](https://tresjs.org) for [Viteconf 2024](https://viteconf.org/)
Are you ready to solve the puzzle? △ 😎

## Steps
1. Go to [Viteconf Landing](https://viteconf.org/)
2. Below the 3D Pyraminx, click on the "Code!" button.
3. Check the instructions on the `solve.js` file.
4. You can check the 3D components on `Pyramind.vue` and `Scene.vue` file.
5. Have fun and good luck!## Solve the puzzle
```javascript
/* Can you do better than a random solver?pyramid.
colors -> { face: { position: Color }}
getColor(face, position) -> Color
getFromColor(section, cw, face, position) -> Color
getFromFacePosition(section, cw, face, position) -> [face, position]
doMove(section, cw)Or solve it manually!
Press L, B, R, U (and shift for l, b, r, u)
Or the more ergonomic WASD (same as LBRU)Auto-rotation is distracting? Disable it at Scene.vue
And play with the colors at Pyramid.vue!
*/
const positions = {
// CENTER VERTICES EDGES
LRB: [ 'L', 'R', 'B', 'Ll', 'Rr', 'Bb', 'LR', 'RB', 'BL' ],
BUL: [ 'B', 'U', 'L', 'Bb', 'Uu', 'Ll', 'BU', 'UL', 'LB' ],
ULR: [ 'U', 'L', 'R', 'Uu', 'Ll', 'Rr', 'UL', 'LR', 'RU' ],
RBU: [ 'R', 'B', 'U', 'Rr', 'Bb', 'Uu', 'RB', 'BU', 'UR' ],
};
const faces = [ 'LRB', 'BUL', 'ULR', 'RBU' ];
const colors = [ 'yellow', 'blue', 'green', 'purple' ];
const moves = [ 'U', 'u', 'L', 'l', 'R', 'r', 'B', 'b' ];let nextMoves = [...moves];
export function solve(pyramid) {
const fromLlColor = pyramid.getFromColor('r', true, 'LRB', 'Rr')
if (pyramid.colors['LRB']['R'] === fromLlColor) {
// Should we do a r move?
}
// Let's try a random move instead!
const randomMove = Math.floor(Math.random() * nextMoves.length);
const section = nextMoves.splice(randomMove, 1)[0];
if (nextMoves.length === 0) {
nextMoves = [...moves];
}
const clockwise = Math.random() > 0.5;
pyramid.doMove(section, clockwise)
}
```## Install
```bash
pnpm install
```## Run
```bash
pnpm dev
```## Build
```bash
pnpm build
```## License
MIT © [StackBlitz](https://stackblitz.com/) and [Tres.js](https://tresjs.org). Check the [LICENSE](./LICENSE) file for more information.