pixijs / pixi-heaven

PIXI.js advanced color modes, sprites, meshes
MIT License
115 stars 14 forks source link

not work on spine #4

Closed jonlepage closed 6 years ago

jonlepage commented 6 years ago

hum, i just apply haven for spine obj, and it look not work. spine have color property, but it not affect the rendering. ? It work good on sprite objet only. ??? image

i use the same code as the example. new PIXI.heaven.spine.Spine(data.spineData); any idea ? i also have the last pixi-spine https://github.com/pixijs/pixi-spine/releases.

my order are also correct in my html

    <body style="background-color: black">
        <script type="text/javascript" src="js/libs/iziToast/iziToast.js"></script> <!--iziToast js for editor-->
        <script type="text/javascript" src="js/libs/jscolor/jscolor.min.js"></script><!--colorJs tint for editor-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/10.0.0/bootstrap-slider.min.js"></script>
        <script type="text/javascript" src="js/libs/pixi.js"></script>
        <script type="text/javascript" src="js/libs/pixi-tilemap.js"></script>
        <script type="text/javascript" src="js/libs/pixi-picture.js"></script>
        <script type="text/javascript" src="js/libs/pixi-layers.js"></script>
        <script type="text/javascript" src="js/libs/pixi-filters.js"></script>
        <script type="text/javascript" src="js/libs/pixi-spine.js"></script>
        <script type="text/javascript" src="js/libs/pixi-heaven.js"></script>
ivanpopelyshev commented 6 years ago

It should work after spine.update(0) , you need to animate the object to change its colors. Did you turn off the animation?

jonlepage commented 6 years ago

yep by default, all animations are animated for the preview mode.

const objSprite = mode.tile && new PIXI.heaven.Sprite(data) || new PIXI.heaven.spine.Spine(data.spineData); 
 mode.spine && objSprite.state.setAnimation(0, session.defaultAni[0], true);

refreshProprety_obj(objSprite,session)  // refresh the base props with the proprety or session

refreshProprety_obj apply the color from slider , look at case "setDark":case "setLight":

    // refresh current session proprety. Apply session props to obj
    function refreshProprety_obj(objSprite, proprety){
        for (const key in proprety) {
            if(key.indexOf("_") > -1){continue}; // jump prop _ case
            const props = proprety[key];
            const actived = proprety[`_${key}`];
            let value = actived ? props[1] : props[0]; // if actived true asign:[1] or asign default:[0]
            switch (key) {
                case "alpha":case "rotation":case "tint":
                objSprite[key] = value;
                break;
                case "scale":case "skew":case "pivot":
                objSprite[key].set(value[0],value[1]);
                break;
                case "setDark":case "setLight":
                objSprite.color[key](value[0],value[1],value[2]);  //TODO: LOOK FOR DIRECT ASIGN AND  INVALIDATE() (prevend tint bug)
                break;
                case "defaultAni":// if not same, reset
                const current =  objSprite.state.getCurrent(0);
                if(!current || current.animation.name !== value){
                    objSprite.state.setAnimation(0, value, true);
                }
                break;
                case "timeScale":
                if(objSprite.state.tracks[0]){
                    objSprite.state.tracks[0][key] = value;
                }
                break;
            };
        };
    };
ivanpopelyshev commented 6 years ago

Which version of pixi-spine do you use?

jonlepage commented 6 years ago

3.6.52 i send you the original file tree1.zip

ivanpopelyshev commented 6 years ago

No, i mean pixi-spine plugin version :) I'm sure that i added colors support after you started work on your app.

jonlepage commented 6 years ago

ok i will able to test in few hour , am fixing some code, and i will take a look on the current version i have. Am not sure because pixi-spine.js don't have version in comment, i need compare file. it would be really stupid if I took an outdated version from another project! I will keep you update

ivanpopelyshev commented 6 years ago

Yep, colors integration works from both sides - you need heaveh (which you have) and updated pixi-spine.

jonlepage commented 6 years ago

ok just check both file, and i have the 1.4.0 from https://github.com/pixijs/pixi-spine/archive/1.4.0.zip I also crush the file to be sure!.

sorry, it not working!

ivanpopelyshev commented 6 years ago

I didnt make releases there for a while. You need 1.5.14, from "bin" folder in the same repo.

ivanpopelyshev commented 6 years ago

Oh, we dont publish binaries there anymore :( take it from npm or just build it from cloned repo.

jonlepage commented 6 years ago

I don't understand anything, forgive me. I do not know anything about github and how it work. Would not you just have the script to copy paste?

ivanpopelyshev commented 6 years ago

Ok, I uploaded the build to github directly. Take it here: https://github.com/pixijs/pixi-spine/tree/master/bin

Please spend some time on investigating how to clone repository to your computer and build latest version manually. Or how to get it from npm.

jonlepage commented 6 years ago

yes ok it's a good idea, when I have a day, I'm going to check some tutorial. Thank a lot for the build, you are awesome.