I posted this previously to the Beginner's Forum and posting again here in case I can get a more complete answer. Here is my original post to the Beginner's Forum:
I'm not sure if this is a beginner's question but I got my last question answered here so I'm posting again. I have multiple Construct 2 .capx files being used on a website. On the server, the sizes of the windows should be the same but are not. I have attached to this post two .capxs and a .zip file with three screenshots to illustrate the problem. The first .capx is for something called "Word Wizard World." If you look in the .capx you will see that the window is set to be 640x480. A screenshot (found in the .zip file) of Word Wizard World has been included so you can see what it looks like on the server in Chrome. The second .capx is for something called "Hall of Fame." If you look in the .capx you will see that the window here is also set to be 640x480. Two screenshots (found in the .zip file) have been provided for Hall of Fame on the server in Chrome because, for some reason, the Hall of Fame does not fit entirely on the screen. You need to scroll down to see everything. The first screenshot is what you see when you first enter the "Hall of Fame." The second screenshot is what you see after scrolling down to the bottom. Note that I am aware that there is nothing particularly meaningful below what can be seen initially. However, this problem exists as well in some of my other .capxs when viewed on the server in Chrome. Also, there may be a time in the future when there -will- be useful information that can't be seen without scrolling down and I'd like to resolve this problem once and for all. Or, at the very least, determine that the problem is -not- with the .capxs in question.
Further to what I originally posted that is quoted above:
If either .capx is viewed in Preview mode locally, the layouts will take up the full screen (w/o the blue border...that gets added via further CSS on the server) and be centered and not require any scrolling in order to get to the bottom. I have tried this in both IE and Chrome. I have further edited the CSS being applied on the server to make the original canvas dimensions too big or too small and, in all cases when viewed in Chrome, the final canvas dimensions are too big for "Hall of Fame" (hence the scrolling to the bottom) and just right for "Word Wizard World." This suggests to my amateur-ish eyes that the problem is with whatever CSS is being generated in the minified .js file. I've also tried viewing the .js file unminified but there is way too much code for me to try and wrap my mind around. If anybody thinks that the problem may exist there and knows enough about it to look into it, I can include it in a future post. Of course, if that is the problem, surely it should be present in both "Word Wizard World" and "Hall of Fame" instead of just "Hall of Fame."
I downloaded everything and took a look and they seem to work fine. I tested on Chrome, IE, Firefox, and Opera.
However, I had to disable the calls for the information it's loading from the web addresses because, there's no content and it causes an error in the bowsers and after closing the error message, the web page exhibits a 404 error. Even at that point the game pages load perfectly before the 404 error.
I strongly suspect it has something to with how the data is supposed to load from the external source, that's causing the problem. I would focus on that since you handle things differently in each game. Pretty sure that's where the issue is but with the addition of the CSS info and not being able to see the data load it's hard to make a true comparison. Clearly it works fine until the data loads from the external source.
Hope this helps.
Thank you for your response. The data is loaded via PHP calls to a MySQL database. No formatting occurs during the collection of the data so I'm not sure how my method of acquiring the data could cause a different kind of formatting. If it helps, the PHP is being handled via the CodeIgniter MVC system. If you know of how loading the data could cause such effects on the CSS I would be most appreciative. Otherwise, I must continue to conclude that something is wrong with the .js file...barring any other suggestions as to what might be causing this display issue.
Develop games in your browser. Powerful, performant & highly capable.
As I said I'm not seeing the problem occur, so it's difficult to understand what's causing it. You might try a little redundancy by using the browser object to request full screen - Stretch (letterbox scale) "on start of layout and / or "on any touch" and see if it sets it back to the appropriate letterbox scale.
Thank you for your follow-up. I tried both options with no success. Doing the request full screen on start of layout (I placed it right after the AJAX call on the Event Sheet) had no effect on the dimensions of the canvas. I also added the on any touch option and that caused the canvas to go full screen when I clicked on it. This is a problem because, in full screen mode, you can't see your account information that is otherwise displayed above the canvas as seen in the original screenshots. Furthermore, when reverting from full screen back to the normal display, the canvas reverted to being as too big as it was before the on touch full screen.