Introducing RUNPIXI.js

[ben0bi]

I created a little library which sets up all the minimal stuff I need to create a PIXI screen and "game loop".

I am heavily relying to this in each of my projects.

You just need to incorporate jQuery [edit: jQuery not needed anymore in v0.3], pixi and RUNPIXI (in that order), create a div or something with a given size and an id, and then call:

<script>
function myloop() {} // do your looping stuff here
RUNPIXI.initialize("mypixidiv", myloop); // [edit] removed jQuerys # selector.
</script>

..and that's it.

I think this could be usefull for everyone who is new to pixi and also for other "lazy" people.

What it does now is the following: It creates the pixi screen in the given element, using the size of that element. It creates three containers to draw on, from which the middle one can be scrolled with arrow and asdw keys. (You can turn scrolling off, of course)

Also it registers a resize event, which resizes the pixi context when the element resizes.

You can add and apply shaders with your desired names.

v0.2 enables you to capture the screen to a texture or array.

Oh, I almost forgot: Here's the link, have fun with it and gimme some credit if you like it. (in text/reputation form, I don't want your money.)

"Documentation" is in the readme file.

https://github.com/ben0bi/RUNPIXI.js

Edited October 10, 2016 by ben0bi
jQuery not used anymore.

[xerver]

Very cool! Another good one is PixiApp: https://github.com/limikael/pixiapp

[tips4design]

What do you use jQuery for?

[ben0bi]

stuff...I am a lazy person, that is why I made this whole thing.

Why not use jQuery if it will be used anyway? (on my side)

I can look for making a jQuery-free version, it is used right now for initializing and maybe some other stuff. **review-engine on...no fuel...later.  **

Also, I am a general programmer, I can use almost every language but on the other side I don't know about the "tricks" a specific (JS)programmer would use. So, the code may be somewhat "naive", but it works...hope you like it, though.

[EDIT]

jQuery used for:

+ Check if the loop function parameter on initialize is a function. (jQuery.isFunction())

+ Check if the pixiscreenID parameter on initialize returns any elements. ($(pixiscreenID).length)

+ Get the jQuery elements with that id. (I could use here findElementById from html, but..)

+ Append the renderer to that element (hopefully just one) ($(pixiscreenID).append())

+ Get the width and height of the element on resize.

That's it. It's not much, but, for example, how do I get the css width and height with "DOM-JS" ?

I will remove that jQuery as soon as possible, if I can handle it. You are invited to make a pull request if you already did it.

[ben0bi]

I just removed all jQuery references in v0.3. Thanks for your critics. Adjusting the original post to it.

Regards