diff --git a/index.html b/index.html new file mode 100644 index 0000000..c5dd5e9 --- /dev/null +++ b/index.html @@ -0,0 +1,433 @@ + + + + + + + + + + + + The Easiest Method for Beginners + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
The +Easiest(*) +Method for Beginners
+ (*) Or maybe the worst...
+

+It's +perfectly possible to solve a Rubik's Cube using common intuition and +simple rules.
+Usually, people can solve one layer by themselves. If you can do it, +you +(almost) can solve the whole cube.
+
+No mysterious magical sequences required. If you understand how it +works, you'll remember it forever.
+No need to learn any notation, the animated cubes will show you the +basic moves you need.
+No mathematical formulae (group theory principles explained here), I'll try +to make it intuitive.
+
+This page is not about efficient solving.
+
+If you think this page is not very helpful, you should take a look at Jasmine's +beginner page where a more conventional approach is proposed.
+
+
Solving the first layer

+It +seems that everybody can do it using common intuition. It can take some +time if it's your first try.
+You cube should now look like this:
+

+ + +
+
+
+
Manipulating the first layer

+You +just built a layer starting from a random state. So, you should not +have +any problem making transformations of this layer.
+Look at the following basic moves. You can do them differently, it +doesn't matter.
+
+ + + + + + + + + + + +

+Rotate a corner
+

+Rotate an edge

+Swap two corners

+Swap two edges
+
+Do you have problems understanding them? Don't go to the next section +before you can master these easy moves (or the ones you found) allowing +you to change pieces of the first layer easily.
+
+
Rearranging the first layer without +disturbing the others

+Once +a first layer is solved, freedom of movement is reduced, and people +can't +see what they can do without destroying it. You have to find a way of +moving only selected cubies, preserving the +state of others (local transformation).
+
+Take the first basic move that rotates a corner for example. What's +the problem with it? It destroys the two lower layers of course. Do it +backwards, the cube is restored.
+
+ + + + + + + +

+Doing a move

+Undoing a move
+
+But what happened at the end of the move? Think of it this way:
+- Pieces of the first layer have been rearranged.
+- Pieces of the two lower layers have been rearranged.
+- Pieces of the first layer and pieces of the two lower layers are +still separated.
+- Undoing the move will independently restore the state of the first +layer and the state of the two lower layers.
+
+And now, the cornerstone of this method. Try this:
+ - Do a move that rearranges +pieces of the first layer. Call it X.
+ - Move the first layer. Call it +Y.
+ - Undo X. Call it X'.
+ - Undo Y (only a +matter of  readjusting the first layer). Call it Y'.
+
+Since the two lower layers and their chaos have not been changed by Y, +X' can still restore them to their original state!
+But the first layer has moved, it won't be restored with X'. The +backward transformation will be applied to a different part of it.
+
+We have reached our goal: Making (local) transformations in a layer, +without disturbing the others.
+
+ + + + + + + +
Example:
+- X is a clockwise corner rotation move.
+- Y is a clockwise turn of the first layer.
+- X' is a counter-clockwise corner rotation move.
+- Y' is a counter-clockwise turn.
+Result: Two corners in the first layer have been rotated (different +directions).

+
+
+Thanks to the four basic moves, we can build four interesting local +transformations of the first layer.
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Basic move (X)
+
Result of the commutator (X.Y.X'.Y')
+
Example
+
Rotate +a cornerRotate +two corners
+
Rotate +an edgeRotate +two edges
+
Swap +two cornersSwap +three corners
+
Swap +two edgesSwap +three edges
+
+
+
Changing pieces belonging to different +layers

+The +pieces on which a local transformation must be applied do not +always belong to the same layer. You'll have to bring them to a same +layer first with a positioning move:
+- Make interesting pieces belong to the first layer. Call it P.
+- X.Y.X'.Y'.
+- Undo the positioning move. Call it P'.
+
+ + + + + + + +
Example: Permutation of +three +edges.
+- Move the front side and then the right side to bring edges to +up-front and up-right (P).
+- Apply the three-edge swapping technique (based on X.Y.X'.Y').
+- Move the right side and then the front side back to their original +positions (P').

+
+
+That's all you need to solve the 3x3x3 cube.
+
+
Solving example on a random cube
+
+ + + + + + + +
Let's solve a cube +completely.
+I don't detail how the first layer is built, you can do it, even if it +takes more moves.
+
+One by one, the edges of the second layer are positioned, using +exclusively sequences that swap three edges. Red-green edge is easy, +because in the same layer, you can find its destination and another +free edge position. +Same thing for red-blue and green-orange. It's more difficult for the +blue-orange edge. A positioning move brings blue-orange, it's +destination position, and another free position to the same layer. This +move is undone at the end of the sequence.
+
+Now, the last layer. You'll notice that only the blue-white-red corner +is at a correct place, the three others must be swapped. Then, three +edges are swapped, because the white-red edge only is where it needs to +be. Finally, we have to fix the orientations.
+
 
+

+
+
+
Improvements
+

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
Working with slices
+

+All the examples above were based on working with a side of the cube. +You can apply the same rules to inner slices as well.
+X must be a move that rearranges pieces of a slice, and Y a move of +this slice.
+
+ + + + + + + +
Example: Permutation of +three edges in a slice.
+- Swap up-front and up-back edges (X).
+- Move center slice (Y).
+- Swap up-front and up-back edges again (X'=X).
+- Move center slice back (Y').
+

+
+
+
Different kinds of pieces
+

+ + + + + + + +
For now, we've +only worked with corners or edges, but never both kinds of pieces at +the same moment. Why not? It's exactly the same principle. On the +example, two corner-edge blocks are removed from the first layer and +swapped.
+

+
+
+
More interesting commutators
+

+In order to make things clear for beginners, I described a technique +based on changing things in a single layer. But commutators can be much +more powerful.
+Try to see how and why they work. Hint: The Y move doesn't compromise +any pieces but the ones we need to move.
+
+ + + + + + + +

+Swap three corners
+

+Swap three edges
+
+
+
Same +random cube, but optimized solving
+ + + + + + + +
Now we'll make +use of some improvements.
+
+Green-orange and green-red edges can be solved simulaneously with a +commutator based on a slice, after an easy positioning.
+Then I decided to swap three corners in an efficient way.
+Two edges again: Green-white and blue-orange.
+Then, the three last edges at a wrong place are moved.
+In the end, two misoriented edges are fixed.
+
+Once the first layered is completed, everything is based on an +identical strategy: P.X.Y.X'.Y'.P'.
+
 
+

+
+
+
+
+
+
Return to +home
+
+ + \ No newline at end of file diff --git a/kb.js b/kb.js new file mode 100644 index 0000000..5479a49 --- /dev/null +++ b/kb.js @@ -0,0 +1,25 @@ +/* +This script is a workaround for cheerpj to prevent the mobile keyboard from +popping up while rotating a cube. + n = # input fields on page + i = interval in milliseconds + m = max times to run +*/ +var kbInp, kbInt, kbMax, kbCount; +var kbInput = document.getElementsByTagName('input'); +function kb(n, i, m) { + kbInp = n + 1; + kbInt = i; + kbMax = m; + kbCount = 0; + kb2(); +} +function kb2() { + for (var i=0; i < kbInput.length; i++) + if (!kbInput[i].readOnly) + kbInput[i].readOnly = true; + if (i < kbInp && kbCount++ < kbMax) + setTimeout(kb2, kbInt); + else + console.log('kb done'); +} diff --git a/rtwr.js b/rtwr.js new file mode 100644 index 0000000..d712e4c --- /dev/null +++ b/rtwr.js @@ -0,0 +1,109 @@ +/* +Note: This version is for Werner Randelshofer's cube simulator. + +This script is a workaround for cheerpj to extend rotation outside of the +cube area (for desktop browsers). + +Parameters for the rt function: + n = number of canvases on page + i = interval in milliseconds + m = max times to run + +The following shows the number of canvases for some common display types: + +Canvases Display Type +-------- ------------ + 4 cube only + 9 with buttonbar + 10 with buttonbar and move sequence text + +For pages with many cubes, a count of canvases can be obtained by doing +the following: + +1. Include rtwr.js on the page but do not call the rt function: + + +2. Add this code to the page: + + + +3. In the browser, press F12 to view the console and reload the page. + After the last cube is displayed press the Go button to show the number + of canvases (in the console). Press Go again after a few seconds to make + sure the load has completed (count remains same). +*/ +var rtCanvTot, rtInt, rtMax, rtCount, rtCanvIx, rtCube, rtMouseDown; +var rtApp = document.getElementsByTagName('object'); +var rtCanv = document.getElementsByTagName('canvas'); +var rtText = document.getElementsByTagName('textarea'); +function rt(n, i, m) { + rtCanvTot = n; + rtInt = i; + rtMax = m; + rtCount = 0; + rt2(); +} +function rt2() { + if (rtCanv.length == rtCanvTot) + rt3(); + else if (rtCount++ < rtMax) + setTimeout(rt2, rtInt); +} +function rt3() { + for (var i=0, ix=0; i < rtApp.length; i++) { + var n = rtApp[i].getElementsByTagName('canvas').length; + var ix2 = ix + n - 1; + rtCanv[ix2].ix = ix2; + rtCanv[ix2].cube = i; + rtCanv[ix2].addEventListener('mousedown', mousedown); + rtCanv[ix2].addEventListener('mouseup', mouseup); + rtCanv[ix2].addEventListener('contextmenu', contextmenu); + ix += n; + } + document.addEventListener('mouseup', mouseup); + document.addEventListener('pointermove', pointermove); + console.log('rt done'); +} +function mousedown(e) { + rtCanvIx = e.target.ix; + rtCube = rtCanv[rtCanvIx].cube; + rtMouseDown = true; + pointerEventsOtherApps('none'); + if (e.button == 2) + parent.document.addEventListener('contextmenu', contextmenu); +} +function mouseup(e) { + if (rtMouseDown) { + rtMouseDown = false; + pointerEventsOtherApps('auto'); + } + if (e.button == 2) + setTimeout(removeParentListener, 100); +} +function contextmenu(e) { + e.preventDefault(); +} +function pointermove(e) { + if (rtMouseDown) { + var evt = document.createEvent('HTMLEvents'); + evt.initEvent('mousemove', true, false); + evt.buttons = e.buttons; + evt.clientX = e.clientX; + evt.clientY = e.clientY; + rtCanv[rtCanvIx].dispatchEvent(evt); + } +} +function pointerEventsOtherApps(s) { + for (var i=0; i < rtApp.length; i++) { + if (i != rtCube) { + rtApp[i].style.pointerEvents = s; + rtApp[i].children[2].style.pointerEvents = s; + rtText[i].style.pointerEvents = s; + } + } + // also do textarea for current app + rtText[rtCube].style.pointerEvents = s; +} +function removeParentListener() { + parent.document.removeEventListener('contextmenu', contextmenu); +} diff --git a/rubikplayer.zip b/rubikplayer.zip new file mode 100644 index 0000000..a3efcfa Binary files /dev/null and b/rubikplayer.zip differ