danilosetra/react-responsive-spritesheet

React component which helps you to easily apply responsive spritesheet animations on your project.

react-responsive-spritesheet's Issues

Library leaking event handlers

The window.addEventListener is called, but removeEventListener is never called, thus leaking event handlers.

Bundlephobia size

Include Bundlephobia badge size

https://badgen.net/bundlephobia/minzip/react-responsive-spritesheet

direction parameter and setDirection function

Allow spritesheet rewind animation :)

remove random-id package

Use createRef() instead of random id

Branch for images

On README.md, change the folder of images from 'develop' to 'master'

Mouse events

The component doesn't supports mouse events besides onclick

Preload

implement functions to allow preload (using promises, for example) of sprite and background images

Instance parameters

The component isn't providing instance parameters like "isPlaying"

Retina support

Allow support for retina display - @2x, @3x, etc

instance return for events

Return 'instance' for events (like onMouseEnter, onClick, etc) equals getInstance returns. This will allow to manipulate instance without set getInstance component parameter

Event handlers

Implement event handlers

• onInit
• onResize
• onPlay
• onPause
• onLoopComplete
• onEachFrame
• onFrame

GitHub Package Registry

Register following the documentation - https://help.github.com/en/articles/configuring-npm-for-use-with-github-package-registry

setSpeed function

implement setSpeed function. At this point, the spritesheet can change fps even after starts

Support for ES5

Currently the build version contains class which is not compatible with ES5. It would be nice if the build version was compatible with ES5 so it can be used in IE10/11.

Max Height

component render exceeding determined height when resize window width

How to implement with the method OnScroll

I want that every time the scroll is activated, it will play.
but has not implemented those methods, how can I do it?

Optional parameters

The component can return the following parameters

• fps
• steps
• width
• height
• scale

Minified

The build is'nt and must be minified

Add onError callback instead of throwing error

Hi,
The React img component has an onError callback in case there's something wrong with image src.
Would it be possible to provide the same callback in the Spritesheet component?
Currently, Spritesheet throw an error:

 imgLoadSprite.onerror = () => {
      throw new Error(`Failed to load image ${imgLoadSprite.src}`);
 };

could be replaced by:

 imgLoadSprite.onerror = () => {
      onError(`Failed to load image ${imgLoadSprite.src}`);
 };

Regards

Error when unmounting before loading is done

If you unmount the Spritesheet before the loading is done, an error is thrown.

You probably have to check whether the component is still mounted if the onload callback.

EDIT: this line is probably returning null since it has already been unmounted.

startAt and endAt

Include startAt and endAt parameters to allow initial and final frames for animation

parameter info while timeout

The parameter 'isPlaying' supplied by getInfo is returning "true" even while spritesheet paused on start, according the timeout was configured. The correct is start with "false", and after timeout completes, return "true", cause till this, its paused, obviously.

change fps, start frame, end frame dynamically

I need to change dynamically sprites on an element, including FPS.
SetFPS function does not work
I understand that the values are initialized when the component is mounted and I can’t change them dynamically, how best to implement this? I can change the start and end frames, but I can’t change the FPS

Multi-row

The component doesn't support multi-row spritesheet images