OpenGL Coverflow


#1

hi all,

This is just a little projet inspired by the open-source CoverJuke (sourceforge.net) and rewrite with and for Juce. This is a cool initial project but write for SDL & Cie. There is 3 important rewritten classes : Context, OpenGL, Plugin.

CoverFlowContext
This is the main thread managing the animation. The class is thread safe, so you can use it without problem i think.
You can add easily a 2D background and foreground to our 3D scene by using Juce Image classe. And access to few globals parameters.
This main classe inherit of :

CoverFlowOpenGL
That is the class that manage the OpenGL work. In principle, you don’t need to have to work with, all the operations are managed by the context.

CoverFlowPlugin
This is a factory for the actual plugins (6 differents animations). Very simple way to do, not the better but work great. The previous CoverFlowOpenGL call the process() of this and the classe work with the selected strategy (plugin).

CoverFlowPluginInterface
This is just a base class from all the plugins are derivated. A simple pure virtual.

CoverFlowPluginXXX
Where XXX can be Original, Circle, Vista, XBox, Tera & Power. Each one is just few lines of code to generate specific mode of rendering.

Original (iTunes like)

Power

Tera

Vista

Circle

XBox

I’ve add for the demo :

CoverFlowComponent
This is a “bad way to write” class, just for the demonstration of the principle of 2D background & foreground generated “on the fly”. Look at that you will read some of my stupid code :? It is a spaghetti way to do the loading of textures.

In this ZIP archive you will find a Win32 version of the project that use :

coverflow.exe
A little executable of the project

coverflow.xml
Is the definition of the cover. The artist name, the title of the song, and the name of the picture in the subdirectory. One more time it’s just for the demo.

/covers/
A subdirectory that contain few covers. Don’t hesitate to test with highest quality pictures !

The main idea :

The concept is simple.

  1. I produce “on the fly” the background picture that is a gradient fill with a tile fill with opacity. The idea is to share the background between the Juce component background and the OpenGL background. You can resized the window, the background is regenerated “on the fly” to the right size. Why do that ? Because i need to “synchonize” the 2D background of the OpenGL component with the Juce component. In this case, the diagonal tiles are perfectly maintain and the illusion is correct.

  2. The OpenGL “coverflow” is draw. Note that I add a black stroke around the covers after the loading.

  3. I produce a second “on the fly” picture for the foreground. The only difference between background and foreground is the Color type. The background is RGB and the foreground is RGBA to allow transparency over the 3D scene. The mini-cover, the stars, and the text are generated “on the fly” too.

  4. I can add my Combobox and my Scrollbar in the bottom of my component. The illusion is correct.

The code of the OpenGL animation can be easily extended, there’s already some unused parameters like :

[list]
Scene Zoom
Horizontal & Vertical Move
Horizontal & Vertical Angle
The size of the reflection
The aspect ratio of the covers …[/list]
The Picking mode work (the mouse click in the z-order 3D scene) but can be enhanced too.

I hope you like that ! Maybe someone will be interrested to work on this project and make it a real “CoverFlowComponent” for Juce. I don’t have time to do that.

This is a little gift for this new year :slight_smile: If you want I can post a really cool FFT-based Vu-Meter that is really incredible.

Sorry for my poor english.,
Max

Note about the sources : Because I work now with the latest GIT version of Juce. There’s some changes on the graphics classes, so I have add a #define JUCE_GIT in the “includes.h”. If you work with the current stable release (1.50) you need to put this one to 0 (or comment the line).

[attachment=0]coverflow-src.zip[/attachment]


#2

Very cool indeed! Thanks Max, that’s great stuff!


#3

It might be my ISP or AV s/w blocking it but for some reason I can’t see any of those images (or reach some of the links :frowning: ) -

Also,
on SourceForge the www link is to: [quote]http://https://sourceforge.net/projects/coverjuke/ [/quote] spot the typo


#4

@Jule : Thanks man !

@dub : send me a pm with your email, will send you the files if you want.

Friendly,
Max


#5

Hi Max,
It looks real cool(from the images), unfortunately the exe doesn’t seem to work on my machine.My machine has Windows Xp. Do I need to have anything else installed. It display’s window, slider and the combo box but the images are not shown.


#6

Thanks for the files Max-
Yes, I get the same thing on my machine, too - I haven’t had a chance to read any documentation yet - but I see the same thing at the moment


#7

@ vishvesh & dub

I’m under XP pro here ? Strange. Is the window white or just black ? Are you sure you’ve uncompress the archive in a folder :

/coverlow/
…coverflow.exe
…coverflow.xml
…/covers/
…all the jpg image

Let me know, in all case you can recompile the source. Just a point if you use my VC8 project, just remove the zlib / libpng dependancies (I use external libs for some reasons here)

Regards,
Max


#8

I haven’t checked that I’ve got the right directory structure (I just unzipped stuff and ran it where it was) - so I started to re-build it myself and I couldn’t locate zlibd.lib (& zlib.lib?) - I found loads of refs to them, but when I looked at the sites I could only find .dlls (i.e. zlib.dll) - and the sources for these

[edit] Hmmm… that’s the directory stucture I had


#9

just go the the VC++ project properties and in the link editor / entries / remove the “zlibd.lib libpngd.lib” (in debug) and “zlib.lib libpng.lib” (in release).

Regards,
Max


#10

@dub

When you start the .exe ? Is the main part of the window black or white ? That can be a information for me :wink:

Regards,
Max


#11

The main area is White


#12

BTW (I still haven’t managed to build it, but I’ll carry on trying) BUT FYI if I change the XML’s coverflow path attrib to be the full path of the covers folder, there’s a slight pause before the exe crashes with a 0xc000005 (undef ptr?) - Hope this helps


#13

Look at :

//=============================================================================
void CoverFlowComponent::componentMovedOrResized (Component &component, bool wasMoved, bool wasResized)
{
	/* auto-called right after creation */
	if (component.getName() == T("CoverFlow") && wasResized)
	{
		/* Just delayed the first call a little
		   in order to be sure that OpenGL is initialized.
		   Because OpenGL must be initialized before the
		   createTemporaryCoverTextures() method is called.
		   Don't find another method than a "firstCall" to
		   create the OpenGL textures "on the fly".
		*/
		if (firstCall)
			startTimer (250);
		else
			startTimer (10); /* you can replace this one by delayedUpdate() if you want */
	}
}
//=============================================================================
void CoverFlowComponent::timerCallback ()
{
	stopTimer ();
	if (firstCall)
	{
		firstCall = false;
		createTemporaryCoverTextures ();
	}
	delayedUpdate ();
}
//=============================================================================

And adjust the value of the timer for the “firstCall”. This is just a bad way to wait the OpenGL initialization. On Vista, I need to delay ~500ms the first time call to createTemporaryCoverTextures (). On XP pro, no delay needed. In all case, as I have say, this Component class need to be rewrite with better methods. But the “Context/OpenGL/Plugin” are really working great !

Regards,
Max


#14

No, don’t change the xml. This is not the problem and the fullpath is generated automatically like that :

//==============================================================================
void CoverFlowComponent::createTemporaryCoverTextures ()
{
	String currentPath = File::getSpecialLocation(File::currentApplicationFile).getParentDirectory().getFullPathName();
	File xmlFile (currentPath + T("\\coverflow.xml"));
	XmlDocument doc (xmlFile);
	XmlElement *root = doc.getDocumentElement ();
	int total = 0;
	if (root)
	{
		String directory = root->getStringAttribute (T("path"));
		forEachXmlChildElementWithTagName (*root, child, T("cover"))
		{
			String image = child->getStringAttribute (T("image"));
			String filepath = currentPath + T("\\") + directory + T("\\") + image;
			Image* img = ImageFileFormat::loadFrom (File(filepath));

Regards,
Max


#15

I did extract the zip file inside a folder and maintained the folder structure. I had tried resizing it. I don’t think I waited long enough for it to load the openGlComponent. I will try it again.


#16

@ vilvesh & dub

What’s new man ? It’s OK for you about the starting problem ? Let me known.

Regards,
Max


#17

I’m just startling to take another look now (First thing I had to do to get it to build was “Omit Default Library names” Compiler option to build the app in the first place.)

Then, the next thing I get is an access violation in void CoverFlowComponent::delayedUpdate ():

g1.drawImage (item->img, (stars->getWidth()*0.2f)/2, top, stars->getWidth()*0.8f, stars->getWidth()*0.8f, 0, 0, 128, 128, false);

(I haven’t tried the stuff you suggested yesterday, yet)

EDIT:
[strike]I changed firstCall to 10x the defined values (just in case I have a slow machine) - but still “item” is NULL :frowning: [/strike]
Ah, I’d forgotten to copy the other file/folder to where the code was built… Doesn’t crash now… but also, still doesn’t work (White background, the slider changes size after a short pause, but that’s all)


#18

Hi man,

What is your OS ? your compiler too ?
Can you be more precise about the access violation ? When ? What’s the message ? … :slight_smile:

:lol: It’s because your computer don’t like my code :?

Seriously, what do you mean by “item” is NULL ? Do you see the animation with blank (white) covers or not ?

Regards,
Max


#19

A fairly ancient Dell 8250- XP Pro SP3 - (Pentium 4 2.4GHz 1.5GB)

BUT (as I tried to say at the end of the post) I realised I hadn’t copied the xml/folder structure to where the newly built code was being run – When I did that the NULL ptr crash disappeared… BUT the app still didn’t work - White background and still no images :frowning:


#20

One of my friend got the application working but said it was a little slow.