Search the Community

Showing results for tags 'game'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 643 results

  1. I'm developing a simple game application using BabylonJS engine where I want to move the body parts of a human 3D avatar by using UI controllers. The application runs smoothly on the computer. Then I created an IOS application using phonegap and tried to run it on an Ipad. But it is really slow when it run on the mobile environment. Is there any mechanism to optimize the game to support the mobile environment other than reducing the quality of the 3D model.
  2. Phaser Game Lag In Mobile

    Hi, I am new to phaser as well as game designing. I created my first game as hobby using phaser. it is working fine in desktop but lags very bad on mobile devices. Images I am using for game is very small. game is smaller that 2mb. I am attaching my main.js file hope someone can help me. thanks var buttetSpwanSpeed; var bulletSpeed; var enemySpwanSpeed; var enemySpeed; var golis; var enemies; var enemyLoop; var scoreText; var powers; var bulletSize; setStart(); //game phaser var game=new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.CANVAS,"gamearea"); var BootState={ //loding accets preload: function(){ this.load.image('LodingScreen', 'assets/desimulga.png'); this.load.image('background', 'assets/blue.png'); }, create: function(){ game.state.start("LoadingState"); }, }; var LoadingState={ //loding acc preload: function(){ bg=this.game.add.tileSprite(0,0,600,300,'background'); bg.height = game.height; bg.width = game.width; LodingScreen=this.game.add.sprite(this.game.world.centerX,this.game.world.centerY,'LodingScreen'); LodingScreen.anchor.setTo(0.5); LodingScreen.scale.setTo(0.5,0.5); this.load.image('spaceship', 'assets/player.png'); this.load.image('goli', 'assets/bullet.png'); //load ememies this.load.image('enemy1', 'assets/enemies/enemy1.png'); this.load.image('enemy2', 'assets/enemies/enemy2.png'); this.load.image('enemy3', 'assets/enemies/enemy3.png'); this.load.image('enemy4', 'assets/enemies/enemy4.png'); this.load.image('enemy5', 'assets/enemies/enemy5.png'); this.load.spritesheet('power1', 'assets/power/bulletUp.png',34,33,4); this.load.image('restart', 'assets/restart.png'); this.load.spritesheet('blast', 'assets/explosion.png',400,400,8); game.load.audio('fire', 'assets/music/bullet.mp3'); game.load.audio('killed', 'assets/music/killed.mp3'); //game.load.audio('bg_music', 'assets/music/background.mp3'); game.load.audio('death_music', 'assets/music/death.mp3'); game.load.audio('start_music', 'assets/music/start.mp3'); }, create: function(){ game.time.events.add(Phaser.Timer.SECOND * 2, function(){ bg.kill(); LodingScreen.kill(); game.state.start("PreGameState"); },this); }, }; var PreGameState={ //loding accets create: function(){ game.scale.refresh(); bg=this.game.add.tileSprite(0,0,600,300,'background'); bg.height = game.height; bg.width = game.width; Startb=this.game.add.text(this.game.world.centerX,this.game.world.centerY, 'TAP TO START' , { fontSize: '32px', fill: 'yellow' }); Startb.anchor.setTo(0.5); Startb.scale.setTo(0.5,0.5); ship=this.game.add.sprite(this.game.world.centerX,this.game.world.height*0.4,'spaceship'); ship.scale.setTo(0.4); ship.anchor.setTo(0.5); game.physics.arcade.enable(ship); bg.inputEnabled=true; start_music = game.add.audio('start_music'); start_music.allowMultiple = true; start_music.addMarker('start_music', 0, 30); bg.events.onInputDown.add(function(){ bg.inputEnabled=false; Startb.kill(); start_music.play("start_music"); // game.physics.arcade.moveToXY(ship, this.game.world.centerX, this.game.world.height*0.8, 300, 3000); // game.add.tween(ship).to( { y: game.world.height*0.8 }, 3000, Phaser.Easing.Sinusoidal.InOut, true); var tween = game.add.tween(ship).to({ x: [this.game.world.centerX, this.game.world.width*0, this.game.world.width, this.game.world.centerX], y: [this.game.world.height*0.4, this.game.world.height*0.5, this.game.world.height*0.6, this.game.world.height*0.8], }, 2000,Phaser.Easing.Quadratic.Out, true).interpolation(function(v, k){ return Phaser.Math.bezierInterpolation(v, k); }); game.time.events.add(Phaser.Timer.SECOND * 2, function() { bg.kill(); ship.kill(); game.state.start("GameState"); } ,this); }, this); }, }; var GameState={ //loding accets preload: function(){ }, create: function(){ //background this.background=this.game.add.tileSprite(0,0,600,300,'background'); this.background.height = game.height; this.background.width = game.width; this.background.inputEnabled=true; this.background.input.enableDrag(true); this.background.input.startDrag = function(pointer) { pointer.shipStart = new Phaser.Point(GameState.ship.x, GameState.ship.y); Phaser.InputHandler.prototype.startDrag.call(this, pointer); }; this.background.input.updateDrag = function(pointer) { GameState.ship.x = pointer.shipStart.x - pointer.positionDown.x + pointer.x; GameState.ship.y = pointer.shipStart.y - pointer.positionDown.y + pointer.y; GameState.background.x=0; GameState.background.y=0; }; //ship this.ship=this.game.add.sprite(this.game.world.centerX,this.game.world.height*0.8,'spaceship'); this.ship.scale.setTo(0.4); this.ship.anchor.setTo(0.5); game.physics.arcade.enable(this.ship); // this.ship.inputEnabled=true; // this.ship.input.enableDrag(true); //score this.scoreText = this.game.add.text(16, 16, 'Kills: 0', { fontSize: '32px', fill: '#fff' }); //background Music // music = game.add.audio('bg_music'); //music.play('', 0, 1, true); //bullet sound bullet_sound = game.add.audio('fire'); bullet_sound.allowMultiple = true; bullet_sound.volume=0.5; bullet_sound.addMarker('fire', 0, 0.5); //Killed sound killed_sound = game.add.audio('killed'); killed_sound.allowMultiple = true; killed_sound.addMarker('killed', 0, 0.5); //death music death_music = game.add.audio('death_music'); death_music.allowMultiple = true; death_music.addMarker('death_music', 0, 10); //groups of bullets and enemies golis=game.add.group(); enemies=game.add.group(); powers=game.add.group(); //fire bullet loop fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/buttetSpwanSpeed, fireBullet, this); //this.game.input.onTap.add(fireBullet, this); //create ememy loop enemyLoop=game.time.events.loop(Phaser.Timer.SECOND*1/enemySpwanSpeed, createEnemy, this); //change ememy speed and enemy spwan speed loop enemySpeedLoop=game.time.events.loop(Phaser.Timer.SECOND*1.5, changeEnemySpeed, this); //give powerup powerUp=game.time.events.loop(Phaser.Timer.SECOND*20, powerFun, this); }, update: function(){ //scrolling background this.background.tilePosition.y+=2; //keybord control if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) { this.ship.y-=2; } if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { this.ship.y+=2; } if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { this.ship.x+=2; } if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { this.ship.x-=2; } //dont go out if(this.ship.y<0+this.ship.height/2) { this.ship.y=0+this.ship.height/2; } if(this.ship.y>this.game.world.height-this.ship.height/2) { this.ship.y=this.game.world.height-this.ship.height/2; } if(this.ship.x<0+this.ship.width/2) { this.ship.x=0+this.ship.width/2; } if(this.ship.x>this.game.world.width-this.ship.width/2) { this.ship.x=this.game.world.width-this.ship.width/2; } //check for collisions game.physics.arcade.overlap(golis,enemies,b_e_collide,null,this); game.physics.arcade.overlap(this.ship,enemies,s_e_collide,null,this); game.physics.arcade.overlap(this.ship,powers,s_power1_collide,null,this); }, }; //setting start game conditions function setStart(){ buttetSpwanSpeed=2; bulletSpeed=2000; enemySpwanSpeed=1; enemySpeed=300; score=0; bulletSize=1.2 } //fire bullet function function fireBullet(){ goli=this.game.add.sprite(this.ship.x,this.ship.y-this.ship.height/2,'goli'); goli.anchor.setTo(0.5); goli.scale.setTo(bulletSize,1); goli.checkWorldBounds = true; goli.outOfBoundsKill = true; //adding to group golis.add(goli); game.world.moveDown(goli); game.physics.arcade.enable(goli); goli.body.collisonWorldBounds=true; goli.body.velocity.y=-bulletSpeed; bullet_sound.play("fire"); } //create enemy function function createEnemy(){ enemyNo=game.rnd.integerInRange(1, 5); x1=game.rnd.integerInRange(0,this.game.world.width); x2=game.rnd.integerInRange(0,this.game.world.width); enemy=this.game.add.sprite(x1,10,'enemy'+enemyNo); enemy.anchor.setTo(0.5); enemy.scale.setTo(0.4); enemy.checkWorldBounds = true; enemies.add(enemy); enemy.outOfBoundsKill = true; game.physics.arcade.enable(enemy); enemy.body.collisonWorldBounds=true; enemy.angle=90; enemy.no=enemyNo; //moving enemy angleRedian=game.physics.arcade.moveToXY(enemy, x2, this.game.world.height+enemy.height, enemySpeed,0); angleDegree=angleRedian*57.2958; enemy.angle=90+angleDegree; } //runs when bullet collide to enemy function b_e_collide(goli,enemy){ //blast blast=this.game.add.sprite(enemy.x,enemy.y,'blast'); blast.anchor.setTo(0.5); blast.scale.setTo(0.5); var explosion=blast.animations.add('explosion'); blast.animations.play('explosion',30,false,true); //killing goli.kill(); enemy.kill(); //update scores if(enemy.no<4) { score+=1; killed_sound.play('killed'); } this.scoreText.text = 'Kills: ' + score; } //runs when ship collide to enemy function s_e_collide(ship,enemy){ blast=this.game.add.sprite(enemy.x,enemy.y,'blast'); blast.anchor.setTo(0.5); blast.scale.setTo(0.5); var explosion=blast.animations.add('explosion'); blast.animations.play('explosion',10,false,true); ship.kill(); enemy.kill(); //music.stop(); this.scoreText.kill(); death_music.play("death_music"); game.time.events.remove(fireLoop); game.time.events.add(Phaser.Timer.SECOND * 2, function() { fianlScore = this.game.add.text(this.game.world.centerX,this.game.world.centerY, 'KILL: '+score, { fontSize: '32px', fill: 'yellow' }); fianlScore.anchor.setTo(0.5); gameOverText = this.game.add.text(this.game.world.centerX,this.game.world.centerY - fianlScore.height, 'GAME OVER', { fontSize: '32px', fill: 'red' }); gameOverText.anchor.setTo(0.5); //restart button restart=this.game.add.sprite(this.game.world.centerX,this.game.world.centerY + fianlScore.height+10,'restart'); restart.anchor.setTo(0.5); restart.scale.setTo(0.05,0.05); restart.inputEnabled = true; restart.events.onInputDown.add(restartGame, this); game.time.events.stop(); }, this); } //runs when ship collide power1 function s_power1_collide(ship,power){ power.kill(); game.time.events.remove(fireLoop); fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/10, fireBullet, this); game.time.events.add(Phaser.Timer.SECOND * 10, function(){ game.time.events.remove(fireLoop); fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/buttetSpwanSpeed, fireBullet, this); },this); } function changeEnemySpeed() { if(enemySpeed<=900) { enemySpeed+=5; } if(enemySpwanSpeed<=3) { enemySpwanSpeed+=0.025; } enemyLoop.delay=Phaser.Timer.SECOND*1/enemySpwanSpeed; } //send power up function powerFun() { x1=game.rnd.integerInRange(0,this.game.world.width); x2=game.rnd.integerInRange(0,this.game.world.width); power=this.game.add.sprite(x1,10,'power1'); power.anchor.setTo(0.5); var shine=power.animations.add('shine'); power.animations.play('shine',5,true,true); power.checkWorldBounds = true; power.outOfBoundsKill = true; powers.add(power); game.physics.arcade.enable(power); power.body.collisonWorldBounds=true; game.physics.arcade.moveToXY(power, x2, this.game.world.height+power.height, 400,0); powerDelay=game.rnd.integerInRange(20,35); powerUp.delay=Phaser.Timer.SECOND*powerDelay; } function restartGame(){ setStart(); game.time.events.start(); game.state.start("PreGameState"); } game.state.add("GameState",GameState); game.state.add("BootState",BootState); game.state.add("LoadingState",LoadingState); game.state.add("PreGameState",PreGameState); game.state.start("BootState"); main.js
  3. I am making a rpg that will have skills with complex movement like if I use my A skill my player will jump and then dash diagonally back to the ground. My problem is not knowing how to achieve this. I tried with making it move to the sky first and then coming back down but they combine and make him only move diagonally. My guess is using timers for it but I don't know where to start. Any help would be appreciates, even if it's not code, just a step by step on how can I accomplish this, I can figure something out later.
  4. Alien Invasion

    Hello everyone I'm creating a new game and I have the basics working. It would be really nice to hear what you think. The game is still under construction but you should be able to play the first level of each mission I am working on the next levels. It is still under construction but i hope to be able to create a fully working version. here is the link: https://sharesoft.nl/phaser/alienInvasion.php?language=en
  5. Hi Guys, Recently I was working on a tanks' battle simulator. It is strongly inspired by Robocode. In short, you program artificial intelligence of your tank and test it during the battle. Of course, you will need JavaScript skills to do that Please give it a try and let me know what do you think. All feedback is welcome http://jsbattle.jamro.net/
  6. Hello comrades, I'm new to phaser and I can't seem to create new objects to the group "capetinhas", even though I can load the sprite through game.add.sprite. Here's the code: var game = new Phaser.Game(448, 448, Phaser.AUTO, '', { preload: preload, create: create, update: update }); function preload () { game.load.image('tabuleiro','assets/tabuleiro.png') game.load.spritesheet('devil','assets/devil.png',32,32); var capetinhas; } function create (){ capetinhas = game.add.group(); game.add.sprite(window.width,0,'tabuleiro');//loading the background game.add.sprite(128,128,'devil'); // this works capetinhas.create(32,32,'devil'); // this doesnt } function update (){ } Any helpe would be really apreciated. Thanks in advance.
  7. Scaling an image down

    How do I scale, or resize, an image in javascript with phaser's framework? I have tried a few different things but they do not seem to be working. I am using a weapon method to throw a pokeball, this is just a test using some code from phaser.io, so the other images aren't mine, I am just testing to try and get the pokeball to be thrown, but it is freaking huge right now! Please help me, I need the pokeball to be about 10x10 px because my character is 64x64. var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { game.load.image('bullet', 'Pokeball.png', .01, .01); game.load.image('ship', 'tiles1.png'); } var sprite; var weapon; var cursors; var fireButton; function create() { // Creates 1 single bullet, using the 'bullet' graphic weapon = game.add.weapon(1, 'bullet'); weapon.scale.setTo(.5, .5); // The bullet will be automatically killed when it leaves the world bounds weapon.bulletKillType = Phaser.Weapon.KILL_WORLD_BOUNDS; // Because our bullet is drawn facing up, we need to offset its rotation: weapon.bulletAngleOffset = 90; // The speed at which the bullet is fired weapon.bulletSpeed = 400; sprite = this.add.sprite(320, 500, 'ship'); game.physics.arcade.enable(sprite); // Tell the Weapon to track the 'player' Sprite, offset by 14px horizontally, 0 vertically weapon.trackSprite(sprite, 14, 0); cursors = this.input.keyboard.createCursorKeys(); fireButton = this.input.keyboard.addKey(Phaser.KeyCode.SPACEBAR); } function update() { sprite.body.velocity.x = 0; if (cursors.left.isDown) { sprite.body.velocity.x = -200; } else if (cursors.right.isDown) { sprite.body.velocity.x = 200; } if (fireButton.isDown) { weapon.fire(); } } function render() { weapon.debug(); }
  8. I am trying to make a gate that opens when you click on it, and rotate it 90 degrees. I have accomplished this much, but how do I make it go back to it's original position once I click on it again? For instance: *clicks on gate, gate opens, 90 degrees.* *clicks on gate again, gate closes, -90 degrees from the 90 degrees that it went on previous click* Any help would be appreciated! html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Simple Canvas Game</title> <style> html { background: black } canvas { margin: auto; } </style> </head> <body> <script src="phaser.js"></script> <script src="game.js"></script> </body> </html> game.js var game = new Phaser.Game(550, 540, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { game.load.crossOrigin = 'anonymous'; game.load.image('gateopen', 'fenceleft.png'); } var sprite function clickSprite() { console.log("clickSprite"); sprite.angle += 90; } function clickGame() { console.log("clickGame"); } function create() { sprite = game.add.sprite(100, 100, 'gateopen'); sprite.anchor = {x: 1, y: 1} game.inputEnabled = true; sprite.inputEnabled = true; sprite.events.onInputDown.add(clickSprite) game.input.onDown.add(clickGame); } function update() { } function render() { game.debug.bodyInfo(sprite, 32, 32); game.debug.body(sprite); }
  9. Hi, I am trying to make a simple game and have been running into many problems. The problem I am facing now is that I cannot fix this error in my javascript. It says that it cannot read the 'setSize' property on my 'player' sprite, but it works perfectly fine on my other sprites. Next it says that it cannot read the 'velocity' property of the 'player' sprite, but when I comment out the 'setSize' property it works. I just cannot figure out what is wrong, have I misspelled something? I cannot seem to find the problem, so any help would be appreciated. Btw, it worked yesterday, but when I loaded it up today it was no longer working... Html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Simple Canvas Game</title> <link href="https://fonts.googleapis.com/css?family=Syncopate:700" rel="stylesheet"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> html { background: black } canvas { margin: auto; } h1 { font-family: 'Syncopate', sans-serif; color: rgb(194, 68, 91); text-align: center; margin: 0 auto; font-size: 25px; } h2 { color: white; font-size: 8px; font-family: 'Syncopate', sans-serif; } </style> </head> <body> <header> <h1>Crafty Heroes</h1> </header> <footer> <h2>&copy; SoulesteDesigns 2017</h2> </footer> <script src="phaser.js"></script> <script src="game.js"></script> </body> </html> game.js: // VARIABLES // variables for static objects var walls; var house; var gate; var gate2; // variables for character var cursors; var player; var left; var right; var up; var down; var game = new Phaser.Game(550, 540, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); // ADD HOUSES function addHouse(image) { house = game.add.physicsGroup(); house.create(-250, -240, 'greenhouse'); house.setAll('body.immovable', true); } // ADD FENCES OR WALLS function addWalls(image) { walls = game.add.physicsGroup(); // fences up top walls.create(-90, -200, 'fencefront'); walls.create(5, -200, 'fencefront'); walls.create(100, -200, 'fencefront'); walls.create(195, -200, 'fencefront'); // fences to right walls.create(288, -200, 'fenceright'); walls.create(288, -135, 'fenceright'); walls.create(288, -70, 'fenceright'); walls.create(288, -5, 'fenceright'); // fences at bottom walls.create(5, 59, 'fencefront'); walls.create(100, 59, 'fencefront'); walls.create(195, 59, 'fencefront'); // fences to left walls.create(-91, -200, 'fenceleft'); walls.create(-91, -135, 'fenceleft'); // set the walls to be static walls.setAll('body.immovable', true); } // PRELOAD IMAGES FOR ITEMS, PLAYERS, ETC. function preload() { // preload player game.load.spritesheet('player', 'hero.png', 64, 64); // preload houses game.load.image('greenhouse', 'greenhouse.png'); // preload fences game.load.image('fencefront', 'fencefront.png'); game.load.image('fenceleft', 'fenceleft.png'); game.load.image('fenceright', 'fenceright.png'); // fence that has adjusted hit boundary game.load.image('gate', 'fenceleft.png'); game.load.image('gate2', 'fencefront.png'); // preload ground game.load.image('ground', 'tiles2.png'); } // ADD THINGS TO GAME function create() { // set area that the player may travel to game.world.setBounds(-250, -250, 550, 550); // set background color game.stage.backgroundColor = ('#3c6f42'); gate = game.add.physicsGroup(); game.physics.startSystem(Phaser.Physics.ARCADE); gate = game.add.sprite(-91, -70, 'gate'); gate.name = 'gate'; game.physics.enable([gate], Phaser.Physics.ARCADE); // This adjusts the collision body size to be a 100x50 box. // 50, 25 is the X and Y offset of the newly sized box. gate.body.setSize(15, 90, -2, 3); gate.body.immovable = true; gate2 = game.add.physicsGroup(); game.physics.startSystem(Phaser.Physics.ARCADE); gate2 = game.add.sprite(-90, 59, 'gate2'); gate2.name = 'gate2'; game.physics.enable([gate2], Phaser.Physics.ARCADE); // This adjusts the collision body size to be a 100x50 box. // 50, 25 is the X and Y offset of the newly sized box. gate2.body.setSize(90, 15, 3, 3); gate2.body.immovable = true; // adding the ground var ground = game.add.sprite(-224, -100, 'ground', 1); var ground = game.add.sprite(-224, -60, 'ground', 1); var ground = game.add.sprite(-224, -20, 'ground', 1); var ground = game.add.sprite(-224, 20, 'ground', 1); var ground = game.add.sprite(-184, 20, 'ground', 1); var ground = game.add.sprite(-144, 20, 'ground', 1); // add player image and place in screen player = game.add.sprite(-232, -100, 'player'); player.smoothed = true; player.scale.set(.9); player.body.setSize(30, 40, 16, 16); player.body.immovable = false; // player will "collide" with certain images like walls and houses player.collideWorldBounds = true; // ANIMATION FOR PLAYER CONTROLS down = player.animations.add('down', [0,1,2,3], 10, true); left = player.animations.add('left', [4,5,6,7], 10, true); right = player.animations.add('right', [8,9,10,11], 10, true); up = player.animations.add('up', [12,13,14,15], 10, true); // enable physics in the game (can't go through walls, gravity, etc.) game.physics.enable([player, house, walls, gate], Phaser.Physics.ARCADE); game.physics.startSystem(Phaser.Physics.P2JS); game.physics.startSystem(Phaser.Physics.ARCADE); game.physics.p2.enable(player); // make sure to add this code to add items/walls/buildings addHouse(); addWalls(); // enable keyboard arrows for controls cursors = game.input.keyboard.createCursorKeys(); // camera will follow the character game.camera.follow(player); } // what happens when player does something function update() { // player will now collide with these images rather than pass over them game.physics.arcade.collide(player, house); game.physics.arcade.collide(player, walls); // PLAYER CONTROLS player.body.velocity.set(0); // player presses left key if (cursors.left.isDown) { player.body.velocity.x = -100; player.play('left'); } // player presses right key else if (cursors.right.isDown) { player.body.velocity.x = 100; player.play('right'); } // player presses up key else if (cursors.up.isDown) { player.body.velocity.y = -100; player.play('up'); } // player presses down key else if (cursors.down.isDown) { player.body.velocity.y = 100; player.play('down'); } // player does not press anything else { player.animations.stop(); } } function render() { game.debug.bodyInfo(gate2, 32, 32); game.debug.body(gate2); game.debug.bodyInfo(player, 32, 32); game.debug.body(player); }
  10. Need help with rotation

    I'm new to phaser and doing a course. I'm a noob so dont make fun of me too much. anyways, i need to rotate this image of a cupcake when clicking it counter clockwise 10 degrees. how would i do this? here is my code right now. import 'phaser' var game = new Phaser.Game(500, 300, Phaser.AUTO, 'game', { preload: preload, create: create }) function preload() { game.load.image('cupcake', '/api/asset/png/!vault/phaserData.cupcake') } // Declare a global variable which we can access in any function in the file var cupcake function create() { cupcake = game.add.sprite(80, 120, 'cupcake') // The default sprite anchor point is at the // top-left (anchor.x=0, anchor.y=0) of the image // We change the anchor point to be the center of the image // so that scaling doesn't look weird // TODO: Try other anchor points... cupcake.anchor.x = 0.5 cupcake.anchor.y = 0.5 // By default, clicking on a sprite will have no effect. // We have to enable this feature as follows: cupcake.inputEnabled = true // sprite has different events. More http://phaser.io/docs/2.4.7/Phaser.Events.html#members // we pass a function which is executed when trigger event occurs cupcake.events.onInputDown.add(clickCupcake) // event triggers when we click anywhere on the game screen game.input.onDown.add(clickGame) } function clickCupcake(){ cupcake.scale.x += 0.1 cupcake.scale.y += 0.1 } this currently makes it grow everytime it is clicked but how would i change it to rotate it instead 10 degrees counter clockwise? thanks
  11. How to set hitbox?

    I cannot figure out how to change the hitbox size of my player, the character doesn't fit through a hole in a fence so I want to change the hit box sizes. I already tried this https://phaser.io/examples/v2/arcade-physics/offset-bounding-box but this did not work for me, my screen went black when i did this. // variables for items, walls, etc. var walls; var house; var game = new Phaser.Game(550, 540, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); //add house to game function addHouse(image) { house = game.add.physicsGroup(); house.create(-250, -240, 'greenhouse'); house.setAll('body.immovable', true); } // add fences/walls to the game function addWalls(image) { walls = game.add.physicsGroup(); // fences up top walls.create(-90, -200, 'fencefront'); walls.create(5, -200, 'fencefront'); walls.create(100, -200, 'fencefront'); walls.create(195, -200, 'fencefront'); // fences to right walls.create(288, -200, 'fenceright'); walls.create(288, -135, 'fenceright'); walls.create(288, -70, 'fenceright'); walls.create(288, -5, 'fenceright'); // fences at bottom walls.create(-90, 59, 'fencefront'); walls.create(5, 59, 'fencefront'); walls.create(100, 59, 'fencefront'); walls.create(195, 59, 'fencefront'); // fences to left walls.create(-91, -200, 'fenceright'); walls.create(-91, -135, 'fenceright'); walls.create(-91, -70, 'fenceright'); // set the walls to be static walls.setAll('body.immovable', true); } // preload items, walls, players, etc. function preload() { // preload player game.load.spritesheet('player', 'hero.png', 64, 64); // preload houses game.load.image('greenhouse', 'greenhouse.png'); // preload fences game.load.image('fencefront', 'fencefront.png'); game.load.image('fenceleft', 'fenceleft.png'); game.load.image('fenceright', 'fenceright.png'); } // variables for character var cursors; var player; var left; var right; var up; var down; // add what will be in game function create() { game.world.setBounds(-250, -250, 550, 550); // set background color game.stage.backgroundColor = ('#3c6f42'); // add player image and place in screen player = game.add.sprite(-232, -100, 'player', 1); player.smoothed = false; player.scale.set(1); // player will "collide" with certain images like walls and houses player.collideWorldBounds = true; // ANIMATION FOR PLAYER CONTROLS down = player.animations.add('down', [0,1,2,3], 10, true); left = player.animations.add('left', [4,5,6,7], 10, true); right = player.animations.add('right', [8,9,10,11], 10, true); up = player.animations.add('up', [12,13,14,15], 10, true); // enable physics in the game (can't go through walls, gravity, etc.) game.physics.enable(player, Phaser.Physics.ARCADE); game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.enable(player); // make sure to add this code to add items/walls/buildings addHouse(); addWalls(); // enable keyboard arrows for controls cursors = game.input.keyboard.createCursorKeys(); // camera will follow the character game.camera.follow(player); } // what happens when player does something function update() { // player will now collide with these images rather than pass over them game.physics.arcade.collide(player, house); game.physics.arcade.collide(player, walls); // PLAYER CONTROLS player.body.velocity.set(0); // player presses left key if (cursors.left.isDown) { player.body.velocity.x = -100; player.play('left'); } // player presses right key else if (cursors.right.isDown) { player.body.velocity.x = 100; player.play('right'); } // player presses up key else if (cursors.up.isDown) { player.body.velocity.y = -100; player.play('up'); } // player presses down key else if (cursors.down.isDown) { player.body.velocity.y = 100; player.play('down'); } // player does not press anything else { player.animations.stop(); } } function render() { }
  12. Player and Colliding Objects

    Hi, I need some help with my code, I am trying to create a fenced in area for my character to go in, but he cannot fit through because of the objects that he collides with. How do I change the area that the character collides with? can I reduce the size of the collidable area? The hole in the fence seems quite large enough, but he just won't go through. My game.js // variables for items, walls, etc. var walls; var house; var game = new Phaser.Game(550, 540, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); //add house to game function addHouse(image) { house = game.add.physicsGroup(); house.create(-250, -240, 'greenhouse'); house.setAll('body.immovable', true); } // add fences/walls to the game function addWalls(image) { walls = game.add.physicsGroup(); // fences up top walls.create(-90, -200, 'fencefront'); walls.create(5, -200, 'fencefront'); walls.create(100, -200, 'fencefront'); walls.create(195, -200, 'fencefront'); // fences to right walls.create(288, -200, 'fenceright'); walls.create(288, -135, 'fenceright'); walls.create(288, -70, 'fenceright'); walls.create(288, -5, 'fenceright'); // fences at bottom walls.create(-90, 59, 'fencefront'); walls.create(5, 59, 'fencefront'); walls.create(100, 59, 'fencefront'); walls.create(195, 59, 'fencefront'); // fences to left walls.create(-91, -200, 'fenceright'); walls.create(-91, -135, 'fenceright'); walls.create(-91, -70, 'fenceright'); // set the walls to be static walls.setAll('body.immovable', true); } // preload items, walls, players, etc. function preload() { // preload player game.load.spritesheet('player', 'hero.png', 64, 64); // preload houses game.load.image('greenhouse', 'greenhouse.png'); // preload fences game.load.image('fencefront', 'fencefront.png'); game.load.image('fenceleft', 'fenceleft.png'); game.load.image('fenceright', 'fenceright.png'); } // variables for character var cursors; var player; var left; var right; var up; var down; // add what will be in game function create() { game.world.setBounds(-250, -250, 550, 550); // set background color game.stage.backgroundColor = ('#3c6f42'); // add player image and place in screen player = game.add.sprite(-232, -100, 'player', 1); player.smoothed = false; player.scale.set(1); // player will "collide" with certain images like walls and houses player.collideWorldBounds = true; // ANIMATION FOR PLAYER CONTROLS down = player.animations.add('down', [0,1,2,3], 10, true); left = player.animations.add('left', [4,5,6,7], 10, true); right = player.animations.add('right', [8,9,10,11], 10, true); up = player.animations.add('up', [12,13,14,15], 10, true); // enable physics in the game (can't go through walls, gravity, etc.) game.physics.enable(player, Phaser.Physics.ARCADE); game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.enable(player); // make sure to add this code to add items/walls/buildings addHouse(); addWalls(); // enable keyboard arrows for controls cursors = game.input.keyboard.createCursorKeys(); // camera will follow the character game.camera.follow(player); } // what happens when player does something function update() { // player will now collide with these images rather than pass over them game.physics.arcade.collide(player, house); game.physics.arcade.collide(player, walls); // PLAYER CONTROLS player.body.velocity.set(0); // player presses left key if (cursors.left.isDown) { player.body.velocity.x = -100; player.play('left'); } // player presses right key else if (cursors.right.isDown) { player.body.velocity.x = 100; player.play('right'); } // player presses up key else if (cursors.up.isDown) { player.body.velocity.y = -100; player.play('up'); } // player presses down key else if (cursors.down.isDown) { player.body.velocity.y = 100; player.play('down'); } // player does not press anything else { player.animations.stop(); } } function render() { } The HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Simple Canvas Game</title> <link href="https://fonts.googleapis.com/css?family=Syncopate:700" rel="stylesheet"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> html { background: black } canvas { margin: auto; } h1 { font-family: 'Syncopate', sans-serif; color: rgb(194, 68, 91); text-align: center; margin: 0 auto; font-size: 25px; } </style> </head> <body> <header> <h1>Crafty Heroes</h1> </header> <script src="phaser.js"></script> <script src="game.js"></script> </body> </html>
  13. Jigsaw Palace

    We have recently developed a simplistic puzzle game, Jigsaw Palace using Phaser engine. With the power of Phonegap/Cordova we've put together an Android version, which is available to download on Google Play. https://play.google.com/store/apps/details?id=net.arcticarcade.jigsawpalacefree&hl=en_GB We created a free version which used Revmob advertisements, but also created a paid for version, which comes without the ads. It would be much appreciated if you could help out by downloading the game and giving it a play, and if you like it, maybe leave a rating (we're not expecting 5 stars, just an honest review). Thanks again for your time, and hopefully you will have some fun playing.
  14. Hi guys, my game was working fine, fluently, etc and I was expanding it. It's platform, where a lot of bullets are flying, also many spikes hang from the upper platforms. Now, when I add more spikes and more bullets, when the turrets shot them, the game drastically slows. Is too many object there? And what can I do to make it faster again? Creating spikes: function create_spikes ( x , y , number, angle, vertical) { for (i=0; i < number; ++k, i++) { if ( vertical != 'yes' ) { spikes[k] = game.add.sprite((x+i)*16, y*16, 'kolec'); } else spikes[k] = game.add.sprite(x*16, (y+i)*16, 'kolec'); game.physics.enable(spikes[k], Phaser.Physics.ARCADE); spikes.enableBody = true; if ( angle==180 ) spikes[k].body.setSize(12, 8, -14, -16); else spikes[k].body.setSize(12, 8, 4, 8); spikes[k].body.allowGravity = false; spikes[k].angle=angle; } } //ENEMY BULLETS ebullets = game.add.group(); ebullets.enableBody = true; ebullets.physicsBodyType = Phaser.Physics.ARCADE; game.physics.enable(ebullets, Phaser.Physics.ARCADE); ebullets.createMultiple(50, 'enemy_bullet'); ebullets.setAll('checkWorldBounds', true); ebullets.setAll('outOfBoundsKill', true); //ENEMY SHOOTING function enemy_shooting (enemy,type,direction) { if ( type == 'mortar' && enemy.alive==true) { nextFire = game.time.now + fireRate; var ebullet = ebullets.getFirstDead(); ebullet.reset(enemy.body.x-20, enemy.body.y-20); ebullet.body.velocity.y=-200; if ( player.body.x <= enemy.body.x ) ebullet.body.velocity.x=-200; else ebullet.body.velocity.x=200; }
  15. How to avoid maaaany collisions?

    Hi, in my finished game I've found a thing, that slows my game from 60 to 30 fps. Too many collisions handlers. Well I need them to control whole game, to call all essentiall functions, but they are sloooooowing game drastically. game.physics.arcade.collide(bullets, layer, resetBullet); game.physics.arcade.collide(grenades, layer, resetBullet); game.physics.arcade.collide(ebullets, layer, resetBullet); game.physics.arcade.collide(chest3, chest5, chesting); game.physics.arcade.overlap(bullets, ebullets, resetBullet); It's for bullets to destroy chests, bullets with themselves and chest with chest. If I delete this, FPS goes from 30 to 60. But I need this. How can I do it? It's interesting, because the bullets aren't even created and they are slowing game. I have much more collision handlers, for every object to collide with layers and with all other objects like player, bullet, chest, another bullet, enemy bullet etc... Full code of game is avaiable here: redplanetgame.prv.pl
  16. Hi, I present you my game made in Phaser, here u are: redplanetgame.prv.pl I've finished it 3 months ago. It's a platform game, to collect all goals and kill enemies. When I was creating it, it worked fine, I mean, on full fps, but when I reach the end it drastically slowed down. I started few topic about this problem. I think, it's too many bullets or sth.(or my weird structure of code). When u inspect the browser, on bottom u can see all of my phaser code I've used. It's this: <script type="text/javascript" src="functions.js"></script> <script type="text/javascript" src="create.js"></script> <script type="text/javascript" src="update.js"></script> <script type="text/javascript" src="game.js"></script> <script type="text/javascript" src="jquery-3.2.1.js"></script> My question is: how to speed up whole game? Now it's seriously problematic. Another weird thing is that on many computers it works fine, on few it doesn't run completely (black screen instead of game), on other it freezes after few seconds, and in one the space+left arrow is not working xD
  17. Problem with fps

    Hi all! In my phaser game a lot of graphics and animations. I have a trouble with fps, it's gradually fall.. For 10 minutes after start, 60 fps falls to 10 fps. With what it can be connected? I guess, maybe animations not destroy after they are completed? Code looks like this: //global var idle,loss; //create idle = game.add.sprite(0,0, 'monster_idle'); //idle pressed loss = game.add.sprite(0,0, 'monster_loss'); idle.destroy(); idle=null; //on loss animation complete loss.destroy(); loss=null; hp-=10; //and repeat idle = game.add.sprite(0,0, 'monster_idle');
  18. Holle!~~ Translation of some keywords 【进入游戏】->【PLAY】 【瞄准方式】->【Target mode】 【重新开始】->【restart】 【重力感应】->【gravity sensor】 Sorry, My English is not so good Babylon is an excellent js game engine Play with it! thinks!!!! url:https://forreall.cn/3ds/app/zhanji/
  19. 5 latest new maze for Perplexus Shadow Open (BabylonJS WebGL 3D maze game. Very fun, but player still have to manually manage arc camera with mouse.
  20. For anyone too young to remember, back in the 1980s there was this thing called LCD games. Before Nintendo introduced the GameBoy, electronics companies including Nintendo were making small handheld toys that used LCD crystals to display flickering shapes, the shapes could only be turned on or off. Using this crude form of animation they were able to create something that kind of resembled a videogame. Companies incl. Gakken, Tandy, Radio Shack, Sunwing, Tiger, Tomy called these games "card game" or just electronic lcd game, while Nintendo called their line "Game & Watch". Over the years hundreds (maybe thousands) of different games were created, see this site: http://handheldempire.com/games.jsp Anyway, why do I bring this up here on html5gamedevs? There is this very cool site called pica-pic by Hipopotam. He's created playable versions of 26 of these games using Flash. -> http://www.pica-pic.com/ Now I was thinking, this could possibly also be done using with html/js right? Ideally there could be some sort of lcdgame.js library, and then for each separate game you'd have just one html file and a javascript to describe the gamelogic. And maybe only 2 png images, one image with and one without the shapes, and the LCD game library is then able to cut out the shapes (also described in the js file as polygons) and display it on a canvas. It could potentially be kind of like MAME but for LCD games. Any thought on this?
  21. Holle!~~ Translation of some keywords 【进入游戏】->【PLAY】 【瞄准方式】->【Target mode】 Sorry, My English is not so good Play with it! thinks!!!! url:https://forreall.cn/3ds/app/zhanji/
  22. [Legacy] Infinite Gears

    Hi guys, I want to share my game project that I have created in 2013. It was developed for 2 months but unable to finish it due to some unavoidable circumstances. Introducing Infinite Gears! Infinite Gears is an open-world, survival, 2D space-shooting, bullet-hell game (Whew!). As a Player, you can select a spaceship and start wandering through planets and destroy enemy motherships who are taking over those planets, while also fighting against some small enemies along the way. Each spaceship has its own power. One that focuses on pure power, one that focuses on single-target, and one that can protect itself from enemy attacks. As the Player saved a planet, Player can start buying upgrades so the ship gets stronger. The upgrade cost scraps you got from defeating an enemy. The scraps are then converted into GEARS to buy upgrades from the shop. There is an Overdrive (O.D.) bar that is generated by killing enemies. If this is triggered, it will grant you maximum power of that spaceship for a limited time. The enemies also get stronger as you go further away from where you start. This is indicated by the map on bottom right. There are sectors that are determined as levels to indicate that there will be more enemies and stronger enemy motherships. You must eliminate them as much as you can, and see how far you can go! The game should work on desktop browser at least IE9, Chrome, Firefox, and Opera. How to Play Clone or download this project, extract, and go to the project folder. Inside the ./bin folder, run the index.html. Use ASWD to move the spaceship. Use LMB (Left Mouse Button) to shoot. Use Space bar to throw off the bomb. Attack target is based on the mouse cursor. Last Note The game project was developed by Annobox (me and the illustrator) around June - July 2013 (2 months) for a competition and was still in development, but is no longer continued since then. This project is open to use for everyone, but for more detailed on the copyright notice, please visit the link and read the README.md file. The development is discontinued until now, so there won't be any fix. JavaScript has changed so long since this project and I have my latest code been changed a lot since then, especially after ES6 gets global. So I hope you enjoy the game and the source code! Source Code https://github.com/alectora/infinite-gears
  23. Hello everyone, I love to make games, but unfortunately i don't know how to make graphics for my games. This is the main reason of incomplete games. Is there anyone knows how to solve this? I am not looking for making "the best" graphics, but i just want to achieve moderate quality. Do you think can i learn some basic concept of computer graphics? Or must i outsource graphics design completely?
  24. There is a blackjack game at html5pcode.com/a0zblackjack.htm The p-code was written for HTML5 Javascript. The home page is html5pcode.com
  25. Did you know that pizza delivery is as old as the wheel itself? Check out Promethean Heat's latest indie game, Zog's Za. There are hungry customers out there, so help roll our fearless delivery people to their doors. Twenty challenging levels and a hidden game for players who can achieve perfection! Now available on Android in the Google Play store. https://play.google.com/store/apps/details?id=com.prometheanheat.zogsza Feedback greatly appreciated.