Advertisement
Guest User

Tilemap/camera issue

a guest
Jan 29th, 2016
156
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var game = new Phaser.Game(192, 144, Phaser.CANVAS, 'phaser', { preload: preload, create: create, update: update, render: render });
  2.  
  3. function preload() {
  4.     game.load.image('bg', 'assets/background.png');
  5.     game.load.image('ground', 'assets/ground.png');
  6.     game.load.image('mrPixel', 'assets/mrPixel.png');
  7.     game.load.image('mrMan', 'assets/mrMan.png');
  8.     game.load.image('spike', 'assets/spike.png');
  9.     game.load.image('spike_flipped', 'assets/spike_flipped.png');
  10.     game.load.image('dialogBox', 'assets/dialogBox_1.png');
  11.     game.load.image('dialogBox2', 'assets/dialogBox_2.png');
  12.     game.load.image('dialogBox3', 'assets/dialogBox_3.png');
  13.     game.load.tilemap('level_1', 'assets/tilemaps/level_1.json', null, Phaser.Tilemap.TILED_JSON);
  14.  
  15.  
  16. }
  17.  
  18. var pixelwidth = 0;
  19. var pixelheight = 0;
  20. var runOnce = 0;
  21. var dialogStarted = true;
  22. var cursors;
  23. var gravityKey;
  24. var mrPixel;
  25. var mrManGroup;
  26. var mrMan;
  27. var cameraPos = new Phaser.Point(0, 0);
  28.  
  29. function create() {
  30.     game.stage.backgroundColor = '#DDDDDD';
  31.     game.world.setBounds(0, 0, 384, 288);
  32.  
  33.     fixScaling();
  34.     tilemaps();
  35.     character();
  36.     createObject();
  37.     enablePhysics();
  38.     game.camera.roundPx = true;
  39.     game.renderer.renderSession.roundPixels = true;
  40.     //cameraPos.setTo(mrPixel.x, mrPixel.y);
  41.     game.camera.follow(mrPixel);
  42. }
  43.  
  44. function update() {
  45.     updateDialog();
  46.     //updateCamera();
  47.     moveCharacter();
  48.     game.physics.arcade.collide(mrPixel, blockedLayer);
  49.     game.physics.arcade.overlap(mrPixel, mrManGroup, startDialog, null, this);
  50.     game.physics.arcade.overlap(mrPixel, killerGroup, respawn, null, this);
  51.     gravityFunction();
  52. }
  53.  
  54. function render() {
  55.     pixelcontext.drawImage(game.canvas, 0, 0, 192, 144, 0, 0, pixelwidth, pixelheight);
  56. }
  57.  
  58. function fixScaling() {
  59.     var pixelCanvas = document.getElementById("pixel");    
  60.     pixelcontext = pixelCanvas.getContext("2d");    
  61.     pixelwidth = pixelCanvas.width;    
  62.     pixelheight = pixelCanvas.height;    
  63.     Phaser.Canvas.setSmoothingEnabled(pixelcontext, false);
  64. }
  65.  
  66. function tilemaps() {
  67.  
  68.     map = game.add.tilemap('level_1');
  69.     map.addTilesetImage('background', 'bg');
  70.     map.addTilesetImage('ground', 'ground');
  71.     backgroundLayer = map.createLayer('backgroundLayer');
  72.     blockedLayer = map.createLayer('blockedLayer');
  73.    
  74.     map.setCollisionBetween(1, 100000, true, 'blockedLayer');
  75.  
  76.     backgroundLayer.scrollFactorX = 0.50;
  77.     backgroundLayer.scrollFactorY = 0.50;
  78. }
  79.  
  80. function character() {
  81.     cursors = game.input.keyboard.createCursorKeys();
  82.     gravityKey = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
  83.     mrPixel = game.add.sprite(25, 25, 'mrPixel');
  84.     mrPixel.anchor.setTo(0.5, 0.5);
  85. }
  86.  
  87. function updateCamera() {
  88.     var lerp = 0.05;
  89.     cameraPos.x += (mrPixel.x - cameraPos.x) * lerp;
  90.     cameraPos.y += (mrPixel.y - cameraPos.y) * lerp;
  91.        
  92.     game.camera.focusOnXY(cameraPos.x, cameraPos.y);
  93. }
  94.  
  95. function enablePhysics() {
  96.     game.physics.startSystem(Phaser.Physics.ARCADE);
  97.     game.physics.arcade.enable([mrPixel]);
  98.  
  99.     game.physics.arcade.gravity.y = 800;
  100.  
  101.     mrPixel.body.enable = true;
  102. }
  103.  
  104. function moveCharacter() {
  105.     if (runOnce == 0) {
  106.         if (cursors.left.isDown) {
  107.             mrPixel.body.x -= 1;
  108.         } else if (cursors.right.isDown) {
  109.             mrPixel.body.x += 1;
  110.         }
  111.  
  112.         game.camera.focusOnXY(mrPixel.x, mrPixel.y);
  113.     }
  114. }
  115.  
  116. function gravityFunction() {
  117.     if (runOnce == 0) {
  118.         if (gravityKey.isDown && mrPixel.body.blocked.down) {
  119.             game.physics.arcade.gravity.y = -800;
  120.         }
  121.            
  122.         if (gravityKey.isDown && mrPixel.body.blocked.up) {
  123.             game.physics.arcade.gravity.y = 800;
  124.         }
  125.     }
  126. }
  127.  
  128. function createObject() {
  129.     mrManGroup = game.add.group();
  130.     mrManGroup.enableBody = true;
  131.     map.createFromObjects('objectLayer', 1730, 'mrMan', 0, true, false, mrManGroup);
  132.     mrManGroup.forEach(function(mrMan){
  133.         mrMan.body.allowGravity = false;
  134.         mrMan.anchor.setTo(0.5, 0);
  135.         mrMan.body.setSize(32, 8);    
  136.         mrMan.body.immovable = true;
  137.     });
  138.  
  139.     killerGroup = game.add.group();
  140.     killerGroup.enableBody = true;
  141.     map.createFromObjects('objectLayer', 1731, 'spike', 0, true, false, killerGroup);
  142.     map.createFromObjects('objectLayer', 1732, 'spike_flipped', 1, true, false, killerGroup);
  143.     killerGroup.forEach(function(spike){
  144.         spike.body.allowGravity = false;
  145.         spike.body.immovable = true;
  146.     });
  147. }
  148.  
  149. function updateDialog() {
  150.     if (runOnce == 1) {
  151.         dialogBox = game.add.sprite(96, 165, 'dialogBox');
  152.         dialogBox.anchor.setTo(0.5, 0.5);
  153.         dialogBox.fixedToCamera = true;
  154.         game.add.tween(dialogBox.cameraOffset).to( { y: 125 }, 0, Phaser.Easing.Back.In, true);
  155.         runOnce = 2;
  156.     } else if (runOnce == 2) {
  157.         if (gravityKey.isDown && runOnce == 2) {
  158.             dialogBox.destroy();
  159.             dialogBox = game.add.sprite(96, 125, 'dialogBox2');
  160.             dialogBox.anchor.setTo(0.5, 0.5);
  161.             dialogBox.fixedToCamera = true;
  162.             game.time.events.add(Phaser.Timer.SECOND * 4, removeDialog, this);
  163.             runOnce = 3;
  164.         }
  165.     }
  166. }
  167.  
  168. function removeDialog() {
  169.     runOnce = 0;
  170.     dialogBox.destroy();
  171.     dialogBox = game.add.sprite(96, 125, 'dialogBox3');
  172.     dialogBox.anchor.setTo(0.5, 0.5);
  173.     dialogBox.fixedToCamera = true;
  174.     game.add.tween(dialogBox).to( { alpha: 0 }, 3500, Phaser.Easing.Linear.None, true);
  175. }
  176.  
  177. function startDialog() {
  178.     if (dialogStarted) {
  179.         runOnce = 1;
  180.         dialogStarted = false;
  181.     }
  182. }
  183.  
  184. function respawn() {
  185.     mrPixel.x = 25;
  186.     mrPixel.y = 25;
  187. }
  188. /*function findObjects (type, map, layer) {
  189.     var result = new Array();
  190.     map.objects[layer].forEach(function(element){
  191.         if(element.properties.type === type) {
  192.             element.y -= map.tileHeight;
  193.             result.push(element);
  194.         }      
  195.     });
  196.     return result;
  197. }
  198.  
  199. function createSprite (element, group) {
  200.     var sprite = group.create(element.x, element.y, element.properties.sprite);
  201.     Object.keys(element.properties).forEach(function(key){
  202.         sprite[key] = element.properties[key];
  203.     });
  204. }
  205.  
  206. function createObjects() {
  207.     //create items
  208.     mrManGroup = game.add.group();
  209.     mrManGroup.enableBody = true;
  210.     result = findObjects('dialog_1', map, 'objectLayer');
  211.     result.forEach(function(element){
  212.         createSprite(element, mrManGroup);
  213.     });
  214. }*/
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement