Play video .webm with alpha - vp9

[DarkSearinox92]

Hello guys,

i really don't understand why i can't reproduce correctly a video that i made on adobe after effect RGB+Alpha, rendered in quicktime .mov and recoded in .webm keeping Alpha.

I'm trying to reproduce this video in RPG MAKER MV, Pixi version 4.8.9

I really don't understand.

I found a similar thread and i read a lot of stuff about this problem. A similar thread was this: #4190

Someone connected it to another thread: #4089

But i really don't understand what i must do.

Please, help me. Is it so difficult play a video without background? T_T It always show Black background.

I would love to create transparent background video animations.

If you need other informations, please tell me.

Thanks to the good soul who will help me to solve this problem.

[ivanpopelyshev]

Try this one:

PIXI.glCore.GLTexture.prototype.upload = function(source)
{
	this.bind();

	var gl = this.gl;


	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, this.premultiplyAlpha);

	var newWidth = source.videoWidth || source.width;
	var newHeight = source.videoHeight || source.height;

	if(newHeight !== this.height || newWidth !== this.width || source.videoWidth)
	{
		gl.texImage2D(gl.TEXTURE_2D, 0, this.format, this.format, this.type, source);
	}
	else
	{
    	gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, this.format, this.type, source);
	}

	// if the source is a video, we need to use the videoWidth / videoHeight properties as width / height will be incorrect.
	this.width = newWidth;
	this.height = newHeight;
};

[DarkSearinox92]

Try this one:

PIXI.glCore.GLTexture.prototype.upload = function(source)
{
	this.bind();

	var gl = this.gl;


	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, this.premultiplyAlpha);

	var newWidth = source.videoWidth || source.width;
	var newHeight = source.videoHeight || source.height;

	if(newHeight !== this.height || newWidth !== this.width || source.videoWidth)
	{
		gl.texImage2D(gl.TEXTURE_2D, 0, this.format, this.format, this.type, source);
	}
	else
	{
    	gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, this.format, this.type, source);
	}

	// if the source is a video, we need to use the videoWidth / videoHeight properties as width / height will be incorrect.
	this.width = newWidth;
	this.height = newHeight;
};

I tried both ways.

Either edit both pixi.js or add a patch and insert it into the index.

If I change pixi.js to that function, it gives me black screen during testing. A total black screen, i can't do anything.

If I insert the patch and put it in the index, the game starts and i see the test room, but the alpha doesn't seem to work, unfortunately, if i start the video.

Tell me if I made the right steps, in theory yes ... it only change a couple of things in the end ...

Did i miss something? I've attached some screenshot (first two about the Pixi patch, and other two about the change that i made...

[DarkSearinox92]

@ivanpopelyshev Do you have any news? :( You sent me a code, but it doesn't work in a Project...

[DarkSearinox92]

@ivanpopelyshev I'm continuing to place hope in your holy help...

[DarkSearinox92]

Please, someone can help?...

[adilmas13]

Which version of Pixi are you using ?

[DarkSearinox92]

I wrote it in the post... 4.8.9.

There was ivanpopelyshev who was trying to help me... but he disappeared... or has stopped answering me and is ignoring me...

[adilmas13]

Try this out.... Update to the latest version of PIXI first ie v6.0.2.. then try the following

PIXI.resources.BaseImageResource.prototype.upload = function(renderer, baseTexture, glTexture, source) {
      const gl = renderer.gl;
      const width = baseTexture.realWidth;
      const height = baseTexture.realHeight;
      source = source || this.source;
      gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, baseTexture.premultiplyAlpha);
      // add this line, check for video
      const isVideo = !!source.videoWidth
      if (!isVideo && baseTexture.target === gl.TEXTURE_2D && glTexture.width === width && glTexture.height === height)
      {
        gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, baseTexture.format, baseTexture.type, source);
      }
      else
      {
        glTexture.width = width;
        glTexture.height = height;
        gl.texImage2D(baseTexture.target, 0, baseTexture.format, baseTexture.format, baseTexture.type, source);
      }
      return true
    }

[DarkSearinox92]

The problem is that i need to stay to 4.8.9, on RPG Maker MV. In new version of Pixi, it works.

The thing is: what did they changed for have it to work on new versions? They surely fix something in the code... But what? :(

Here you can find the ENTIRE discussion, before they moved it into "question" tab from "issue":

#7140

So you can understand better passages that we made.

[DarkSearinox92]

Hello Guys, can youhelp me and resolve this issue, please? A good soul ç_ç I need your help... PLEASE T_T

[adilmas13]

@DarkSearinox92 Like suggested earlier, please update to the latest PIXI version.. 4.8.9 is no longer maintained

[DarkSearinox92]

How can i explain better that i can't update that Pixi 4.8.9, because this is the last version compatible with Rpg Maker MV?

Come on it's not possible that developers can't know what part of the code is necessary for fix the alpha video... i think that it's crazy...