Author Topic: Animated Backgrounds?  (Read 78189 times)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Animated Backgrounds?
« on: December 12, 2018, 08:00:00 pm »
Patrice,

There's a site called ShaderToy.com that features heaps of raytraced shaders many of which may be used as animated backgrounds in ObjReader.

Some of the shaders are very heavy but some others are very light consuming not more than 8 or 10% GPU on our video cards full screen.

I can make many of them rendered animated in the ObjReader background in place of its current static wallpapers. With time, we can even add a (Scintilla-based) shader editor to OR to be able to edit, recompile, and run in real time our own GLSL shaders, pretty much like ShaderToy does. 8)

See a few examples in the attached zip.

What would you say to that? :D
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #1 on: December 12, 2018, 08:56:18 pm »
Quote
What would you say to that?
Indeed, i think that we could already play any of my visual plugins in the backround (altogether with an audio track), but the ultimate effect would be also to play a video loop as long as we can create a transparent background.

Same concept that the one used there (or in MBox64)
http://www.objreader.com/index.php?topic=19.0

I do have already several wmv video loop that we could use for background (see the attached examples).
Note: they are intended to be played in loop mode

Patrice
(Always working with the latest Windows version available...)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #2 on: December 12, 2018, 09:08:53 pm »
And we could also sync the scene lighting with any audio track, with both intensity and speed rotation.  8)
Patrice
(Always working with the latest Windows version available...)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #3 on: December 12, 2018, 09:19:38 pm »
Heh, a shader is just a few lines of code and nothing more. What is a WMF file and a DLL to play it back? Megabytes of code. :)

"Small is beautiful"(c), you know... :)
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #4 on: December 13, 2018, 01:06:12 am »
I had a quick look at Shadertoy, looks very promising !!!
Patrice
(Always working with the latest Windows version available...)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #5 on: May 19, 2019, 02:02:35 pm »
I have registered to www.shadertoy.com, but i am unable to get an API key  :-[
Patrice
(Always working with the latest Windows version available...)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #6 on: May 19, 2019, 06:43:41 pm »
What would you need their API for? It is only needed to create a Shadertoy web player that could be integrated directly in your app similar to an ordinary web-browser control.

In fact, you don't need that. The pixel (a.k.a. fragment) shaders for specific user entries are available on the Shadertoy entry's respective page. Though they are designed for WebGL and customized a little further specifically for the Shadertoy API engine, they are still legible enough to be reversed to plain GLSL usable in OpenGL, and consequently, in ObjReader.

Note that Shadertoy doesn't accept models as vertex shader input. All entries share a common vertex shader that would only draw the shader output quad from VRAM to the on-screen OpenGL (actually, WebGL) viewport. It is equivalent to our common screen quad vertex shader as used now in drawing the post-processed FBO frames. All simulated 3D shapes and entities you're seeing in the Shadertoy player are being drawn exclusively in the entry's fragment shader(s) as seen on the entry page by means of ray-marching technique.

You can modify Shadertoy fragment shader code and recompile it to see the effect of your mods directly in the entry's shader code editor. Those shaders that use only one yellow tab in the code editor ("Image") are suitable for use in ObjReader in 99.5% cases with only minimal fixes to comply with OpenGL, rather than WebGL, syntax and uniform naming convention. More than one tab in the code editor means the shader is multipass and requires several FBOs to be ping-ponged in VRAM before actual on-screen output. Those aren't yet implemented in OR and, after all, such multipass raymarching shaders are wa-a-a-ay too heavy on GPU to be used for low-priority purposes such as animated wallpapers.

My friend, it is much much easier and faster for me to just implement Shadertoy code based animated backgrounds in OR myself than guide you through the GLSL language in which I am still pretty much a newbie. :)

But you can provide a great service to OR by surfing through Snadertoy's entire shader base to select those shaders that look promising from the artistic perspective as OR's animated wallpapers. (be prepared for frequent freezes of your browser as WebGL windows are still very difficult for it to render!) I can then supply you with a simple FBSL demo proggy for each of them where you will have a standalone fragment shader code file to fiddle with its parameters right on your desktop.

See the fragment shader in AG.fs. See simple FBSL BASIC code (without includes) in GLSL_AcidGalaxies.fbs to run a Shadertoy example in a user program. Press Alt+Enter to toggle the full screen mode, Esc to quit.
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #7 on: May 19, 2019, 07:05:13 pm »
Quote
My friend, it is much much easier and faster for me to just implement Shadertoy code based animated backgrounds in OR myself than guide you through the GLSL language in which I am still pretty much a newbie. :)
Ok, no problem, i shall select the shaders that look promising from the artistic perspective as OR's animated wallpapers
Patrice
(Always working with the latest Windows version available...)


Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #9 on: May 19, 2019, 08:02:47 pm »
Yes, those are cool shaders indeed!

My notes on:

1. Ocean: I'm not sure we will be able to tweak it to display veritable stars in the sky rather than those ugly bits and pieces of I don't know what...

2. Corona: The shader seems to be responsive to the music beat. I have no idea how they transform bass.dll audio multi-bandpass output data into a real-time 2D bitmap to be bound to an OpenGL ordinary texture unit to modulate the pixels being drawn at a particular point in time. So our shader is very likely to be static in what regards star brightness and size. (delete the iChannel1 input by clicking its X button to see what it might look like on our screens)

3. (Any) Terrain: those are usually much heavier than even clouds. I'm not sure we will be able to run any of our decent starship or vehicle models against such backgrounds...

4. All shaders: Shadertoy shaders usually zoom into the scene on its Z axis. It means logically our aircraft, starcraft, or car models should be turned away from us to match the direction of propagation. How we are going to make them pan right or left rather than zoom in, I do not know...
« Last Edit: May 19, 2019, 08:04:37 pm by Michael Lobko-Lobanovsky »
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #10 on: May 19, 2019, 08:44:59 pm »
It takes a little time to prepare an FBSL stub to render "texturized" (iChannel0) shaders, but once prepared, other examples will be coming faster.
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #11 on: May 19, 2019, 11:09:41 pm »
Heck, the clouds turn out to be rather heavy on the GPU and very dependent on the noise texture used in TU0. There's no way to DL the original textures from the site, and the approximate equivalent I got from the net tends to generate moire...

Still I think I may get it working soon. If not, then there are other cloud shaders by Inigo Quilez that don't need tetures for noise generation...
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #12 on: May 20, 2019, 01:59:40 am »
OK, putting Clouds aside for the time being (GPU load brought down to ~70% but moire still there), here are a couple toys to play with.

mouse -- orbit where available
Spacebar -- toggle animation
Alt+Enter -- toggle full screen
Esc -- quit app

Use Fraps to monitor the actual FPS rate. The scripts are Windows timer-powered: Pegasus at ~15 msec interval = ~60 FPS settings, Auroras at ~30 msec = ~30 FPS, Main Sequence Star at ~15 msec = ~60 FPS.

Pegasus Galaxy yields up to 100% GPU usage in full screen when at max closeups and after the screen goes black in the end. Change #define SCREEN_EFFECT 1 or 0 at the top of shader code to change the intro effect.

Auroras yields up to 75% GPU usage when in full screen.

Main Sequence Star yields only up to 25% GPU usage when in full screen.

Mouse control is a bit lousy where available but passable for test purposes. ;)

More examples will follow later.
« Last Edit: May 20, 2019, 03:16:14 am by Michael Lobko-Lobanovsky »
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)

Patrice Terrier

  • Administrator
  • *****
  • Posts: 1992
    • zapsolution
Re: Animated Backgrounds?
« Reply #13 on: May 20, 2019, 09:51:17 am »
Thank you very much!

I have updated the list.
Patrice
(Always working with the latest Windows version available...)

Michael Lobko-Lobanovsky

  • Administrator
  • *****
  • Posts: 1481
Re: Animated Backgrounds?
« Reply #14 on: May 21, 2019, 12:58:40 am »
So, I spent almost the whole afternoon and evening studying this awesome Canyon shader. It uses 4 texture units simultaneously; 3 to create and smooth out the terrain surface, and the 4th texture, to colorize the rocks.

iChannel2 hosts the same notorious noise texture that falters in my port of the clouds shader. I found an old github repo with a port of Shadertoy web control to iOS. It contains most of the texture assets from Shadertoy but unfortunately, not the offending noise texture. Instead, in hosts another one of the same size that doesn't fit in well in either the clouds or canyon shader.

The shader coefficients are all tailored for specific textures and cannot accept substitutes. Yet I managed to create a rough approximation of the missing noise texture for the canyon shader and also to fix bad tileablility of the other three ones using Photoshop. My substitute texture, alas, has no effect in the clouds shader.

Note also that Shadertoy flips textures while loading, which makes its coordinate system in the shader flipped with respect to what we have in our renderers. Shadertoy iChannels have a VFlip checkbox to "flip" their textures too, so that when ticked, the textures are actually brought back to normal while the coordinate system stays topsy-turvy.

When loaded, the ersatz noise texture I created, as well as the other textures, still differ a little from the originals (perhaps in their gammas or alpha premultiplication or something else) so that I can't produce the exact flying rocks, arches and balconies like in the original canyon shader. But still the overall result is stunning, and surprisingly, not so extra heavy as not to be usable for our purposes.

The zip contains 2 variants. Canonical mimics the original shader but without flying rocks and more moire. RollerCoaster has textures rotated 180o rather than flipped upside down and is absolutely nauseating during its first 7 or 8 minutes of watching. But it has even less moire than the original.

Demo controls are as usual except that mouse, even though nominally used, is inoperative in the shader for some obscure reason. My GPU usage is on the order of 60 to 80% full screen at a 30 msec/FPS setting. 60 FPS load the GPU up to 100%.
Mike
(3.6GHz Intel Core i5 Quad w/ 16GB RAM, nVidia GTX 1060Ti w/ 6GB VRAM, Windows 7 Ultimate Sp1)