Yanifska Posted April 7, 2015 Share Posted April 7, 2015 Hi there,I understand from previous posts that using the fullscreen API would help in hiding the address bar in some browsers, especially in chrome (ios & Android).However I haven't been able to use it at all.Could someone share a piece of code or help in any ways with that thanks !I have been searching in google and tried a few option but nothing worked for me. Thank you a lotYaniv Link to comment Share on other sites More sharing options...
Yanifska Posted April 7, 2015 Author Share Posted April 7, 2015 this piece of code will make the game full screen on chrome desktop, but not iOS or Android var goFS = document.getElementById("game"); goFS.addEventListener("click", function() { var doc = window.document; var docEl = doc.documentElement; var requestFullScreen = docEl.requestFullscreen || docEl.mozRequestFullScreen || docEl.webkitRequestFullScreen || docEl.msRequestFullscreen; var cancelFullScreen = doc.exitFullscreen || doc.mozCancelFullScreen || doc.webkitExitFullscreen || doc.msExitFullscreen; if(!doc.fullscreenElement && !doc.mozFullScreenElement && !doc.webkitFullscreenElement && !doc.msFullscreenElement) { requestFullScreen.call(docEl); } else { cancelFullScreen.call(doc); } }, false); Link to comment Share on other sites More sharing options...
enpu Posted April 7, 2015 Share Posted April 7, 2015 Try to addEventListener for touchstart Link to comment Share on other sites More sharing options...
Yanifska Posted April 7, 2015 Author Share Posted April 7, 2015 thanks a lot, but it doesnt seems to help.I just changed "click" with "touchstart", is that what you meant ? Link to comment Share on other sites More sharing options...
Yanifska Posted April 12, 2015 Author Share Posted April 12, 2015 Anyone knows how to start a game in fullscreen mode on Chrome iOs or Android ? Link to comment Share on other sites More sharing options...
AlanSmithee Posted April 13, 2015 Share Posted April 13, 2015 Anyone knows how to start a game in fullscreen mode on Chrome iOs or Android ? I do not think this is possible. Unlike an app, a webpage using the FullScreenApi (not available on IOs AFAIK), cannot be started in fullscreen because of security reasons.Instead you must listen for some kind of input event and then trigger the fullscreen mode. I recommend reading A Guide to the Phaser Scale Manager by Richard Davey.It is available for downloading for free (or paying any amount you like). Pages 24 to 26 talks about using fullscreen mode. Yanifska 1 Link to comment Share on other sites More sharing options...
Yanifska Posted April 13, 2015 Author Share Posted April 13, 2015 thank you a lot man,I'd love to see a "real world example" if you know of any Link to comment Share on other sites More sharing options...
AlanSmithee Posted April 14, 2015 Share Posted April 14, 2015 Sorry, I don't, but I think there is one or more example(s) provided in that book. Also here Link to comment Share on other sites More sharing options...
Yanifska Posted April 15, 2015 Author Share Posted April 15, 2015 Oh , I missed that one ! Link to comment Share on other sites More sharing options...
Yanifska Posted April 26, 2015 Author Share Posted April 26, 2015 I do not think this is possible. Unlike an app, a webpage using the FullScreenApi (not available on IOs AFAIK), cannot be started in fullscreen because of security reasons.Instead you must listen for some kind of input event and then trigger the fullscreen mode. I recommend reading A Guide to the Phaser Scale Manager by Richard Davey.It is available for downloading for free (or paying any amount you like). Pages 24 to 26 talks about using fullscreen mode. Hey it was so easy with this !Thank you a lot.Now I need to resize the game when the game goes full screen.My resize code is not working as expected. Currently the game goes full screen when you click on the game title and then it moves to the game State.however the resize code I added doesnt work.It will work only if it is placed in the update function of the game state ( I tried placing it into the create function of the game State)wierd.... Also I guess I need to add a full screen button in the game itself, so the user can go back to the full screen mode if he leaves the game and come back, for example. Link to comment Share on other sites More sharing options...
Yanifska Posted April 26, 2015 Author Share Posted April 26, 2015 Finally I added a button inside the game, showing up only if the the browser has the fullscreen api.When the button is pressed the fullscreen function is called.Then when the full screenchange event is catched, a 1s timer will run the resize codeI had to use the timer because the resize code would not work immediately when the onscreen change event is fired. // the button is added in the create functionif(!game.device.desktop && game.scale.compatibility.supportsFullScreen){fullscreenBtn = game.add.sprite(0, 0, 'uimenu',4);fullscreenBtn.anchor.x = 0.5;fullscreenBtn.fixedToCamera = true;fullscreenBtn.cameraOffset.setTo(game.width*0.5, 20);fullscreenBtn.updateTransform();fullscreenBtn.inputEnabled = true;fullscreenBtn.events.onInputDown.add(goFullScreen,this);}function goFullScreen(){ game.scale.startFullScreen();}function fullscreenChange(){console.log("resizing");game.time.events.add(Phaser.Timer.SECOND * 1, function() { console.log("resized");var gameWidth2 = Math.max(window.innerWidth* window.devicePixelRatio, window.innerHeight* window.devicePixelRatio); var gameHeight2 = Math.min(window.innerWidth* window.devicePixelRatio, window.innerHeight* window.devicePixelRatio); var ratio2 = gameHeight2 / 640; gameWidth2 /= ratio2; gameHeight2 /= ratio2; game.scale.setGameSize(gameWidth2, gameHeight2);if (game.scale.isFullScreen) {fullscreenBtn.visible = false;}else{fullscreenBtn.visible = true;}}, this);}I hope it can help any one.Any feedback is appreciated. EDIT: oh and don't forget in the boot state :this.game.scale.fullScreenScaleMode = Phaser.ScaleManager.SHOW_ALL;I didn't specify a target, it messed up the display on some device (I probably made a mistake somewhere.) Anyway it seems to work for now.I will update if I get more insight on this. MichaelD 1 Link to comment Share on other sites More sharing options...
Recommended Posts