Thanks Ashley. It worked brilliantly! This has been pestering me for a while with very little help on the internet. You made my day. Thanks a lot.

There is one more issue that I have been facing with the offline cache. When offline - And with my App containing 2 games that are called from a main menu - when I come out of first game to main menu and click another game ( assuming both games were cached when online), the second game would not load...the page still remains on the first one. Any solution to circumvent this? I have educational apps running on iTunes that suffer this offline issue which have been reported by the customers...Any help is highly appreciated. Though I have posted this in the regular forums couple of times, no one responded...Please help.

Link to .capx file (required! If link is blocked remove the http and www parts):

dl.dropboxusercontent.com/u/28297064/Ordering%20of%20Planets%20-%20finalized%20new%20look-latest%20version.capx

Steps to reproduce:

1. For an App created on iPad (P.S: I have recorded my App running live on iPad with great difficulty. Please check the recorded video link here - dl.dropboxusercontent.com/u/28297064/Untitled.mov)

2.The exported HTML5 is called inside an iframe ( with link target="myframe" in the below code). This iframe is present inside the <div> tags containing header & footer. I have cut-pasted portion of the code below for you to see what I meant -

    <div data-role="page" id="next-main-wrapper" class="ui-page app" data-theme="a" >

        <div data-role="header" id="next-main-header" data-theme="d">

           <h1> Earth and Space </h1>

        </div>

        <div id="allNextContent" data-role="content">

             <iframe name="myframe" id="myframe" seamless="seamless">

             </iframe>

        </div>

        <div data-role="footer" data-theme="d">

                 <p>Copyright 2013 </p>

        </div>

    </div>

2.

3.

Observed result:

As can be seen from the video, it loads with the correct size but then somehow starts getting resized (rather over sized) beyond the screen limits! (I have recorded the screen of iPad, running my App live. Please check the recorded video here - dl.dropboxusercontent.com/u/28297064/Untitled.mov )

This behavior is observed only on iPad App only. In browsers it works fine! I have also tried removing canvas resize function inside index.html of the exported HTML5 but no change...I simply dont understand what is causing this!

Expected result:

Using letterbox scale option it should have fit exactly within the iframe but should not oversize.

Browsers affected:

This oversizing behavior is strangely observed only on iPad App somehow. In all other browsers it works fine! FYI...I invoke the same code in web apps as well and all of them work fine without issues.

Chrome: yes/no

Firefox: yes/no

Internet Explorer: yes/no

Operating system & service pack: iOS/iPad

Construct 2 version:158 stable release

Bump

Great! Thanks Ashley. I just tried with on any Touch start event and it worked! Do you think I can use this as a best practice / regular feature in all my embedded games in iframe so as to ensure the games run fullscreen? Thank you very much.

Link to .capx file (required!):

dl.dropboxusercontent.com/u/28297064/iFrame-Breakout%20Test.capx

The link to the html that launches this iframe is - actualconcepts.com/TestTC/testFullscreen2

Steps to reproduce:

1. Mouseclick/touch - Browser object should trigger "request fullscreen" as per the tutorial written by Ashley, link below - scirra.com/tutorials/655/tips-on-publishing-html5-games-to-the-web

2.

3.

Observed result:

The exported html5 game is not breaking out to full screen rather it stays within the limits of the iframe boundary itself.

Expected result:

In the tutorial written by Ashley, link below - scirra.com/tutorials/655/tips-on-publishing-html5-games-to-the-web.

its mentioned as below -

------------------------------------------------------

It's possible for games inside iframes to switch in to fullscreen mode, where it takes up the entire monitor. To support this, your game must not be fixed size - it has to use a fullscreen mode. Then use the Browser object's Request fullscreen action in your game. Finally, you must add the allowfullscreen attribute to the iframe tag like this:

<iframe src="http://www.mywebsite.com/mygame" allowfullscreen="true" width="600" height="400" />

You might also want to cover some vendor prefixes since it's a relatively new HTML5 feature:

<iframe src="http://www.mywebsite.com/mygame" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" msallowfullscreen="true" width="600" height="400" />

With all that in place, your iframed game should now be able to "break out" in to full screen mode!

---------------------------------------------------------

But the exported html5 doesnt break out to fullscreen. It just stays within the iframe.

The link to html with iframe setting is as follows -

actualconcepts.com/TestTC/testFullscreen2

The link to capx is -

dl.dropboxusercontent.com/u/28297064/iFrame-Breakout%20Test.capx

Is this a bug or am I doing something wrong?

Browsers affected:

Chrome: yes

Firefox: yes

Internet Explorer: yes

Operating system & service pack:

Construct 2 version: 158 stable release

I have a bunch of games made with C2, that are wrapped in a single App using phonegap/cordova jar. My problem is that in Offline mode, while each of the game is offline cache enabled, but when I come out of a particular game and try to go into another game (all in offline mode) that are within the same App, then it doesnt pick up the other game...It just stays on the previous one. What should I do in the phonegap/cordova wrapper that will enable the browser to pick up each of the games that I click in offline mode to use cached files...

Please help!

thanks,

Ravindra

I use cordova/phonegap to bundle multiple Construct 2 HTML5 exported games. The main page displays the list of games from which user can make a selection. The launch page ( next page) has a header,footer and a target iframe in-between them to invoke the selected game from the main page. Until r139, the games exported using this method worked fine without canvas re-sizing after I modified my index.html canvas resize section with the following code -

          // Size the canvas to fill the browser viewport.

          if( /android/i.test(navigator.userAgent) )

          { jQuery(window).resize(function() {

          cr_sizeCanvas(jQuery(window).width(), jQuery(window).height());

          });

           }

However from r142 onwards I started facing issue with this canvas resize even with / without the above code. Basically the game after the launch tries to resize beyond the footer ( and the div of the iframe). Could you please help? I am not sure if this is a bug from r142 onwards or something else but it is causing me a big problem....

thanks,

Ravindra

Hi Septeven,

I am doing a Flashcards Application that will be hosted on my Webserver but the app will be accessed by students/teachers on an Educational App site (this is what I called 3rd party, i meant that which is not mine). I have designed the App to use dropbox plugin and got an approval from dropbox as well. So there is no security issue with the site as such because I have seen similar Apps running on this site which open the cloud storage access like googledrive, dropbox etc., in a separate new window. But in our case, the dropbox plugin tries to open the dropbox access page in the same page as the App ( and this App is running in a iframe api given by the Educational site). I think that is where I am totally struck now...Any tiny piece of code or Quick fix that will help to open the dropbox access page in a new browser window will be immensely helpful...Request you to please suggest or if possible do this change if its a small one at the earliest. I really appreciate the help.

I am also thinking if there is a way to use the C2 inbuilt browser object to open a new window and somehow access the dropbox OAuth from that and upon being successful, the C2 App will start? Is that a possibility? Please suggest any other quick fix that you might be aware of.

Thank you.

OR even if the dropbox OAuth page opens in a new tab of the browser, the problem could be solved, in my opinion. The problem is happening because the dropbox OAuth is trying to load in the same page as the App. Any clue as to what can be done to open the dropbox authorization page in a new tab of the browser?

Hi Septeven, I think if there is a way to do the Dropbox OAuth flow within an iframe, probably that could solve the problem. Do you think that is possible to modify in the plugin?

Thank you.

Septeven, I have built an App using the dropbox plugin, however when I try to run this App from a 3rd party site, then it throws an error in chrome browser saying -

Refused to display 'https://www.dropbox.com/1/oauth/authorize?oauth_callback=https%3A%2F%2Fwww.�s%2Findex.php%23%3F_dropboxjs_scope%3Ddefault&oauth_token=********' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

Any idea how I can get around this? It will be very helpful for me as I have almost built the entire application using the plugin and now this error will not make me upload my App to this site for all the work that I have done. Please help. Thanks a lot.

Anyone who could please help on my question below....

I am using this Hashtable plugin. I have some data stored in the hashtable something like this -

{"Q1":"first question - what are the things present here?",

"A1":"first answer,

"Q2":"second q",

"A2":"second a",

"Q3":"third question",

"A3":"third answer"}

Where my keystring is Q1, A1 and so on...However when I remove keystring and corresponding values of say Q2,A2, then I need to change Q3 to Q2, A3 to A2 and so on...Any idea how do I achieve this without going through the entire hashtable again?

Please let me know.