Jump to content
This forum will be closing down. Please move to the respective dedicated project forums.

Cocoon + phaser fullscreen need explanation


espace
 Share

Recommended Posts

resolved my self 

<div id="game-area"></div> get the Canvas of the game. i must put something else...

so i write in my index.html

<html>
	<head>
		<title>title of the game</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="chrome=1, IE=9">
		<meta name="format-detection" content="telephone=no">
		<meta name="HandheldFriendly" content="true" />
		<meta name="robots" content="noindex,nofollow" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="apple-mobile-web-app-title" content="Phaser App">

		<script src="phaser.min.js"></script>
		<script src="src/main.js"></script>
		<link rel="stylesheet" type="text/css" href="style.css">

	</head>
	<body>
<div id="game-aera"></div>
	</body>
</html>

and in the css.file in my example style.css i put reference to my Canvas > game-area, i put a the same color from my background-game to not see a border. specify also the position top :0 left 0 

body {
	padding: 0; margin: 0;
}

html, body { width:100%; height:100%; } /* just to be sure these are full screen*/
 
#game-area { display:block; } /* To remove the scrollbars */

#game-area {
	margin: auto;
	display: table;
	background: #250f2e;
}
div {
    position: absolute;
    top: 0px;
    left: 0px;
}

and i my main.js, the important thing is  : 

        this.game.width=window.innerWidth
        this.game.height=window.innerHeight

it's the same than 

     canvas.width = window.innerWidth;
     canvas.height = window.innerHeight;

because   game is a refence to Canvas in :game = new Phaser.Game(1280,1920,Phaser.CANVAS,'game' )

				this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL
				this.game.width=window.innerWidth
				this.game.height=window.innerHeight
				this.scale.pageAlignHorizontally = true
				this.scale.pageAlignVertically = true
				this.scale.refresh()
......

		game = new Phaser.Game(1280,1920,Phaser.CANVAS,'game' )
		game.state.add('boot',bootstate)
		game.state.add('preload',preloadstate)
		game.state.add('game_first_screen',game_first_screen)
		game.state.add('game_state',game_state)
		game.state.start('boot',bootstate)

hope it help someone. and i hope that i don't say stupid things ;) in my case all is ok in my cocoon's project.

 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...