Document

README.md

@@ -5,43 +5,41 @@ The shape has a total of 14 sides, 8 hexagonal, and 6 square.
 
 It is a simpler version of the [Dayan gem IV](https://twistypuzzles.com/cgi-bin/puzzle.cgi?pkey=2811) which includes 3 cuts per axis, which allows the hexgaonal faces to turn. 
 
-
-# TODO
-
-## Port to Rust + WASM
-The plan is to keep the webgl api calls in JS, but use rust -> wasm to handle vertex positions.
-The goal is to generate correct piece geometries.
-Optimizing render latency will be followup work.
-We're gonna port everything to wasm. Passing datastructures between js and wasm, is confusing to setup and is pure overhead.
-Need to decide if I want to move pieces around algebraically or purely through floating point matrices.
-If I want to have any kind of solve detection, I'm going to need to store and algebraic representation in addition to the coordinate space representation. But I will punt for now.
-
-- [x] camera
-- [ ] 4 squares with tiny border between them
-- [ ] 3d cube
-- [ ] puzzle actions
-- [ ] puzzle action animation
-- [ ] action buffer
-
-
-## Old todo list
-- [x] Tag pieces with their axis of rotation
-- [x] draw half the puzzle
-- [x] draw arrays in two passes
-- [x] animate
-- [x] rotate camera and puzzle at independent speeds
-- [x] permute positions instead of colors
-- [x] filter pieces based on their type and normal axis
-- [x] rotate any octant
-- [x] Temporiality disable animation
-- [x] reimplement rotation animation
-- [ ] double check normals by deriving piece geometry from normals
-- [ ] reimplement action buffer
-- [ ] implement inverse rotations
-- [ ] Restore hexagonal cross sections for rotations
+## Hot Keys
+The hotkeys are designed around the QWERTY keyboard layout. 
+The left hand controls the camera, and the right hand twists the puzzle.
+
+The camera uses WASD controls:
+
+`w`: tilt up
+`s`: tilt down 
+`a`: tilt left
+`d`: tilt right
+`q`: rotate left
+`e`: rotate right
+
+Twisting the puzzle is done via HJKL:
+There are 4 axes of rotation possible.
+`h`: Twist about the first octant 120 degrees
+`j`: Twist about the second octant 120 degrees
+`k`: Twist about the third octant 120 degrees
+`l`: Twist about the fourth octant 120 degrees
+
+Inverse twists are provided for convenience. These are located directly above the previous key row
+`y`: Inverse of h
+`u`: Inverse of j
+`i`: Inverse of k
+`o`: Inverse of l
+
+
+## Future Ideas
+- [ ] Use an action Buffer 
+- [ ] Use hexagonal cross sections for rotations
 - [ ] outlines or gaps between pieces
 - [ ] hot key to reset the camera to default orientation
 - [ ] lighting
 - [ ] less harsh background
 - [ ] Upgrade to Webgl2: https://webgl2fundamentals.org/webgl/lessons/webgl1-to-webgl2.html
-
+- [ ] Use an algebraic representation of puzzle state
+- [ ] Solve detection
+- [ ] support alternate puzzles

src/webgl.rs

@@ -392,11 +392,11 @@ impl Piece {
 
 #[derive(Debug)]
 struct State {
-  pieces: Vec<Piece>,
   camera_transform: Mat4,
   camera_axis: Vec3,
   frame: f32,
   then: f32,
+  pieces: Vec<Piece>,
   active_twist: Option<Twist>,
 }
 
@@ -625,8 +625,6 @@ impl State {
             let mut mesh = Mesh { data };
             let angle = ((2. * PI) / 3.) * (self.frame / ANIMATION_DURATION);
             mesh.transform(&twist.to_matrix(angle));
-          } else {
-            console_log(false);
           }
           offset += facet.mesh.len();
         }