Randomly breaking..

[fabiangigler]

First I wanna say, awesome script! However it breaks weirdly for me. (Firefox 43.0.1, Windows 10)
On the first couple of tries, the script didnt work at all, and all the borders in the demo appeared black for me. After reloading a couple of times, what finally worked was opening the "Demo" link in the sidebar in a new tab. Then most of the images (except the ones, under the heading "Load Images dinamically") are displayed correctly.

However it always displays the following error in the console:

image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228] colorify.js:230:11
image cannot be processed DOMException [IndexSizeError: "Index or size is negative or greater than the allowed amount"
code: 1
nsresult: 0x80530001
location: http://colorify.rocks/src/colorify.js:228]

[LukyVj]

Hi @fabiangigler !

Thanks a lot for this issue.

I know the script can behave weirldy, it's because the images are processed when the page loads, and if the image is not yet loaded ( causes can be : Slow connection, or just bad written code huhu ).

Also, I noticed that the "first load ever" of the page, can cause this problem, because the images are not yet cached.

I'm currently investigating it, all I know is it's due to the canvas processing, I will try to fix it today.

Letting you know how it goes.

Thank you !

[manattweb]

Confirmed - Firefox 43.0.4 on Windows 10. As well on OSX (El Capitan) on Firefox...

[LukyVj]

Hi, @manattweb

So you're only experiencing it with Firefox ?
I'm currently working on the v1.2, I plan to fix all those things.

What kind of breaking are you experiencing ?
Does it still break when you refresh ?

Let me know.

[hoscb]

Hi VJ,
Thanks for the awesome script. I can confirmed that it is still breaking. The initial load is always black color. It works only after a few browser refreshed.