Darker

What is a PR? If I were to try to help implement this feature in Pixi, what advice can I get on that matter?

So I'll have to hack it in through original WebGL? Basically by copy-pasting the Fiddle I shared in the original post?

Actually I think I wanna use the array is a texture - which is 2Dshader I guess? This would allow me to access the elements through float offsets so that, if properly implemented, the game field would be easily scalable.

The file was removed

I kept searching the internets and I found this demo, which is exactly what I need - define a color pallete, a list of pixels, width and height and render it: http://jsfiddle.net/greggman/cvADG/ The problem is this demo uses raw WebGL+some helper functions. I would like to go with Pixi.JS approach, which is better readable: function CustomFilter(fragmentSource){ PIXI.AbstractFilter.call(this, // vertex shader null, // fragment shader fragmentSource, // set the uniforms { pixels : {type : '???', value : new Uint8Array(100)}, colors : {type : '???', value : new Uint8Array(6)}, width : {type : 'int', value : 10}, height : {type : 'int', value : 10}, } );}The problem is I don't know the following two things for start: What type name should I use for Uint8Array? And what type name will that be in GLSL? How do I read the array values? How do I know at which pixel offset am I located, so that I know which one should I render?Also there are other concerns, like: How do I notify Pixi that an array offset has changed?

Can you try to produce some code and let us help you fix it? You could just start by looking in the docs for methods similar to canvas ones then see what happens. The code you shared is really long and complicated.

I strongly agree with mattstyles - I use normal HTML when rendering text and forms and stuff and I only use PIXI for actual game animation. I mean I wanna make a game, not reinvent HTML renderer - what do you want? Not only yo have CSS, form elements but you can also use some framework like JQuery so that you can really concentrate on your game, not on centering stupid DIV element in the middle of the screen.

I tried it, it was all right. Try to make more complicated animation so that we can see a difference.

Bookmarked. I'm going to need this really soon

Shame on me, I found the problem while creating test case. It was my fault of course. Sorry

No, modifiyng the shader to anything just has no effect. I tried to add the floating point, but the image still appears instead of being black. The shader is here btw: http://demo-project-darker2.c9.io/shader.txt and according to the Network panel it's downloaded and applied.

Yeah, thanks a lot, I've already started researching. Thanks for this great sample, I can see how to create such a filter in Pixi. Right now I'm actually stuck on replicating that behavior, so I think I did some beginner mistake. Even if I write filter like this: #define I GIVE UPnope nope nopeI still get no errors. I also tried to make a filter that renders all black, with no effect: void main(void){ gl_FragColor = vec4(0,0,0,0);}I first tried to assign the filter to PIXI.Graphics object. Since it didn't work, I used texture instead: var filter = new GameShader(gameShaderSrc); var bg = PIXI.Sprite.fromImage("image/playerai.png"); bg.scale.set(2,2); bg.filters = [filter]; this.stage.addChild(bg);The image appears, but no change is applied to it. I uploaded the files here. The circle behind new player message is the image playerai.png: The sourcecode is here: http://demo-project-darker2.c9.io/rendering.js I apply the filter on line 43 and I call rendering loop at line 139. The rendering object can be accessed as game.renderer from the global scope. PS: I found XSS exploit on the examples page. Check this out: pixijs.github.io/examples/index.html?s=basics&f=custom-filter.js&title=x%3Cstyle%3E*%20%7Bdisplay%3Anone%3B%7D%3C%2Fstyle%3E Somebody more badass could probably smuggle a script tag too. I don't know where to report it, maybe you do.

Ok, thanks. Can you just tell me how does that C code translate to the browser? Or we can send C code samples right to webGL?

I am rendering pixel grid in my game and it's really not very effective at the moment. I asked about that on GitHub and I was advised to use something called FragmentShader. But I have no idea what that is and how to use it. I tried to find it in documentation but there isn't anything but a list of parameters (not even mention what type are these parameters): https://pixijs.github.io/docs/PIXI.TextureShader.html So my question is: How to initialize and append texture shader to PIXY application? How to provide source of pixels or otherwise define them. How to redraw it.

The loop is locked, so far I didn't need to clear it, so there's no way to do so. But yeah, I need to redraw the whole pixel array because pixels may also dissapear or appear at random locations - I plan on some fun features in the game. The only optimization I can do, and I did, is to only redraw when pixel array has changed.