• Content Count

  • Joined

  • Last visited

Everything posted by 3man7

  1. in create(): //add the animation player.animations.add('crouch', Phaser.Animation.generateFrameNames(prefix, start, stop, suffix, zeroPad), fps, loop); //play the animation player.animations.play('crouch'); https://phaser.io/docs/2.6.2/Phaser.Animation.html https://phaser.io/docs/2.6.2/Phaser.Animation.html#.generateFrameNames Reply back with the .json file if you need more help.
  2. Hey, So you have 4 seconds for each of the messages to read; clicking on the screen will skip the current one but also resets the timer back. Take your time looking/understanding the code below and let me know if something doesn't seem to make sense to you. Main.Game = function (game) {}; var myTimer, count = 0; Main.Game.prototype = { create: function () { this.cursor = game.input.keyboard.createCursorKeys(); game.stage.backgroundColor = "#4488AA"; this.player = game.add.sprite(600, 250, 'player'); this.player.anchor.setTo(0.5, 0.5); game.physics.arcade.enable(this.player); this.friend = game.add.sprite(400, 250, 'friend'); this.friend.anchor.setTo(0.5, 0.5); game.physics.arcade.enable(this.friend); // Create a Rectangle var rectangle = new Phaser.Rectangle(0, 515, 1000, 200); // Create a BitmapData just to plot the points to var bmd = game.add.bitmapData(game.width, game.height); bmd.rect(rectangle.x, rectangle.y, rectangle.width, rectangle.height, '#ffffff'); bmd.addToWorld(); //myMessage this.myMessage = game.add.text(500, 540, '', { font: "18px Arial", fill: "#333333", align: "center" }); this.myMessage.anchor.setTo(0.5, 0.5); //myTimer myTimer = game.time.create(false); //input enabler game.inputEnabled = true; game.input.onDown.add(this.updateMsg, this); this.updateMsg(); }, updateTmr: function () { if (count <= 2) { count++; myTimer.destroy(); myTimer.add(Phaser.Timer.SECOND * 4, this.updateMsg, this); myTimer.start(); myTimer.resume(); } else { myTimer.destroy(); } }, updateMsg: function () { switch (count) { case 0: this.myMessage.setText('Hello, thank you for coming to save us.'); break; case 1: this.myMessage.setText('1. We need your help to save the world'); break; case 2: this.myMessage.setText('To be able to save the world, you must gain magic.'); break; case 3: this.myMessage.setText('The mini games in each world will give you a new magic spell. You must complete the mini-game before exploring the rest of the world. Good luck to you.'); break; } this.updateTmr(); }, update: function () { //stuff to run at 60 times per second }, render: function () { game.debug.text("count: " + count, 32, 40); game.debug.text("myTimer: " + myTimer.duration.toFixed(0), 32, 60); } }; The render function will make you see things better - although it has an impact on fps so be sure to remove it whenever you try to get the best out of your project/game. Good luck!
  3. @isepulveda Everything in 'update' is going to run 60 times/second. The clicking event should be put in 'create'. game.inputEnabled = true; game.input.onDown.add(function () { count++; if (count <= 1) { this.message.setText("We need your help to save the world"); } }, this); Could you explain a little bit what you are trying to achieve exactly? Any slight changes to the code will return different cases.
  4. 3man7

    6 x 6 grid

    Hi, If you mean like a grid out of a sprite then... //create grid group this.mygridGroup = game.add.group(); this.mygridGroup.enableBody = false; for (i = 0; i <= 5; i++) { for (j = 0; j <= 5; j++) { var mygrid = this.mygridGroup.game.add.sprite(50 * j, 50 * i, 'mySprite'); this.mygridGroup.add(mygrid); } } //later on you can set properties to the grid like so... this.mygridGroup.setAll('anchor.x', 0.5); this.mygridGroup.setAll('anchor.y', 0.5); Good luck!
  5. Hi, There's just a couple of minor problems with your game. Visit the links below to check the errors. index.html = https://www.diffchecker.com/OJDuSSht load.js = https://www.diffchecker.com/vtrZJTg9 menu.js = https://www.diffchecker.com/QKSn5QeI play.js = https://www.diffchecker.com/wCfx8nyS win.js = https://www.diffchecker.com/dmXpemAh I've attached the fixed files in this post. Good luck! index.html load.js menu.js play.js win.js
  6. Hey, I haven't had any problems like that so I'm not entirely sure why that happens. Try adding: game.input.onDown.remove (this.myfunction, this); at the end of the function (this.myfunction) If that doesnt work... then Try adding: game.input.onUp.add (function(){}, this); below game.input.onDown.add (this.myfunction, this);
  7. Hey, Delete the ' ' from the resolution specified. var game = new Phaser.Game(100, 100, Phaser.AUTO .... Delete #1 from update() and add #2 in create() #1 if (game.input.pointer1.isDown) { ball.body.gravity.y = 3000; } #2 game.inputEnabled = true; game.input.onDown.add(function () { ball.body.gravity.y = 3000; }, this);
  8. @FenopiĆ¹ - I think the 'update' gives him problems because the sound is playing continuously. @jevisan - This might look complicated but it's pretty easy to understand. I apologize for the long post but I've felt like you may want a different approach of playing the sounds. Methods: sounds will be played like: A-B-A-B etc. sounds will be played in groups like: ( A-B ) -> ( A-B ) -> ( B-A ) -> ( A-B ) -> ( B-A ) etc. sounds will be played randomly like so: A-A-A-A-A-A-A-B-B-B-A-A-A-B etc. Test all 3 and use what you like the most. I recommend the second method as it sounds more naturally.
  9. Without reading too much.. try adding 'animations' before .frame this.empty.animations.frame += 1;
  10. Hey, I think the problem is merely the code ordering + omitting specifying default proprieties + confusion.. ? Here's how I'd do it: Main.Game = function (game) {}; var pressedOne_bool = false; var pressedTwo_bool = false; var pressedThree_bool = false; var arr; Main.Game.prototype = { preload: function () { this.game.load.image('one', 'phone/phone1.png'); this.game.load.image('two', 'phone/phone2.png'); this.game.load.image('three', 'phone/phone3.png'); this.game.load.image('enter', 'images/enter.png'); }, create: function () { this.one = this.game.add.button(100, 100, 'one', this.pressedOne, this); this.one.tint = 0xFFFFFF; this.two = this.game.add.button(200, 100, 'two', this.pressedTwo, this); this.two.tint = 0xFFFFFF; this.three = this.game.add.button(300, 100, 'three', this.pressedThree, this); this.three.tint = 0xFFFFFF; this.arr = [0, 0, 0]; }, pressedOne: function () { switch (pressedOne_bool) { case false: pressedOne_bool = true; this.one.tint = 0xE6E2F4; this.arr[0] = 1; break; case true: pressedOne_bool = false; this.one.tint = 0xFFFFFF; this.arr[0] = 0; break; } }, pressedTwo: function () { switch (pressedTwo_bool) { case false: pressedTwo_bool = true; this.two.tint = 0xE6E2F4; this.arr[1] = 1; break; case true: pressedTwo_bool = false; this.two.tint = 0xFFFFFF; this.arr[1] = 0; break; } }, pressedThree: function () { switch (pressedThree_bool) { case false: pressedThree_bool = true; this.three.tint = 0xE6E2F4; this.arr[2] = 1; break; case true: pressedThree_bool = false; this.three.tint = 0xFFFFFF; this.arr[2] = 0; break; } }, EnterBtn: function () { console.log(this.arr); }, render: function () { game.debug.text("pressedOne_bool: " + pressedOne_bool, 32, 40); game.debug.text("pressedTwo_bool: " + pressedTwo_bool, 32, 60); game.debug.text("pressedThree_bool: " + pressedThree_bool, 32, 80); game.debug.text("arr: " + this.arr, 32, 120); } } The render function will make you see things better - although it has an impact on fps so be sure to remove it whenever you try to get the best out of your project/game. Good luck!
  11. Happy new year! : ) EDITED: //variables var flip = 0; var gun_distX; //update gun_distX = game.input.x - this.gun.x; /* flip = 0 - mouse is on the right side of the gun flip = 1 - mouse is on the left side of the gun */ switch (flip) { case 0: if (gun_distX < 0) { flip = 1; this.gun.scale.y *= -1; } break; case 1: if (gun_distX >= 0) { flip = 0; this.gun.scale.y *= -1; } break; } You basically subtract x position of mouse and gun to get the distance between the two. If the value is positive then the mouse is on the right side of the gun and vice versa; flipping the gun accordingly. ~~~ You might work with these too later on, altough the above is enough. var gun_distX, gun_distY, gun_angle, gun_degree; gun_distX = game.input.x - this.gun.x; gun_distY = game.input.y - this.gun.y; gun_angle = Math.atan2(gun_distX, gun_distY); gun_degree = gun_angle * 180 / Math.PI; Good luck!
  12. @DanielKlava answer is spot on. I don't see why it wouldn't work for you. Credit goes to him for answer; I'll just provide the code if that's easier to understand. 1. Delete the '1' at the end to make the default frame 0. (aka unslashed/unmuted sprite). (or change it to 0, same thing). this.button = game.add.button(this.posx, this.posy, this.image, this.anim_on_click, this, 0); Frames starts at 0; so you specified the button to go to the next frame (aka slashed/muted sprite) therefore the code skipped the first part. 2. Use a variable instead of checking the current frame of the sprite. var mutedYN = 0; _button_stay.prototype.anim_on_click = function () { switch (mutedYN) { case 0: //mute this.audio_click(); music.pause(); music_ambiance_mute(); this.button.frame = 1; break; case 1: //unmute this.audio_click(); music.resume(); music_ambiance_activate(); this.button.frame = 0; break; } mutedYN = mutedYN ? 0 : 1; };
  13. Hopefully no one minds but I've already posted my game on 'Game Showcase' section and I've wanted to post it here too as this is my first launch on Google Play! Jelly Haven is an action-arcade HTML5 game in which you control a jellyfish going through the space gathering shiny gems and avoid being hit by dangerous obstacles like meteors and rockets. The game gets really fast paced as you purchase upgrades from the store which helps you survive much longer. * Translated in 9 languages: English, Russian, French, German, Italian, Spanish, Portuguese, Turkish and Romanian. Link to game: http://37dev.ga/jelly Quick Gameplay: https://youtu.be/nRIHGlr1X64 Google Play: https://play.google.com/store/apps/details?id=com.thirtyseven.jellyhaven
  14. Quick update: My first game launch on Google Play: 'Jelly Haven'! https://play.google.com/store/apps/details?id=com.thirtyseven.jellyhaven Enjoy!
  15. Ohh I get it. What I would've done instead is this: create a black box with the transparency of 60% and save it as .png. After that just duplicate the .png image with 'for loop', put them in a group and place them over the colored levels (aka unlocked). Then kill() the image specific to the levels unlocked. It won't be grayscale but it's a similar effect. In the end it's up to you
  16. The filter option will definitely have an impact on the performance. I would personally apply the filter to the batch of images in Photoshop using 'Action'. Here's a good tutorial: youtube.com/watch?v=lcZp2h5WXdA Don't forget to backup your original images! This method only applies if your sprites will remain grayscale the entire project. If you want to transition from color to grayscale and back on color then I would advice against this method and instead try to find a fix for the code. Sorry that I cannot help you enough with the filter code as I haven't used them before.
  17. I have a similar 'question': Is (1) supposed to go in update? What if you use a tween in create? Would that be better performance related?
  18. Well, like @samid737 said, the issue is that you are using CANVAS. In the testing I've used Phaser 2.6.2 and Phaser.AUTO. I am not entirely sure if there are filters that can be used with CANVAS as they are meant to work with WEBGL only. Refer to: https://github.com/photonstorm/phaser/issues/2223 http://phaser.io/docs/2.6.2/Phaser.Filter.html
  19. I'm not sure if the error refers to something else but first thing that came to my mind is the lack of semi-colons at the end of the lines in create function.
  20. I did a quick test and the code works for me. Are there any errors on console from your app?
  21. In boot.js you've set some limits regarding the game scale: game.scale.minWidth = 250; game.scale.minHeight = 170; <-- lower this or delete the line entirely. game.scale.maxWidth = 1000; game.scale.maxHeight = 680;
  22. Hey guys, I just wanted to let you know about my first HTML5 game made with Phaser! It is an action-arcade game in which you control a jellyfish going through the space gathering shiny gems and avoid being hit by dangerous obstacles like meteors and rockets. Link to game: http://37dev.ga/jelly Quick Gameplay: https://youtu.be/nRIHGlr1X64 The game starts off slowly but it gets really fast paced as you purchase upgrades from the store which helps you survive much longer. Endless fun game with great performance. Optimized for mobile devices but fully playable in desktop as well. Audio support for all mobile operating systems. Easily localized as the texts are stored in a .json file. Saving/loading game with cookies system. Translated in 9 languages: English, Russian, French, German, Italian, Spanish, Portuguese, Turkish and Romanian. The game is currently looking for sponsorship and has not yet been published before. Let me know what you guys think! Enjoy!
  23. Well I'm new to Phaser as well but here's my take: The problem here is the value given to the radius in tween. Should've been half of the size given in 'outerCircle', which is 150. (this.outerCircle = new Phaser.Circle(200, 200, 300);) But for some reason it doesn't accept the perfect half, but by a point off. (149.9) (not sure why, hopefully someone could help me on this one) This is a dirty hack and I would definitely look into other ways of dealing with this kind of effect. //define variable var circleRadius = 300; //create this.outerCircle = new Phaser.Circle(200, 200, circleRadius); //update this.smokeTween = this.game.add.tween(this.radCircle).to( { radius: circleRadius / 2 - .1 }, 20000, Phaser.Easing.Sinusoidal.Out, true);
  24. @samme Yeah there's definetely an easier way of coding this. Basically I needed a button to pause/resume everything at a quick click. I did get it to work but I didn't understand why my methods acted like that. @samid737 Well that makes more sense now! I appreciate your detailed message! I'm gonna have to take a second and read your reply several times because I'm not quite familiar with method chaining in Javascript. I might've skipped some basic lessons. Thanks both of you for the replies!
  25. Hello guys, I have 2 'simple questions' (I assume) that kinda bugs me for a while now. I wouldn't want to get too in-depth with this mainly because I'm not good at explaining stuff; but I'll try to keep it simple. 1st question: Is 'fig 1' and 'fig 2' supposed to be the same thing? 2nd question: I got a button that is supposed to pause the game. 'mygamepaused' is a variable that goes true/false on a click. 'mytimepass' is a 3 seconds timer that runs the tween from the first question. 'smiley_tw_pass' is a variable that goes true when the timer is finished (aka my way of telling the program that the tween just started) 'smiley_tw' is the name assigned to the tween (see question 1). After the tween is completed (see question 1) - the sprite (this.smiley) goes to 100 on y axis and changes alpha to 0.1. Here's where I run into problems. 1st: "smiley_tw is not defined" console error when trying to press the button before the timer passess (aka it cannot find the tween) fixed it by assigning a variable (smiley_tw_pass) right after the timer runs out. ...is that a good way of checking if the tween just started?... 2nd: "smiley_tw.pause is not a function" console error when using fig 1 (see question 1) fixed it by using fig 2 (see question 1) ...this bugs me because in my mind the two methods should work the same way, right?... So that's how I solved the problem - by using a variable to detect if the tween just started AND using fig 2 instead of the first one - But WHY? Why does the 2 methods doesn't work the same way here - AND - is declaring a variable (smiley_tw_pass) to check if a tween is running - a good thing? I would really appreciate if someone can figure this 'mistery' and can clear my mind a little. Full code: (480x720) var Test = function (game) {}; var mygamepaused = false; var smiley_tw_pass = false; Test.prototype = { create: function () { //create button this.mybutton = game.add.button(this.world.centerX, 600, 'smiley', this.myfunction, this); this.mybutton.anchor.setTo(.5); this.mybutton.scale.setTo(.2); this.mybutton.inputEnabled = true; //create smiley this.smiley = game.add.sprite(this.world.centerX, this.world.centerY, 'smiley'); this.smiley.anchor.setTo(.5); this.smiley.scale.setTo(.5); //create mytimepass mytimepass = game.time.create(false); mytimepass.add(3000, function () { if (!smiley_tw_pass) smiley_tw_pass = true; smiley_tw = game.add.tween(this.smiley).to({ alpha: 0 }, 1200, Phaser.Easing.Quadratic.InOut, true); smiley_tw.onComplete.add(function () { this.smiley.y = 100; this.smiley.alpha = 0.1; }, this); }, this); mytimepass.start(); }, myfunction: function () { switch (mygamepaused) { case false: mygamepaused = true; mytimepass.pause(); if (smiley_tw_pass) smiley_tw.pause(); break; case true: mygamepaused = false; mytimepass.resume(); if (smiley_tw_pass) smiley_tw.resume(); break; } }, render: function () { game.debug.text('mygamepaused: ' + mygamepaused, 20, 20); game.debug.text('smiley_tw_pass: ' + smiley_tw_pass, 20, 40); game.debug.text('mytimepass: ' + mytimepass.duration.toFixed(0), 20, 80); } };