AminBenali Posted March 9, 2016 Share Posted March 9, 2016 Hello devs! Im just started working on a project using pharser. I have a issue. I want to have a corridor where i you have to avoid approaching obstacles. So i decided to make 3 different camera views. Left, middle and right and link them to 3 lanes. Lane0 (left), Lane1 (middle), Lane3(Right). Only the thing is the camera width and height are 1320x732,5 . I want the lane to say 0,1 or 2 if the camera.position or view(this is what confuses me.) is equal a position. Because the camerInfo renders view and position info on the screen. I will add some screenshots and the code that im using. <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Minigame - 1 Jaguar/Landrover</title> <script src="//cdn.jsdelivr.net/phaser/2.2.2/phaser.min.js"></script> <style type="text/css"> body { margin: 0; margin-left: 15%; margin-top: 10%; } </style> </head> <body> <script type="text/javascript"> var game = new Phaser.Game(1320, 742.5, Phaser.AUTO, '', {preload: preload, create: create, update: update, render: render }); function preload() { game.load.image('sky', 'assets/sky.png'); game.load.image ('bg', 'assets/proto-bg.png'); game.load.image('ground', 'assets/platform.png'); game.load.image('star', 'assets/star.png'); game.load.spritesheet('dude', 'assets/dude.png', 32, 48); } var card; var cursors; var moving = 0; var lane = 0; function create() { // Make the world larger than the actual canvas game.world.setBounds(0, 0, 3840, 2160); // We're going to be using physics, so enable the Arcade Physics system game.physics.startSystem(Phaser.Physics.ARCADE); // A simple background for our game game.add.sprite(0,0, 'bg'); // World boundaries game.world.setBounds(0, 0, 1920, 1920); // Our controls. cursors = game.input.keyboard.createCursorKeys(); // Camera start position set game.camera.setPosition(300,275); } function update() { // Moving camera if (moving === 0) { if (cursors.left.isDown) { game.camera.x -= 300; } else if (cursors.right.isDown) { game.camera.x += 300; } } //TODO Configure // Lanes if(game.camera.x < 300) { lane = 1; } else if(game.camera.x > 300 && camera.x < 600) { lane = 2; } else if(game.camera.x >= 600) { lane = 3; } } function render() { game.debug.cameraInfo(game.camera, 32, 32); game.debug.text("Lane: " + lane, 32, 132); } </script> </body> </html> Link to comment Share on other sites More sharing options...
drhayes Posted March 9, 2016 Share Posted March 9, 2016 I'm pretty sure you want camera.view. From the docs: " The x/y values are in world coordinates, not screen coordinates, the width/height is how many pixels to render." Watch out with that control scheme: update gets called really fast, so it might make it hard to sit in the middle lane. Link to comment Share on other sites More sharing options...
AminBenali Posted March 21, 2016 Author Share Posted March 21, 2016 @drhayes Can you maybe help me with the control scheme. How can I fix this issue because now its almost impossible to stay in the middle lane. Im looking for something like a delay. But didn't find a solution yet! Your help will be very appreciated! Link to comment Share on other sites More sharing options...
drhayes Posted March 21, 2016 Share Posted March 21, 2016 Sure. You could assign each lane to a key. Hitting 1 goes to the left, 2 to the middle, 3 to the right. Or left arrow is left, up arrow is middle, right arrow is right. Or you could make it so hitting left moves you left: right, middle, left, Then hitting right moves you right: left, middle, right. You should look into "debouncing" the signal. Either that, or make a flag that is set the first time the key goes down and isn't cleared until the key goes up, so you only check it once. Or use Phaser.Key.onDown.addOnce and re-attach the signal handler in the onUp. Or something like that. Link to comment Share on other sites More sharing options...
Recommended Posts