Folding rectangles to form a cube using three.js

Question

I am trying to make a cube with given 6 faces lying on the surface as a cube net with one face movable. Something like this:

In the above picture, there are

Answer 1

You can use hierarchy of objects.

var obj1 = new THREE.Mesh(...);
var obj2 = new THREE.Mesh(...);
obj1.add(obj2);

There's a good example of it.

So, using this principle, I made animation for folding the cube, given in your question. Of course, this is not the ultimate solution, this is just a starting point.

jsfiddle example

upd: I've updated the fiddle. You can start folding by clicking the PressMe button. Animation made with Tween.js (see the foldTheCube() function)