motion-canvas / motion-canvas

Visualize Your Ideas With Code

Home Page:https://motioncanvas.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

DestinationUV uniform doesn't scale with scene on render

HikariIsChillin opened this issue · comments

Describe the bug
If a shader uses destinationUV and you try to render it in a scale different from 1.0x, the uniform doesn't scale with the scene

To Reproduce
Just add a shader that uses destinationUV to anything and render with a different scale, this is the simplest example:

import { makeScene2D } from '@motion-canvas/2d'

import destinationUVbug from '../shaders/destinationUVbug.glsl'

export default makeScene2D(function* (view) {
	view.shaders(destinationUVbug)
})
// destinationUVbug.glsl
#version 300 es
precision highp float;

#include "@motion-canvas/core/shaders/common.glsl"

void main() {
    outColor = vec4(floor(destinationUV * 10.) / 10., 0., 1.);
}

Expected behavior
The UV should scale with the render

Package versions:
Click on the version in the bottom right corner to copy the versions

  • core: ^3.15.1
  • ui: ^3.15.1

Same frame rendered in 0.25x, 0.5x, 1.0x and 2.0x scale:
004639_0 25x
004639_0 5x
004639_1 0x
004639_2 0x

Can you take a look at #1026 to see if it fixes the issue completly?

From my tests it fixed everything except inside of cached nodes.

If you use the same shader as before but like this it will still have the issue, the destinationUV is resized to the size of the cached node, but when you change the scale is stays at the size the node had before scaling.

import { Node, Rect, makeScene2D } from '@motion-canvas/2d'

import destinationUVbug from '../shaders/destinationUVbug.glsl'

export default makeScene2D(function* (view) {
	// view.shaders(destinationUVbug)

	view.add(
		<Node cache>
			<Rect size={view.size().sub(200)} shaders={destinationUVbug} />
		</Node>
	)
})

One funny interaction I noticed is that if you set the size of the rect with numbers or by subtracting from the view.size() like in the code above, the shader destinationUV will fit the Node properly at the normal scale, but if you do:

<Node cache>
	<Rect size={view.size().mul(0.5)} shaders={destinationUVbug} />
</Node>

Multiplying or dividing, the scale is broken just like when changing the scale of the scene. But this only happens if the scale of the scene isn't 1,0x. So my guess is both of these are the same issue.

@HikariIsChillin Thanks for checking this out!
I added a fixup to #1026 now everything should work

@aarthificial Everything is working now