Tumult Hype Forums

Welcome, Guest Login

Support Center

Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

iFrames problem + Phonegap build + Android + IOS

vic Apr 11, 2012 08:14PM PDT

Hi there,

I'm trying to create an app for Android (and for IOS later) using Hype 1.5 and Phonegap Build (NOT Phonegap 1.5=Cordoba 1.5)

(My app won't be public, it's for internal use in my company) The app is intended to be an offline app not a web app.

Creating a simple app works fine on my android phone (Gingerbread 2.3) However, now my intention is to add an iframe in one of the scenes.

The iframe works great on a browser but on my Android phone, when I open the scene where the iframe is, the iframe opens directly in the default browser outside of the app.

Also, even though the iframe works in a normal browser, I can see at the top (outside) of the iframe "var html =" in bold font and at the bottom (outside) of the iframe the rest of the iframe code also in bold font.

The iframe window embeds one of the scenes in the project NOT any element from the internet.

I guess this is an issue with phonegap build and not with Hype. However, is it possible to do some workaround? My app really needs an iframe working on a mobile device.

Many thanks! your software rocks!


15 Community Answers

Best Answer
Ryan Nielsen Jul 20, 2012 03:40PM PDT

PhoneGap 1.9 incorporated the Android workaround, so now our recommendation is as follows: iOS app developers MUST use Phonegap 1.7.0 or later. Android app developers who want compatibility with all Android versions MUST use Phonegap 1.9.0 or later.

View in conversation

Up -1 rated Down
Daniel Morgan Apr 12, 2012 03:21PM PDT Tumult Hype Agent

Can you send a test file so I can try out a couple things?

You should try adding this code to the inner HTML of your page: http://hype.desk.com/customer/portal/articles/458755-known-issue-scrollable-text-in-iframes-or-boxes-is-cut-off-in-ios-devices-and-other-mobile-devices -- it may help.

Are you using the HTML widget element to display the iframe? Are you using javascript to create the iframe within the innerhtml of another element?

If you'd like to keep this more private feel free to email us: http://goo.gl/Gx3ae

Daniel Morgan
Tumult Hype Support
Up -3 rated Down
vic Apr 12, 2012 10:30PM PDT
I just send you guys an email. Thanks a lot Daniel !
Up 2 rated Down
Arash Apr 22, 2012 01:38AM PDT
hi vic,
I'm trying to get my Hype project into Eclipse using Cordoba 1.6 but all I get is just a blank screen,have tested with phonegap 1.4.3 with the same result.
Would you please tell me the steps you took to run your project on Android Emulator ?
thanx in advanced
Up 2 rated Down
Xavier Apr 24, 2012 09:21AM PDT
Arash Hi I have the same problem when I launch the emulator with the loaded project stays all blank.
does not give me any error.
to build the project with PhoneGap: build me the same thing happens.
Up 2 rated Down
Daniel Morgan Apr 25, 2012 11:03AM PDT Tumult Hype Agent
Vic & Xavier:

We're looking into an issue with Phonegap and we'll update this thread when we have a solution.

Daniel Morgan
Tumult Hype Support
Up 5 rated Down
Jeff May 26, 2012 07:56PM PDT
Did the Phone Gap blank screen ever get figured out? I just tried emulating the app on my Android device and got the blank/black screen as well. Pages generated work wonderfully when I load in a browser.
Up 0 rated Down
Sergio May 27, 2012 10:58AM PDT
Looking for a fix as well. Very frustrating.
Up 1 rated Down
Ryan Nielsen Jun 06, 2012 04:25PM PDT Tumult Hype Agent
We've just finished investigating issues with both iOS and Android Phonegap. Here is what we found.

For iOS: You MUST use Phonegap 1.7.0 or later. Phonegap 1.6.1 and earlier have bugs which prevent those versions from working with Hype documents. We have tested both Phonegap 1.7.0 and 1.8.0, and Hype documents load perfectly on iOS with both of those versions.


For Android: There is a bug in Android 3.x and 4.x that breaks WebViews and prevents them from loading any URL that contains a query string (the part of the URL that follows a '?'). Hype documents rely upon query strings in a few different areas to ensure the latest version of your document is always being loaded and that the proper HYPE runtime is being used to load each document. These query strings are not needed in an environment such as Phonegap, as you can guarantee you're always running the latest document (it's bundled in your app, after all) and the runtime is always linked to the correct document (again, it's bundled in your app). Unfortunately, removing these query strings is error-prone and would need to be done every single time you exported your document.

The Android bug, which persists even in the most recent Android releases, is documented here: http://code.google.com/p/android/issues/detail?id=17535

Thankfully, one enterprising individual developed a workaround specifically for Android Phonegap 1.7.0. The workaround is documented here: https://github.com/apache/incubator-cordova-android/pull/21 and you can download an Android Phonegap 1.7.0 JAR file with that workaround applied here: http://android.googlecode.com/issues/attachment?aid=175350122000&name=cordova-1.7.0.jar&token=wr7EMnyvXAfONqOLmT8p0v2rLlQ%3A1339021999705

Please use that JAR file for all of your Android Phonegap applications that integrate Hype animations. No other Android Phonegap build will work, including the latest release, 1.8.0. I also encourage you to contact the Phonegap team and advocate they take the fix that's published at https://github.com/apache/incubator-cordova-android/pull/21. The author has already requested they integrate his fix, but it seems they've yet to do so. If others request, perhaps they'll integrate the fix into Android Phonegap 1.9.0.


In summary: iOS app developers should use Phonegap 1.7.0 or later. Android app developers who want compatibility with all Android versions MUST use Phonegap 1.7.0 and MUST download the custom built Phonegap 1.7.0 JAR linked above.
Up 3 rated Down
John Jun 15, 2012 01:45PM PDT
I am also having this problem. I'm interested in the workaround, but the link is not working. Could someone please provide another location for this file?
Up 2 rated Down
Ryan Nielsen Jun 15, 2012 02:45PM PDT Tumult Hype Agent
Hi John, please download the file attached to this comment: http://code.google.com/p/android/issues/detail?id=17535#c122

It appears the URL I provided above is time-limited, so anyone who needs that file will need to click the download link in that comment themselves. Sorry for the additional hassle!
Up -2 rated Down
Ryan Nielsen Best Answer Jul 20, 2012 03:40PM PDT Tumult Hype Agent
PhoneGap 1.9 incorporated the Android workaround, so now our recommendation is as follows: iOS app developers MUST use Phonegap 1.7.0 or later. Android app developers who want compatibility with all Android versions MUST use Phonegap 1.9.0 or later.
Up -7 rated Down
Nimrod Beker Jul 25, 2012 08:09AM PDT
Hello There,
i hope this is the right place to post my problem, as i reached this article via google search..
my problem is close to the one originally posted but not exactly the same -
my iframe works fine until i change the iframe src, via JS. when i change the src of the iframe, the new iframe src to-be opens in a new window (seems to be new phonegap html window because its not a browser one) instead of in the iframe..

If this is not the right place for this question please just reference me :)
Up 5 rated Down
Ryan Nielsen Jul 27, 2012 03:42PM PDT Tumult Hype Agent
Hi Nimrod, I suspect you'll need to whitelist the domain you're assigning to the source attribute. There are some details on PhoneGap's wiki: http://wiki.phonegap.com/w/page/51586852/iFrames%20and%20PhoneGap
Up -4 rated Down
Jacob Perl Sep 04, 2012 08:44PM PDT
"iOS app developers MUST use Phonegap 1.7.0 or later."
Does this apply if I'm using Phonegap Build (via Dreamweaver)...it seems to indicate Phonegap v.2.0 but I'm still having the problem of iframe sources loading in Safari instead of the html widgets in my app.
Up 1 rated Down
Jacob Perl Sep 05, 2012 09:30AM PDT
Found this solution on Phonegap and it is working for me: I added the line

<preference name="stay-in-webview" value="true" />

to my config.xml file and now my iframe source content is displayed properly within my html widgets.

Post Your Public Answer

Your name (required)
Your email address (required)
Answer (required)

Contact Us

seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
Invalid characters found