meganetaaan / vue-8-puzzle

A simple 8-puzzle game made as a Vue.js component
MIT License
30 stars 9 forks source link

Index out of bounds? #24

Closed mitchellkulak closed 4 years ago

mitchellkulak commented 4 years ago

Hey, I'm using this puzzle for a project of mine. I'm having an issue (possibly related to autoResize).

When autoResize is set to false, the board's initial state looks good, but when I try to click on any of the tiles on the bottom half, I get an index out of bounds error in the console and nothing moves. It appears to be looking for a tile index that is greater than the number of tiles in the game. This only occurs when autoResize is false.

When autoResize is true, the tiles move perfectly. However, I get a bunch of blank tiles. About half of the tiles load properly, and the other half just appear blank. The full image isn't represented in this case.

Any advice you can give would be really helpful. I'd love to continue using your package, it has all the features I need, but I just can't get it to work properly with either setting of autoResize.

I've tried this with .png and .jpg, if that is important.
Please let me know as soon as you can!

meganetaaan commented 4 years ago

Thank you for using this component! Please copy/paste your error log here to guess the cause. And would you give me a code(html/js) to reproduce in my environment?

I've tried this with .png and .jpg

The component is available for .png and .jpg so I think your file format has no problem.

mitchellkulak commented 4 years ago

Hey, I ended up resolving this issue. It originated from the internal height and width attributes being different from the height and width declared in my CSS. It led to strange effects, but by setting the heights/widths to be the same caused it to work like a charm!
Thanks for this helpful package!

meganetaaan commented 4 years ago

Happy to hear you resolved the issue! Hope you enjoy.