Gisellameloni / svg-edit

Automatically exported from code.google.com/p/svg-edit
MIT License
0 stars 0 forks source link

embedapi/iframe keyboard not working on iOS #1106

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
Using the embedapi on iOS does not treat keyboard events.

Test scenario:

1. Open this url on an iOS device using Safari or within an App with webkit: 
http://svg-edit.googlecode.com/svn/branches/2.6/editor/embedapi.html
2. Select the text tool and try to type. The keyboard shows up, but no text can 
be entered. When using the iOS simulator, "Paste text" is working. So it is a 
problem with the keyboard event, not the representation with fonts.
3. Click on <svg> (edit svg) tool. The svg source shows, but the keyboard is 
not working. The svg text can not be changed

The same scenario is working on an Android tablet (4.2) with Chrome and on Mac 
OS X with Safari.

Using the non-embeded page with this url 
http://svg-edit.googlecode.com/svn/branches/2.6/editor/svg-editor.html, 
everything works as expected on iOS too.

Conclusion: It seems to be a bug with the iframe used in embedapi.html and iOS. 
I googled among this issue but didn't find anything. I expect there is a 
problem with iframe, touch and iOS. 

Is this problem known, or is there another way to embed the svg editor into a 
html page other than an iframe? <object> is also not working.

Any help is appreciated.

Daniel

Original issue reported on code.google.com by dstainha...@gmail.com on 11 Jun 2013 at 7:12

GoogleCodeExporter commented 9 years ago
You may need to use javascript in the parent page to give focus to the iframe.

Original comment by jesss...@gmail.com on 6 Sep 2013 at 1:12

GoogleCodeExporter commented 9 years ago
Hi, this is due to what seems to be a bug in Safari on iOS, documented here 
(https://github.com/ftlabs/fastclick/issues/37) and here 
(http://openradar.appspot.com/radar?id=2523403).

I've fixed this, patch attached.

Since the bug relates to attaining focus on a text box that is inside the 
iframe, the fix is to put the text box outside the iframe in the host document. 
This patch will only work if the svg-edit iframe is hosted on the same domain 
as the main page. The text box is created on the fly, so no need to modify the 
host document HTML source.

Original comment by timmacfa...@gmail.com on 16 Oct 2013 at 5:32

Attachments: