legalthings / angular-signature

HTML5 canvas based smooth signature drawing as angularJS directive (http://szimek.github.io/signature_pad/)

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Canvas dimensions are sometimes 0 by 0

mcblum opened this issue · comments

I realize this is the most vague error ever, but every once in a while when clicking through the application I'm building all signature pads stop accepting any kind of mouse input. Any idea where I should look to see what could be happening?

Thanks for your work on this!

Ok, figured out one thing. It seems to have to do with browser resize. Any idea what might be happening?

I came across this issue, too. The canvas dimensions are sometimes 0 by 0, and resizing (rotating iPad to landscape, in my case) causes them to be properly populated.

Could you please give more information in regards to what browser (+version) exhibits this issue? Also what version of angular-signature are you running? Master or a release?

@Sarfaraaz We thought we had fixed it but it's back for some reason. We're using Chrome, latest version, on Mac.

Edit: Just heard from a client it's also broken on FF. It seems that the pad shows up but doesn't allow any input. Refreshing the browser fixes it.

@Sarfaraaz as far as version we're using "angular-signature": "^0.1.7",

@mcblum Can you create a jsfiddle and instructions for reproducing the issue. We're unable to reproduce the problem in our setup.

@jasny Oh man... I'll try. It's a series of forms that are hidden except for the one you're viewing. I'll see if I can replicate it in jsfiddle.

Ok, so I couldn't get the JSFiddle to work, but our problem seems to be the same problem that everyone is having -- when the element exists but isn't in the dom yet or visible or whatever the height and width of the canvas is 0 and the user can't draw in the pad. Do you have any idea of what this might be?

+1
I have the same problem, if I resize the window, the canvas stops working.

@jasny Do you think it could be caused by how Angular is constantly messing with the dom? Our signature pads are basically in hidden panes that are activated one by one, so they're really no initialized until they are visible, but maybe there's some conflict there?

In the app that's in production we are simply telling users that if it breaks they need to reload the page and it will work, and it always does. But hiding one pane and opening another really messes it up.

@mcblum This fix might actually be causing the problem: https://github.com/legalthings/angular-signature/blob/master/src/signature.js#L77

Can you try to either remove it OR using $interval rather than $timeout.