Search the Community

Showing results for tags 'javascript'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


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

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 676 results

  1. Orbital676

    Guess who game

    Hi, I'm trying to make a version of the Guess Who guessing game. I'm struggling with how to write the code so that the computer and human take alternate turns. Is there anyone that would be prepared to have a look at my code and help me. Im a student and only been coding a few years. This is my first post so apologies for any etiquette mistakes in the context of the forum.
  2. down votefavorite I have previous experience with Unity, but I don't like the fact that Unity compiles your game directly into APK (or IOS equivalent). It's because I want to modify the game to provide chat interface (and some other stuff) for multiplayer mode etc. So, I thot of doing it the other way - 'create an app and embed a multiplayer game within it'. Now, again this approach meant that I had to develop for android and ios seperately. But, then I came across React-Native library (mobile extension of popular React framework). Now, I have decided to create an app using React-Native (cross-platform), but now I am confused as to which game engine should I use and I think since React-Native is javascript, game engine needs to be in javascript for seamless integration. I am planning to use to embed the game in my react-native app. Can anyone suggest me any good javascript game engines that can be used along with react-native? I have done some research on Phaser and Pixi but they use WebGL for rendering and I read somewhere that doesn't have great support for WébGL or Canvas(Am I wrong?). Any help is highly appreciated
  3. I thought this would be a simple fix, but so far can't figure it out at all. I have something I call trapledges that is going to fall in the y direction when colliding with player. However, I can not get them to stop moving in the x direction if the player touch the side of them. In my code I have a commented out if test in the update function. I've tried it out both there and in the else if test where the trapledges get made. also tried out different things in the test as changing velocity.x = 0; to for example gravity = 0; or trapLedge.immovable.x = true; and so on. Still won't stop floating to the side if the player touch the sides of the ledge, instead of landing ontop of it. Added two jpgs of the game, with an arrow showing how the ledge move. A cross to show which way I want the ledge to stop move. var playState = { create: function() { for (i = 0; i < 100; i++) { var trapRandomizer = (Math.random() * 0.6) + 0.3; var randomYPos = (Math.random() * 200) + 290; var randomXSize = (Math.random() * 0.6) + 0.3; var randomYSize =(Math.random() * 0.8) + 0.6; //console.log("x: " + randomXSize + "Ran" + trapRandomizer) if (trapRandomizer > 0.4) { var ledge = platforms.create(ledgeXPos, randomYPos, "ground"); ledge.scale.setTo(randomXSize, randomYSize); ledge.body.immovable = true; } else if (trapRandomizer <= 0.4) { console.log("Trapledge"); var trapLedge = trapPlatforms.create(ledgeXPos, randomYPos, "ground"); trapLedge.scale.setTo(randomXSize, randomYSize); trapLedge.body.immovable = false; } } update: function() { /* if (game.physics.arcade.collide(trapPlatforms, player)) { trapPlatforms.body.velocity.x = 0; trapPlatforms.body.velocity.y = 300; }*/ },
  4. Zuflus

    Get a button to start the game

    Hello, I have trouble finding out how to make the start menu work together with the game. in the create() function I have this: function create() { var bg = game.add.sprite(,, "startBg"); var image = game.add.sprite(600, 300, "startButton"); bg.anchor.set(0.5); image.anchor.set(0.5); image.inputEnabled = true text = game.add.text(250, 16, "", {fill: "#ffffff"});, this);, 0, 1400, 600); game.stage.backgroundColor = '#182d3b'; game.physics.startSystem(Phaser.Physics.ARCADE); //game.add.sprite(0,0) //Background platforms =; platforms.enableBody = true; var ground = platforms.create(0,,"ground"); ground.scale.setTo(1,1); ground.body.immovable = true; var ledge = platforms.create(300, 80, "ground"); ledge.body.immovable = true; var ledge2 = platforms.create(-100, 250, "ground"); ledge2.body.immovable = true; player = game.add.sprite(64, 64, "character"); ai = game.add.image(100,100, "ghost"); player.anchor.setTo(0.5, 0.5);; game.physics.arcade.enable(player); player.body.gravity.y = 400; player.body.collideWorldBounds = true; //player.body.bounce.y = 0.2; player.animations.add("right",[11,12,13,14,15,16,17,18,20], 20, true); player.animations.add("left",[0,1,2,3,4,5,6,7,8,9], 20, true); cursors = game.input.keyboard.createCursorKeys(); } I made a large gap so it's easier to see what's the start menu and what's the game, start menu is on top. The thing is I need this, this); to make what's on the bottom. I made a function named listener that created the game when i clicked on the button. That worked, but only issue then was that the Update function that makes me able to move the character stopped working. as the update won't run over and over when I don't have the game code in the create function, it just run once and stops. How do I get these two to be more cooperative with each other ? so far I've only been able to either have one or the other.
  5. down votefavorite I keep having a problem with animations in my code. I try playing an animation and i always get the same message: "Uncaught TypeError: Cannot read property 'index' of undefined" and it always points to the same line of my code which is:'left'); Im not sure what is going wrong with it Heres my player sprite part of my create function: this.cursors =; this.player =, 10, 'player');; this.player.scale.setTo(.4,.4); //the camera will follow the player in the world; this.player.animations.add('left', [0, 1, 2, 3, 4, 5, 6], 10, true, false); this.player.animations.add('right', [11, 12, 13, 14, 15, 16, 17], 10, true, false); My temporary update function: update: function() { if (this.cursors.left.isDown) { // Move to the left this.player.body.velocity.x = -150;'left'); } else if (this.cursors.right.isDown) { // Move to the right this.player.body.velocity.x = 150;'right'); } else { // Stand still this.player.animations.stop(); this.player.frame = 4; } // Allow the player to jump if they are touching the ground. if (this.cursors.up.isDown && player.body.touching.down) { this.player.body.velocity.y = -350; } }
  6. Hi, About my project: It is intended to be an up to 2 player street-fighter/tekken type of game. For a game dev class I have to create and deploy a javascript game. I would like to add the feature that the user can use their phone as a (wireless ideally) gamepad/controller and their desktop would be the monitor to show the game (this would all have to happen in real time). I don't have any back end development skills, nor do I really have the time to pick them up, so something like Websocket would be impractical (I know there is Kaazing, but I followed their documentation step by step and this caused issues very early). My question is can I do something like this in real time with Ajax? I do not know how to use Ajax just yet, but I figure I can pick this up much faster than learning backend. If not is their something where I can just copy the code entirely include it within my project (ofcourse giving the proper credit where its due) and edit the front end to apply to my game & gamepad.
  7. Hi, I'm currently in the middle of setting up the base of my game with the use of Phaser game engine but I'm having issue with the sprite colliding with the world bounds. I've used Tiling to create the backdrop and the ground etc. But I need help understanding how to define what the sprite should be colliding with. How do I collide with the ground, which is part of the whole tile. Please see the attached 2 images, the sprite falls through the game as expected.,0, 400,300); console.log("in Game screen"); //sprite width - 180px, height 247.5px map = this.add.tilemap('level'); map.addTilesetImage('MyTile', 'tiles'); layer = map.createLayer('Tile Layer 1'); console.log("Json and sprite loaded"); sprite = this.add.sprite(,, 'character'); sprite.anchor.setTo(0.5,0.5); sprite.scale.setTo(0.2, 0.2); console.log("Character Loaded"); this.physics.startSystem(Phaser.Physics.ARCADE); this.physics.enable(sprite, Phaser.Physics.ARCADE); sprite.body.gravity.y = 500; console.log("Physics added to sprite"); The above code is in the create function, I am using state management, as you can see I've added set world bounds, when adding this the sprite dissapears, I've tried numerous different dimension but I've still not come to a solution. Any help would be much appreciated. Thanks
  8. Raptisha

    [Phaser] Match Two Game

    Hello! I am very excited to present you my recent game. I am sure you've already played this type of game, but I just wanted to build it myself. Basically, you have to pick two cards. If they are identical, both of them are removed from the board. The goal is to clear the board as quick as possible. Please, give it a try and leave a feedback! Play it here . Check out the source code . Have fun!
  9. Do you want to help create real-time multiplayer games, played by millions? And do you want to do this in a small but fast growing company, where you have direct influence on almost every facet of the game company? And do you want to earn a good salary? Hidden Monster Games is in search for a lead/senior HTML5 developer that wants to aid Hidden Monster Games in creating accessible, but competitive online multiplayer games. Work at Hidden Monster Games Hidden Monster Games currently works on expanding its game ‘Curve Fever’. Curve Fever is played by half a million players a month. The game is currently built in Unity WebGL and therefor the game loads slow and the performance is poor. We want to port the game from Unity to HTML5. We are in search for a lead/senior JavaScript developer that: - Is an expert in Pixi.js - Is an expert in React.js - Can setup a working environment for developers and designers with the following technology stack, or can propose improvements to our stack: o Pixi.js o React.js o ES6 o Node.js o Babel o NPM o Cordova - Can get our team up to speed to start using the new technology stack - Can create high performing HTML5 games for a wide variety of laptops and mobile devices - Knows how to make the game look stunning, with cool effects and animations Requirements - 3+ years professional experience on JavaScript work - You have a deep understanding of Pixi and React - You are well known with tools that make development of games with Pixi and React easier for programmers and designers/artists - You have at least a BSc degree in a technical field - You are willing to relocate, the job is onsite only in Amsterdam - You are willing to go to conferences to expand your knowledge - You have experience working with scrum - You are able to give valuable feedback on design, process and people - You are able to receive valuable feedback on design, process and people - You are able to wear multiple hats, and help out wherever necessary - The job is a full time job We offer - A small team (8 people) that is talented and ambitious - The possibility to shape a team and company - An open and flexible team culture - Direct impact on the game, we let the whole company have input on the game design - An attractive office in the city center of Amsterdam - Help with relocation - A competitive salary Salary Very competitive, depends on experience. An indication: €60k - €150k You can apply by sending an application and CV to . If you have a github or other repository that we can look into, that would be great.
  10. Indusgeeks creates game-based applications for learning and communications, based in Mumbai, India. We are currently looking for a full time (preferably Mumbai based) HTML5 Game Developer with about 3 to 6 years of prior work experience. We are a multi-award winning company in the game-based & interactive learning universe. We create applications for the mobile & web: that make learning & training more fun, immersive and interactive. Our global clients include Infosys Limited, Pearson Education, Stanford University, Cognizant Technologies, Mahindra Satyam, The Brand Union and the Government of Dubai. Your role will entail: Working in coordination and collaboration with the creative team and other programmers. Design highly scalable HTML5 game applications for use that can be accessed on browsers across multiple devices - mobile phones, tablets and desktops. Requirements for the role include: 3+ years of HTML5 game development experience (with a focus on mobile browsers). Very good knowledge of HTML5, CSS, Javascript and using WebGL and Canvas. Completed at least 4 projects which involved HTML5 coding. Up to date on HTML5 trends and best practices. Experience with optimizing design for various bandwidth and platform requirements. Strong analytical and troubleshooting skills. Excellent debugging and optimization skills. The ideal candidate will have: Prior experience working with eLearning solutions Prior experience working with Phaser, Node.js, Pixi.js Deep knowledge of mobile browsers (Webkit) Experience working with popular LMS systems. The Perks: Indusgeeks has been around for a while now, but we still retain the atmosphere of a scrappy start-up. Here, you can expect: a flat hierarchy, lots of LAN gaming (TF2 is our favorite game), free home cooked lunches, pizza and beer.
  11. I usually just reply to people asking questions, but I thought I'd show some open-source tools that you could potentially use in your games: (source) minimally display a tech tree (I did this a long time ago, and I don't really know if anybody would want me to continue working on it, but basically it lets you display a tech tree and store it fantasy map generator (source) another thing I've just started working on, which uses the code made by Martin O'Leary and attempts to quickly show the user fantasy maps. you can colour them too! yay! Anyways, those are somewhat interesting ideas that I had for games that I never really ended up using anyways... since they are MIT-licensed, I thought maybe somebody would be interested in using them and giving me feedback.
  12. pheaset

    Space Asteroid game

    My latest game. Built with phaser from a tutorial. I then built on the tutorial by adding access to the localstorage api. Here is the link Positive criticism is much appreciated as well as tips for improvements Thanks Pheaset
  13. bwimsett

    Redact - Censorship Game

    I've been working on a new type of word game called 'Redact' which involves removing letters from a sentence to reveal a hidden word. Find the game here: I went for a minimalist design with this as I felt it complemented the simplicity of the gameplay. Its designed to be played on a desktop/laptop computer, but working on mobile support! Instructions can be found by clicking the question mark in the top left. Let me know what you think!
  14. pheaset

    Help With localstorage api

    hey guys I'm currently after completing a tutorial at . I have been working on my knowledge with phaser. anyways, after finishing the tutorial i decided to polish the game. I am new to the localstorage api and was looking for some help. here is my code for the highscore. it currenly doesnt work with localstorage and im not sure why. Any help is much appreciated init: function(score) { var score = score || 0; localStorage.setItem("score", this.highestScore); this.highestScore = this.highestScore = localStorage.getItem("score"); this.highestScore = Math.max(score, this.highestScore); if(this.highestScore === null) { localStorage.setItem("score", "0") this.highestScore = localStorage.getItem("score"); } }, Here is the full file. Just incase its needed var SpaceHipster = SpaceHipster || {}; //title screen SpaceHipster.MainMenu = function(){}; SpaceHipster.MainMenu.prototype = { init: function(score) { var score = score || 0; localStorage.setItem("score", this.highestScore); this.highestScore = this.highestScore = localStorage.getItem("score"); this.highestScore = Math.max(score, this.highestScore); if(this.highestScore === null) { localStorage.setItem("score", "0") this.highestScore = localStorage.getItem("score"); } }, create: function() { //show the space tile, repeated this.background =, 0,,, 'space'); //give it speed in x this.background.autoScroll(0, 10); //start game text var text = "Tap to begin"; var style = { font: "30px Arial", fill: "#fff", align: "center" }; var t =,, text, style); t.anchor.set(0.5); //highest score text = "Highest score: "+this.highestScore; style = { font: "15px Arial", fill: "#fff", align: "center" }; var h =, + 50, text, style); h.anchor.set(0.5); }, update: function() { if( {'Game'); } } };
  15. Hello boys and girls! Is it possible to access local files, images in particular, upload them, and use in the game as a sprite? For example, player clicks a button, opens up a file dialog, chooses an images and uploads it. Later that image is going to used a background or something like that.
  16. pheaset


    Hey I am currently polishing off my Breakout or Brick-Breaker game (whichever you prefer to call it). I am trying to add music to the game when the start button is pressed and then sound effects every time a brick is destroyed. Unfortunately Phaser keeps saying Key "Sample" is not found in cache. I have tried using Phasers examples and basing the music off that but to no avail. I am new to programming with Phaser and would really appreciate the help. When the game is finished i will post a link. Thanks in Advance Pheaset here is my code var game = new Phaser.Game(480, 320, Phaser.AUTO, null, { preload: preload, create: create, update: update }); var firework;; var music = Phaser.Sound; var lives = 1; var livesText; var lifeLostText; var ball; var paddle; var bricks; var newBrick; var brickInfo; var scoreText; var score = 0; var playing = false; var startButton; function preload() { game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.pageAlignHorizontally = true; game.scale.pageAlignVertically = true; game.stage.backgroundColor = '#eee'; game.load.image('ball', 'ball.png'); game.load.image('paddle','paddle.png'); game.load.image('brick', 'img/brick.png') game.load.spritesheet('ball', 'img/wobble.png', 20, 20); game.load.spritesheet('button','button.png', 120, 40);'Good-Riddance', 'Good-Riddance.mp3'); } function create() { game.physics.startSystem(Phaser.Physics.ARCADE); startButton = game.add.button(*0.5,*0.5, 'button', startGame, this, 1, 0, 2); startButton.anchor.set(0.5); music ='Good-Riddance') ="Good-Riddance")["Good-Riddance"]); if(playing === true) { }else{ music.mute = false; }
  17. I'm having problems transferring sprite from another sprite to stage and then back to another sprite. The scenario is I have two rotating sprites (wheels) and another sprite (player). Initially, the player is added to wheelA as a child. Upon pressing fire, the player is removed from wheelA and its velocity is changed so that it moves away from wheelA. (Player is removed from wheelA so that it ignores wheelA's rotation). The player is also added to the game via game.add.existing(player); (Since it doesn't render after removing from wheelA). On update, I check if player overlaps with wheelB. On overlap, I disable the physics of the player and add it as child of wheelB. The result is player is not rendered on the scene although it is a child of wheelB.
  18. Hey guys, I am fairly new to the game engine and so far I like it. I am making a game and have ran into some issues maybe you guys can help me or even show me some examples. Right now my goal is to make a screen box. So when an object interacts with another object a question box pops up and it has a question with buttons that represent possible answers. I am stuck on the making a box pop up with it happens. Any help is appreciated, -Fellow Dev
  19. Hello people! I ran into when issue when I was developing my new game. It is a game where arrows show up on the screen and you have to swipe in the direction that the top arrow is pointing to. You have to swipe when the arrow is within a certain area on the screen (check the screenshot), represented by a faded arrow in the circle. That arrow in the circle rotates to the direction that the closes moving arrow is pointing to. I use tween for the rotation animation. Here is the problem. When the arrow in the circle is pointed to the left (angle = -180) and the incoming arrow point down (angle = 90), the arrow in the circle is animated clockwise, meaning it goes through top, right and then finally down, not straight down as I want. I have set up an if statement to switch arrow's in the circle angle to 180, but it does not work. Changing it to 179 works as expected. Why can't I change it to 180 in the first place?
  20. Hello, I have a big js code. I am interesting to create flowchart of my code. Can you should me a software, free or not, to write js code. i am testing :
  21. Hi everyone! I am currently working on a game where a player has to avoid walls that spawn on the top of the screen. I have a sprite that is a three-line road. Player can step on only one line at a time. I want the background sprite (the road) to auto scroll from top to bottom. At the same time I want it to spread across the entire screen width. To I basically want a single sprite to have the width of the screen and tile vertically. Is it possible to achieve such a thing in Phaser?
  22. infinitim

    Sprite not appearing on canvas?

    Hi everyone... I'm making a simple HTML5/JS program I plan to integrate into an existing game I have that is supposed to load an explosion sprite from a sprite sheet I created (375px by 25px, each individual sprite is 25px by 25px, 15 sprites total) onto the HTML canvas. It is not yet animated, as I haven't been able to make it actually show up (this is my problem) I'll leave the code below, if you see what's causing the problem, please leave a reply with a suggestion on how to fix (that would be really helpful as I have been making zero progress in the past hour). Thanks in advance! If it helps, I have been using code from this tutorial here: <html> <body> <canvas id="exploder"></canvas> <script> var canvas = document.getElementById("exploder"); canvas.width = 25; canvas.height = 25; var explosionImage = new Image(); explosionImage.src = "ExplosionFinal.png"; var explosion = sprite({ context: canvas.getContext("2d"), width: 25, height: 25, image: explosionImage }); function sprite(options) { var that = {}; that.context = options.context; that.width = options.width; that.height = options.height; that.image = options.image; that.render = function() { // Draw the animation that.context.drawImage( that.image, 0, 0, that.width, that.height, 0, 0, that.width, that.height); }; return that; } explosion.render(); </script> </body> </html> And when I run this in Chrome nothing is showing up in the canvas element. As far as I can tell it isn't an error with sourcing the file as when I hover over this statement here: explosionImage.src = "ExplosionFinal.png"; my text editor shows a preview of the file, with the sprite sheet showing.
  23. Hi all! Lucky Kat is an award winning mobile-first game studio based in the Netherlands. We have a mission to deliver fun game experiences with a pop-culture twist. We are the creators of mobile hits such as Nom Cat, Sky Chasers, Combo Critters and Grumpy Cat's Worst Game Ever. Our games have been featured worldwide by Apple and Google. Be at the heart of Lucky Kat’s development process creating fun and engaging (mobile) game experiences to users all around the world. We use our own proprietary game engine “Bento” which is based on HTML5 /JavaScript. As a Game Developer you will be dedicated to build games from beginning (prototyping) to the end (launch), while working together with artists and product managers. You create high quality and high performance code, and have a passion for game design. Delivering an outstanding user experience is your top priority. For more info, please go to: or send your CV and portfolio to jobs[at]
  24. Yupoong

    Animation or emitter?

    Dear readers, I want to ask a question about Phaser, if my enemy gets killed I want to start a blood animations (spritesheet) , I tried to put it in my collisionHandler where my bullet and enemy die but this doesn't work. On phaser itself I found emitters but i'm not great with that, so if someone could help me understand the logic that would be great Thanks, Yupoong
  25. JimmyBuchman

    Create Gif

    Hi, i wonder if the babylon have some function that creates a GIF for download. If this not exist, Is it possible to do with JS ?