How do I place images on a rotating divided cube using Java?

[jeffphotos]

Hello- I am creating a puzzle that is like the "Rubik's Cube,"
although this puzzle is played on the computer monitor, and the puzzle
involves images placed on the sides of a cube. The mouse is used to
rotate the sides of the cube. Each side of the cube is divided into
three sections.

The code for the basic puzzle has been written by another person. The
link to the puzzle created by this person (including links to the
program files or source files) may be found at:

http://www.geocities.com/jaapsch/puzzles/cubie.htm

My goal is to create a puzzle (using Jaap's code or script) whereby I
will be able to place one of my photographs on each side of the puzzle
cube (6 different photos per cube). The goal is to rotate the sides so
that the photos are put together correctly.

I have been in contact via email with the puzzle's author, Jaap
Scherphuis, and he emailed me that I can use his puzzle's code or
script (whichever it is), and place my photos in the puzzle. In return,
Jaap would like to get the code or script that is created. When I spoke
with Jaap by email several months ago he told me he was too busy to
help me at that time.

So, I am looking for a person to help me create a situation whereby I
will be able to include my photographs on the sides of the puzzle with
the images divided on each side and rotatable.

I am interested in learning how to write the code (or script) myself so
I am able to include different photos.

Please let me know if you might offer any assistance.

Thank you,
Jeff Klamer
www.jeffklamerdesign.com

p.s. Please see my photo galleries to enjoy some of the
images I am working with.

[cms271828]

It sounds interesting, I have not done anything in 3D, but I have some experience with images.
For my chess program, I didn't want to have to load images in, I was getting lots of problems trying to load images inside a jar into the program, so what I did was scan the images to get the colours of each pixel (in ARGB), store this data in arrays inside classes. Then create BufferedImages using this new data. So when you run the jar on desktop, or the applet version of jar on internet, it just builds the images of the chess pieces after loading.
Anyway, I think that is best just for small images, but maybe of use to you. You will need to stretch/scew the images when you rotate the cube (don't know if java 3D package deals with this ?)
I'll take a look at the code anyway, let me know how you plan to deal with the images if you want.

I've just ran the program, its cool, but I think rubiks cubes are infuriating difficult unless you are very smart. Anyway I'm gonna put the code in my IDE, and see if I can get an image on one of the faces, I'll let you know how I get on.

Thanks
Colin

[jeffphotos]

Hi Colin-thank you for your response. It would be best if when a section is rotated, the image is not skewed or does not become stretched if that is what you mean by "skewed," if it is possible to create that situation. I can pay a modest amount to do this; I am a student so I don't have much, but I would pay for the creation of this kind of puzzle. I have found another cube puzzle with rotating sections and a photo placed on each side, but the center section (there being, I believe, three sections per side) did not rotate. I am trying to create a puzzle with all three sections of a side being rotatable, if possible.

Please let me know how things are going. Thank you for your interest.

Jeff

[cms271828]

What I mean is... when you are looking at a face square on, the center cubes face would appear sqaure, but as you move it arround, it becomes diamond shaped, so any image on the face would have to fit into that diamond.
I've taken a look at his code, he hasn't used the java3D packages, but has built the mathematics himself for the rotations, and it is a stunning piece of code. I especially like how the colors get brighter when they are near to the front.
I'm not sure how you would do this yet, without the java3D. I tried installing it into netbeans, but I couldn't get it working, theres a lot too it, and I don't think many people have these packages installed either.
One difficulty is, if you have a cube that is fully rotational in all three axis, you have many different views of the same image, I'm not quite sure quite how many, in the hundreds, maybe thousands.
In theory, I could generate each of these images (eg a perfect square, then lots of diamond shaped ones) given one image, then when rotating it would be extremely quick to repaint.
If you were to have a smily face or something like that drawn on the squares, it would be different, you could just apply mathematics to recalculate the coordinates.
Its not an easy job at all, but I'll think about it, let me know more about the images you want to use, and what you think of my ideas.

[cms271828]

I've just found out you can rotate images, I've got a JFrame here with an image spinning round!
Its not distorting the image, but it is rotating it, so its a step closer.
I'll keep you posted

[cms271828]

I've worked out how to do it!
In the Graphics2D class, there is a shear() method, as well as rotate(), and setTransform(), and transform().
Once you have applied shear to the Graphics2D object, then whenever you draw an image, it will be sheared, but we want different images to be sheared differently, so we need to keep changing this.
I think using transforms is better, I'm just reading into it now, but it might be tricky applying it to Jaaps' code since it will take me a while to figure it out, but I'm sure this is the way forward, I didn't think you could do this stuff with images, but seems you can after all.
See you in a bit!

[cms271828]

Hi, I've got a lot further now, I've managed to construct a cube with the same image on all sides.
I've built a method takes in 3 points on the original image (a,b),(c,d),(e,f) (These should be 3 of the corners, but could use any 3 points), it also takes in the mappings of these points that you want the new image to have (aa,bb),(cc,dd),(ee,ff) and the method then returns an AffineTransform.

In the paintComponent(Graphics g) method, simply apply the transform to the g2 object, then draw the image, and the 3 corners of this parallelogram will be at the points specified.

Here is the method I wrote:

public static AffineTransform getAffineTransform(
double  a,double  b,double  c,double  d,double  e,double  f,
double aa,double bb,double cc,double dd,double ee,double ff)
{
double n1=b*(cc-ee)-d*(aa-ee)+f*(aa-cc);
double n2=b*(dd-ff)-d*(bb-ff)+f*(bb-dd);
double d1=a*(d-f)-b*(c-e)+c*f-d*e;


return new AffineTransform(
-n1/d1,
-n2/d1,
n1*(c-e)/(d1*(d-f))+(cc-ee)/(d-f),
n2*(c-e)/(d1*(d-f))+(dd-ff)/(d-f),
-n1*(c*f-d*e)/(d1*(d-f))-f*(cc-ee)/(d-f)+ee,
-n2*(c*f-d*e)/(d1*(d-f))-f*(dd-ff)/(d-f)+ff);
}

Since all the 3D stuff is dealt with, I think think the new coordinates for the faces of the small cubes are in the program, so its just a matter of putting it in now. I'll give it a go with just 1 face for now.

[cms271828]

Ok mate, I've done it!
My little method worked well.
You need to send me your images now for me to put in.
Ideally, best if we chat on messenger, I'm on yahoo and msn.
My yahoo is cms271828, my msn is... [e-mail].
Get back to me when you can, thx.