Giter VIP home page Giter VIP logo

charm's People

Contributors

kittykatattack avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

charm's Issues

Pixi.js v4 support

I figure we can keep a list of the stuff that breaks in v4 here.

  • PIXI.ParticleContainer needs to be renamed to PIXI.particles.ParticleContainer

I suggest add a sequene animation controller

{
    key: "sequene",
    value: function sequene(sprite, arr, callback) {
      var _this = this;
      let cmdNums = arr.length;
      let nextSequene;
      nextSequene = function(cmds, id, maxID, func) {
        if(id === maxID) {func(); return;}
        let maxFrame = 0
        let maxAni = undefined
        let hasWait = false
        let finished = false
        for (const key in cmds[id]) {
          if (key === 'func') cmds[id][key](sprite)
          else if (key === 'wait') {
            hasWait = true
            _this.wait(cmds[id][key]).then(() => {
              hasWait = false
              if (!finished) return;
              nextSequene(cmds, id+1, maxID, func);
            })
          }
          else {
            let ani = _this[key](sprite, ...cmds[id][key]);
            let tframes = ani.totalFrames || ani.tweens[0].totalFrames
            if (tframes > maxFrame) {
              maxFrame = tframes
              maxAni = ani
            }
          }
        }
        if (maxAni) {
          maxAni.onComplete = () => {
            finished = true;
            if (hasWait) return;
            nextSequene(cmds, id+1, maxID, func);
          }
        } else finished = true;
      }
      nextSequene(arr, 0, cmdNums, callback);
    }
  }

to Use it:

charm.sequene(this.meSp,[
            {slide: [this.meSp.x + 300,this.meSp.y,30], wait: 2000},
            {
                slide: [this.meSp.x,this.meSp.y,30],
                func: sp => console.log(`here! ${sp.x}`)
            }
        ],() => {
            console.log("complete!")
        });

Problem with loops.

Hello,

First time when I try to animate objects through a loop it works like a charm first time. Every other time only the last one gets animated. When I test same objects one by one animations work, Problem is only when I run it through loop.

My code is simple:
`//this is loop
this.animateObjectArray = function() {
for (var i = 0; i < this.toAnimateArray.length; i++) {
playroom.utils.charm.fadeIn(toAnimateArray[i], 20);
}
}

// and fadeIn f, c is charm object.
fadeIn: function(obj,time, to){
if(obj.anim!= undefined){
c.removeTween(obj.anim);
}
obj.visible = true;
obj.anim = c.fadeIn(obj,time);
}`

Thanks in advance,
Milutin

Publish to NPM?

Hey! This library and your Pixi.js guide are incredibly helpful, thank you. Have you considered publishing Charm to https://www.npmjs.com/ so people can npm install charm?

a totally es5 version

I need a totally es5 version, but I use babel to complie the src file can't get the result I want? I have tried to config babel but dosen't work, maybe just miss some steps, please help me to get a totally es5 version😰

License file

Hi kittykatattack,

Is it possible to add a license file to this repository? Is it free?

Thx,
Maks

Random behavior

Dear Sir,
I have experienced some issues with this project. I'm doing a heavy use of Charm.js on my game, specifically fadeIn e breathe methods. At first time I run the game, everything work perfectly. From second time and so on, breathe adquires rondam behavior (just works scalex, ignoring scaley).

In the level select I have a exit button (example):

stage.addChild(exitButton); effect.fadeIn(exitButton, 180); effect.breathe(exitButton, 1.05, 1.05, 60, true);

So I load a new level (after remove the exitButton from stage) and, in the level end, I come back to level select screen and run again the above code. If I don't clear all tweens it works strange, like if we have two breathe executions simultaneously.

I created a new method, removeTweens, to make this effect less perceptible, but I still experience what I cited in this issue (Now it clearly runs only once):
... this.globalTweens.splice(this.globalTweens.indexOf(tweenObject), 1);

Could you help to solve it? What is the proper way to use charm.js in a game where I have to remove sprites for scene and then add they again, reloading the effect?

I thank you in advance for your attention!

Feature proposal: add rotation to slide method

It would be nice if I could also specify a rotation angle in radians to which the sprite should rotate by the end of the slide. Or, perhaps, keep rotating at given speed, until the end of the slide.

More of a feature request / suggestion

While PAUSE and PLAY are great, GOTOANDPLAY, GOTOANDSTOP would be super nice.
Similarly, the ability to run a callback function from a particular frame within the tween, not just the ends. - i.e. something like...
anyTween.onFrame(14) = () => possiblyBlink();
anyTween.onFrame(25) = () => maybeBlowBubbles();

Finally, an easy one - rotate sprite to path option.

Bought your Pixi book by the way - great stuff, keep up the good work :)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.