Search the Community

Showing results for tags 'javascript'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • 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

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 687 results

  1. Hello I have problem in understanding how pixi layers work. I want to make some layers like top one, mid and bottom. I want to add players to the top layer, enemies to mid and move dead enemies to bottom layer. I tried to do this, but my sprites are invisible now. Can you provide minimum working code for pixiv4 for my problem? I init player this way: this.player = new PIXI.Sprite(texture_hero); this.player.anchor.set(0.5, 0.7); this.player.x = cords.x; this.player.y = cords.y; this.player.visible = true; container.addChild(this.player); This is how i init pixi: var type = "WebGL" if (!PIXI.utils.isWebGLSupported()) { type = "canvas" } const app = new PIXI.Application(1000, 800, { transparent: false, backgroundColor: '0x000000' }); document.body.appendChild(app.view); //var layer = new PIXI.display.Layer(); //stage.addChild(layer); var container = new PIXI.Container(); app.stage.addChild(container); My game is quite big and its hard to select code to post it here to explain my problem. If something is unclear i can post more. Thank you for your time
  2. So, I need to check whether or not the player is colliding with a tree. Once the player is colliding with a tree have it display a piece of text. Then, once the player is no-longer colliding with the tree; have the text disappear from the scene.
  3. I wanted to create a static world axes for my application using babylon js. The static axes should be like in Blender 3d editor application, their is a world axes at bottom left. The exact behavior I am looking for. Please help
  4. Today I was playing a game made in javascript, and in the game files I had several javascript files and one communicating with the other being that they all started as follows (function(){ //Codigo })(); How do I create separate files from the current one and all starting with this code so that nobody can access the function via the google chrome console?
  5. Hello i have some problems with pixi-layers.js. I want to move some sprites to top. I use pixi.v4 with this script: https://github.com/pixijs/pixi-layers/blob/layers/dist/pixi-layers.js Error message i get: pixi-layers.js:705 Uncaught TypeError: Cannot read property 'prototype' of undefined at pixi-layers.js:705 at pixi-layers.js:744 I add pixi layers in index.html this way: <script src="/socket.io/socket.io.js"></script> <script src="https://pixijs.download/v4.4.2/pixi.min.js"></script> <script src="src/pixi-layers.js"></script> <script src="src/keyboard.js"></script> <script src="src/client.js"></script> What did i do wrong? Thank you for your time.
  6. code0n

    Slot game

    While making a slot game, I need to add time delay to start individual reel and to increase its speed for which I need to increase the fps of game. So please help me out here.
  7. Hi, I'm a designer and I'd like to reach out to others for input or even collaboration. Lots of my javascript work is on github in the spirit of sharing and learning together. Like an open source sketchbook. I like making small experiments that might be included in something bigger. I often play with mechanics, audio and visual elements to look for interesting things : http://type76.com As you can see, it's lots of generated, three.js and canvas stuff, with a game dev leaning. I'm keen to go in new directions too. It's hard to find interest among my social circles, so I'm reaching out here to see if people are into this kind of thing. It's not business. It's about hitting ideas off each other, collaboration, fun and learning together. Maybe we can make an itch.io page if there is the will. You're welcome to join the discord server : https://discord.gg/KUqcuWu I'd love to see your experiments. Here or on discord. Things that aren't full games, but are fun and interesting concepts. This seems the place to look for like minded folks. Have you got a sketchbook? Is there a good CMS for this? I might be doing it wrong. Are there any other communities for this apart from discord servers full of revshare projects?
  8. Hello everyone. I'm knew here and also knew to Phaser 3. I'm working on a game currently where you play as a lost ball who is trying to make it back to his owner. Anyway, I have my player movement working fine. I but when I keypress "w" or "a" I want the ball to also continuously rotate (to look like it's rolling) while those buttons are held down. this.ball.setRotation() will only rotate the ball once. I've done a lot of digging and can't seem to find what I'm looking for. update() { // Movement (left/right) if (this.cursors.left.isDown) { this.ball.setVelocityX(-225); } else if (this.cursors.right.isDown) { this.ball.setVelocityX(225); } else { this.ball.setVelocityX(0); } // Jumping mechanic if (this.cursors.jump.isDown && this.ball.body.touching.down) { this.ball.setVelocityY(-700); } }
  9. Hi, I've been working on my game project clicker (helps me learn JS and other languages). So it is going smooth so far. Thought it might be a good idea implement a save/load feature now. The following has no errors, but loading it has no effect. INITIAL VARS var player = { name:"", level:0, gold: 190,// CHANGE BACK TO 0 AFTER TESTING artifact: 0, weaponId:0, weaponLevel:0, spellId:0, spellLevel:0, goldPerClick:5, goldPerSec:0, currentTrainer:0, }; SAVE STATE /* SETUP A SAVE STATE */ function save() { // TRY TO SAVE THE GAME try { localStorage.setItem('copperSave',JSON.stringify(player)); }catch(err) { console.log('Cannot access localStorage - browser may be old or storage may be corrupt') } console.log('Game saved successfully'); }// FUNCTION: SAVE GAME LOAD STATE /* LOAD PREVIOUS game */ function loadGame() { var gameLoad = JSON.parse(localStorage.getItem("copperSave")); player= gameLoad.player; console.log(player); // this shows the starting vars NOT the saved var from getItem! } SOME MISC VARS TO HELP DEBUG initGame(); var answer = confirm('Continue from previous saves?\nWarning, "Cancel" creates a new game wiping previous saves'); if ( answer ) { loadGame(); } console.log('here after load query'); // GAME LOOP FOLLOWS BELOW.... It looks right, can anyone suggest why it might not be loading correctly. It just gives the starting variable, not the saved variables.
  10. I am the developer of Fantasy Wars, a casual turn-based strategy game. The game can be currently played on the Apple App store (https://apple.co/2ADwNo3 ) and the Google Play store. (http://bit.ly/FWGplay ) Here is a trailer that shows some gameplay - https://www.youtube.com/watch?v=siT9azFQX04 I posted screenshots on this site when I launched the game. http://www.html5gamedevs.com/topic/40730-fantasy-wars-phaser-6-fantasy-races-fight-over-a-small-world/ I am seeking a developer to help create the sequel. While Fantasy Wars is a fun game, it is fairly simple. I am looking to add more features and create a more robust strategy game. I created the game in Phaser 2 and I imagine there will be a lot of code-reuse for the sequel. There will probably be some code refactoring as well (the result of long nights as an indie developer). Our team, Miyagi Games, consists of me and one artist. This has been a hobby project, but I cannot do all of the development myself. Requirements: Javascript/HTML5 - Phaser experience preferred. Positive attitude Nice-to-haves: Insight on mobile marketing as well as game monetization. If you are able, please install and play a few rounds to be familiar with Fantasy Wars. The game is free to download. Please pm me or reply here if you are interested. Just to clarify, we have a budget of $0.00 so this is not a paying position. However, depending on the working relationship, that may change in the future.
  11. I recently made a pop-up menu for my game which pops up after pushing a button. The problem is now that I need to figure out how to make a function that closes the menu. Here is the code: this.input.keyboard.once("keydown_D", event => { var StoreWindow = this.add.image(0, 0, 'StoreWindow').setOrigin(0); var backbutton = this.add.image(32, 34, 'backbutton', 0).setOrigin(0).setInteractive(); var testButton = this.add.image(64, 110, 'testButton', 0).setOrigin(0).setInteractive(); var storeContainer = this.add.container(32, 70, [ StoreWindow, backbutton, testButton]); storeContainer.setInteractive(new Phaser.Geom.Rectangle(0, 0, StoreWindow.width, StoreWindow.height), Phaser.Geom.Rectangle.Contains); this.input.setDraggable(storeContainer); storeContainer.on('drag', function (pointer, dragX, dragY) { this.x = dragX; this.y = dragY; backbutton.on('pointerup', function (storeContainer) { this.deletecontainer(true); }, this); }) .setScrollFactor(0) .setDepth(30);
  12. I'm looking to start making 2D games with Javascript, but after researching and looking at other games source codes, I can't decide whether to use the HTML canvas to render my games or a framework. First of all, this forum may be a little biased since it hosts many forums of rendering frameworks, so I'm looking for a clear, unbiased answer on which one would be easier and more flexible, as well as some good ones to choose from. When I first started, the obvious choice would be to use a framework, as many articles state, "There's no point in reinventing the wheel". However, after looking at some popular web-based 2D games, it seems like most like to use canvas to render. I've looked myself into Pixi.js, but even though it has some amazing features (WebGL with canvas fallback, built in loop), I feel like it still lacks the flexibility of the HTML canvas. For example, if I wanted to make a circle that can be morphed or manipulated, I could do it using canvas with curves, however, with Pixi.js, it doesn't seem to have that kind of flexibility. I'd like to know what others on this forum think, and possibly why or why not they choose to use a framework. (Keep in mind I'm looking for a rendering framework, not a full-featured game framework) Thanks!
  13. I want to present you an online coding platform that helps beginners learn JavaScript, and in the same time offers creative individuals an easy environment to build mini JavaScript games with multi-scenes, sprites and nice backgrounds: www.codeguppy.com Kids in the 80's used their home computers (Commodore 64, ZX Spectrum, etc.) as ideal platforms for learning computing concepts and coding. CodeGuppy.com tries to recreate the same experience by offering multiple coding tutorials on top of an online coding platform ideal for developing mini games. Please take a look and share you feedback! 😉
  14. I am creating a game in phaser 3 where I need to work with texture atlas. There are no useful tutorial available online and I have no idea how to even start. So here are my questions. 1) How to load a JSON atlas and draw images from it? 2) How to randomly select a texture from the atlas and draw it? Note : While packing my textures I selected JSON array option. Some tutorials which I found online. LoadingTextures RandomTexture AddingAtlas
  15. Techona's Games Developer is responsible for the development and improvement of online as well as implementing new features on existing games with a high degree of quality. He will be also responsible for the development of new features in the product architecture related to games, including all phases of the projects from analysis, design, implementation and deployment, to all layers from database to front end. The essentials of this opening are: Computer science degree (BSC) or equivalent Strong JavaScript and HTML5 knowledge Object oriented programming and design patterns Strong troubleshooting/solving skills Experience with GIT and/or other source control systems Proficient English skills Will be also nice: C/C++/C# VisualStudio 2010/2013/2015 NodeJS, JQuery, CSS, CSS3 JSON and XML Pixi JS / Spine JS Google Closure MS SQL Server WebGL MS Powershell MS Internet Information Services (IIS) A strong background in mathematics Experience with Cross-browser compatibility development Experience with mobile web development Ability to quickly adapt to existing code bases. Ability to work under pressure and tight schedules We offer: Full-time employment in Prague with flexible working hours Visa process sponsorship and relocation support Nice working environment - new offices at the office park BB Centrum – Prague 4, with table football, PlayStation and fully-stocked kitchen – snacks, fruits, vegetables, coffee, juices, etc. Bunch of benefits: meal vouchers, 12 sick days a year, Multisport Card, UNLIMITED additional days off, private pension savings contributions Professional development and trainings You can follow us on FB, LI or Instagram: https://www.facebook.com/techonasoft/ https://www.linkedin.com/company/techona/
  16. I have completed writing my free JavaScript course (begun in 2011). It is in two main parts. The first is aimed at complete beginners to introduce the whole idea of programming. It shows how to get some simple examples working and introduces some HTML5 as needed to make a platform for running the examples. It covers some general programming concepts such as writing requirements and testing against them. Part 2 is a more systematic exposition of the language, up to some of the more recent capabilities such as local storage and image processing. It is available at https://www.grelf.net/jscourse/index.html That link is to a contents page so that those who already know some of it can jump in to any particular topic of interest.
  17. My scenes with the maps I created are not loading in the browser. To get an overview of what is going on, I am creating a game RPG like game that that has a top down view of the character. The game I am making requires the character go into a store and buy some items. I think I may have found a solution for the problem of switching between maps using multiple scenes. However, the problem now is that the map isn't loading and when inspect the game in chrome an error message that reads "Uncaught Reference Error: SceneA not define at index.js: 19". I thought that I set up the code correctly. But see what I did wrong, so I will include the js file since it is over 360+ lines of code. index.js
  18. How to call a function correctly checkDown ? Now it shows an error that this function was not found. main.js function checkDown() { if (CAN_CLICK) { CAN_CLICK = false; last_pointer_position.x = game.input.activePointer.worldX; last_pointer_position.y = game.input.activePointer.worldY; setTimeout(function () { CAN_CLICK = true; }, 200) } }; game = new Phaser.Game(_GLOBAL.Width, _GLOBAL.Height, Phaser.CANVAS, 'game'); game.state.add('menu', gameCreate); game.state.start('menu'); gameCreate.js var gameCreate = { preload: function () { } create: function() { var self = this; this.game.input.onDown.add(self.checkDown, this); }
  19. Hey guys, Don't know if anyone's interested, but I've been working on a pixel art editing webapp that might be useful for game devs looking to create some pixel art or tiles or bitmaps. It's called Pixel Editor Pro and it's at: http://www.amelyn.com/pixel_editor_pro/index.htm It's free to use at the moment. Right now, I'm just looking for feedback from users about: 1. what features they would like to see in an online pixel editor 2. how the app might be improved. 3. what improvements/additions would make this a tool you would pay real cold hard cash for every month. I'm working on new features for it at the moment. I'll probably implement the following features next: - User Guide in PDF format explaining what all the different sections of the app are and what all the different buttons do :) - settings section where the user can set different preferences such as (1) size of pixel squares in the Edit Single Tile section, (2) background colour etc. - display the current row and column over which the user is hovering when editing a single tile - tile merge feature; build a new tile by merging a bunch of different tiles in sequence - multiple tile merge feature; merge a single background tile with multiple other tiles to build a bunch of new tiles Please feel free to post any and all feedback in this thread or email it to me directly at bigbadmick2000@hotmail.com. I'm going to read all feedback I receive and use it to improve the app. All feedback will be gratefully received. Cheers, Miktor
  20. I am making a top down RPG styled game using Tiled and Phaser 3. I have already made a map in Tiled for the city and store. Also, I have already set the objects for the location of the store where the player is suppose to go in order to enter the store and the location where the player is supposed to appear. The thing I am having trouble figuring out the code I am suppose to use in order to facilitate this action, as well as going back to city map. One more thing, If there are any other ideas on how to go about this I am all ears.
  21. Eternity Pilot is a mobile game made using Phaser 3 and Cordova. It is my first published game and it would have been totally impossible without Phaser and this amazing community! For now it is only available on Android but I am hoping to have an iOS version in the near future. I have a sign up on the site linked below to receive a notification when the iOS version comes out. Play Store https://eternitypilot.com Gameplay Video
  22. Hello everyone. I have built a game using Phaser. On game over, the players high score is recorded in a variable (this.inputScore). To submit their high score to the server, the player clicks a button that takes them to an Index.html page where there is a form they fill in. To avoid cheating, I want the high score variable to be passed from the game's JavaScript file (Game.js) to an input value on the form as a read only value. I have created a function (assignValue) inside the Game.js file to execute this task, but because of it's scope I cannot get the function to be read by the Index.html file. When I place the function at the top of the Game.js script (globally) the Index.html reads the function and executes it accordingly (but with a hard-coded value for testing purposes.) How can I get the Index.html file to read my assignValue() function and pass this.inputScore to the input value in Index.html? Any help would be greatly appreciated - still learning. Thanks. Game.js file: //INDEX.HTML READS THE assignValue function BELOW (WITH A HARD CODED VALUE FOR TESTING) AND //APPLIES IT BECAUSE IT IS IN GLOBAL SCOPE. BUT I NEED THE VALUE TO BE A VARIABLE TAKEN FROM THE //assignValue FUNCTION INSIDE THE GAME CODE. SEE GAME CODE BELOW: function assignValue() { document.getElementById("inputScore").value = 127; }; //GAME CODE var CrystalRunner = CrystalRunner || {}; CrystalRunner.GameState = { init: function() { //...code here }, create: function() { //...code here }, update: function() { //..code here //check if the player needs to die if(this.player.top >= this.game.world.height && this.counter === 0 || this.player.left <= 0 && this.counter === 0) { this.gameOver(); } }, gameOver: function(){ this.game.time.events.stop(); this.player.body.enable = false; //..code here this.updateHighscore(); //..code here }, updateHighscore: function(){ this.highScore = +localStorage.getItem('highScore'); if(this.highScore < this.myScore){ this.highScore = this.myScore; this.inputScore = this.highScore; this.congrats = this.game.add.sprite(this.game.world.centerX-193, this.game.world.centerY-20, 'congrats'); this.congrats.inputEnabled = true; this.congrats.fixedToCamera = true; this.submitScoreButton = this.game.add.sprite(this.game.world.centerX-135, this.game.world.centerY+100, 'submitScoreButton'); this.submitScoreButton.inputEnabled = true; this.submitScoreButton.fixedToCamera = true; this.submitScoreButton.events.onInputUp.add(function() { window.location.href = "index1.php"; }, this); } localStorage.setItem('highScore', this.highScore); }, //THE FUNCTION BELOW IS NOT BEING READ BECAUSE OF SCOPE. HOW TO I MAKE INDEX.HTML READ IT? assignValue: function() { document.getElementById("inputScore").value = this.inputScore; }, }; Index.html file: <?php require_once 'dbconnect.php'; ?> <!DOCTYPE html> <html lang="en"> <head> <title>Crystal Candy Game Login</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css"/> <link href="css/style.css" rel="stylesheet"> <script type='text/javascript' src='js/jquery-2.2.3.min.js'></script> <script> $(window).on('load', function() { $('#status').fadeOut(); $('#preloader').delay(350).fadeOut('slow'); $('body').delay(350).css({'overflow':'visible'}); }) </script> </head> <body onload="assignValue()" class="bg"> <div id="preloader"> <div id="status">&nbsp;</div> </div> <div class="wrapper"> <div class="texte"> <header> <h1>SUBMIT YOUR SCORE</h1> <img id="logo" src="assets/images/logo.png"> </header> <p>Submit your highscore and you could stand a chance to win a prize!</p> </div> <div id="main"> <form id="form-style" method="post" action="crystalhandle.php" autocomplete="off"> <div class="form-group"> <label class="header-text"><span>First Name</span></label> <input class="form-control" type="text" id="name" name="username" placeholder="Name" title="Please enter your Firstname" required=""> </div> <div class="form-group"> <label class="header-text"><span>Surname</span></label> <input class="form-control" type="text" id="name" name="surname" placeholder="Surname" title="Please enter your Lastname" required=""> </div> <div class="form-group"> <label class="header-text"><span>Email</span></label> <input class="form-control" type="email" id="email" name="email" placeholder="Mail@example.com" title="Please enter a Valid Email Address" required=""> </div> <div class="form-group"> <label class="header-text"><span>Phone</span></label> <input class="form-control" type="tel" id="name" name="phone" placeholder="Phone" title="Please enter your Phone No" required=""> </div> <div class="form-group"> <label class="header-text"><span>Score</span></label> <input class="form-control" type="tel" id="inputScore" name="score" value="" readonly> </div> <!-- I need the above input value to have the variable from assignValue inserted into it--> <div class="w3ls-btn form-group"> <div class="wthreesubmitaits"> <input type="submit" name="signup" id="reg" class="button" id="next1" value="Send" style="font-family: sans-serif; font-size: 17px; font-weight: bold;" </div> </div> </form> </div> </div> <script type="text/javascript" src="js/phaser.min.js"></script> <!--the below js file is where assignValue() is defined:--> <script type="text/javascript" src="js/states/Game.js"/></script> </body> </html>
  23. Im receiving websocket messages on my webpage, and i'm trying to calculate the frequency at which they are received. I do this like so: let startTime = new Date(); ws.onmessage = function (evt) { prevData = recivedData; var receivedMsg = evt.data; recivedData = JSON.parse(receivedMsg); const endTime = new Date(); const timeDif = endTime - startTime; startTime = endTime; console.log(timeDif) } But it seems timeDif sometimes is 0, and I find this unlikely. People in other questions of mine have sad that its due to the websocket buffering incoming messages. How do I prevent this?
  24. As some have already pointed out in this forum there is a problem with scenes stretching ahead with a sudden cut-off at a horizon. Objects just beyond the horizon suddenly pop completely into view on the slightest forward movement. I have addressed this in my program The Forest ( https://www.myforest.uk ) by making the scene hazy (or foggy) towards the horizon, if the user switches this effect on via a check box on the page. A couple of example scenes are attached here. I have written a detailed description of how I programmed it ( https://www.grelf.net/forestdesign.html#fog ). My code is plain HTML5/JavaScript using no framework and only the standard 2D graphics context because I want my program to run on as many platforms as possible. So my documentation explains how to process images in that environment and indeed how to copy an object of type Image complete with its pixel data, which is not entirely obvious or straightforward. I hope this may be useful to others.
  25. I want to do the same animation for bending card but unable to do so using css and border-radius property. Is there any property or method by which we can make it happen.. Plz help me regarding it.. card folding (1).mp4