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
    • Web Gaming Platform
    • 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 693 results

  1. I want to share a small PDF booklet with JavaScript coding challenges: https://codeguppy.com/site/download/50_coding_challenges.pdf These coding challenges are designed for beginners and intended to offer the foundation that they may need when developing mini-games on https://codeguppy.com or any other platform.
  2. Hello guys, I'm Hipreme(aka MrcSnm). I have some experience developping some games, and over the time I developed these games I found some need of having a tool that would generate enum for acessing my resources via intellisense. This tools is Licensed on LGPL 3 In every game I developed, at some time, I wrote some code for storing in variables the path for my resources or some easier access. By thinking in this problem, I created one tool that is meant to help every game developer in any language by dynamically updating these resource enumerators when you drag'n drop in your folder a new resource. This tool is very customizable for your needs by accessing its generated file 'settings.config', it is a jar executable that will create one system tray icon on your notification area(already tested on Windows, but I think that it should work on Unix like systems). I already was able to make enums for Javascript, JSON, C++, C, Java and the default one C#. Everything just by tweaking the configs. In this tool you will set an Input path, then the executable will start to listen to this input path. After that, you can set one output path for where the generated file will be created. Every time you save the config file, or drag'n drop some file in a folder that is being listened, it will update the enum generated. That's all folks, hope this tools can help in your development. Access for this tool: https://github.com/MrcSnm/ResourceEnumGenerator
  3. 3D perspective is perfectly possible in the plain 2D canvas of HTML5/JavaScript without the overhead of any frameworks or libraries. As an example I have recently created a small game in response to a GameDev challenge relating to DOOM. I was troubled by a bug in my display when the player moved close to walls. I sat down and made some diagrams to help me get my thinking straight and then I was able to solve the bug. I thought others might find my diagrams useful so I am adding them here. My aim is to demonstrate that 3D perspective is perfectly possible in the plain 2D graphics context. I believe that it is simplest for beginners to start in this way, getting familiar with JavaScript without the additional learning curves presented by the various frameworks. You can read about what I have just done in relation to DOOM here (which has a link to my little game): https://www.grelf.net/predoom/info.html The code was adapted from my earlier and more complex game, The Forest: https://www.myforest.uk/ (I now need to add a correction to the drawing of the mines in that program, having solved the bug).
  4. I am trying to add Lottie animation in the Phaser 3 in my game. But I am not able to add. Lottie Animation link. This is how I am adding into my code : this.animation = bodymovin.loadAnimation({ container: document.getElementById("game"), // Required path: "assets/json/RainLoop.json", // Required renderer: "canvas", // Required loop: true, // Optional autoplay: true, // Optional name: "Hello World", // Name for future reference. Optional. }); But here problem is, this animation is attaching to the HTML DOM elements and so that the animation comes above the Phaser game canvas, Due to what I am not able to interact with my phaser game elements.
  5. FoobarIT

    Game Data

    Hi, I'm looking for a method to save the progress of my game. I already use localstorage but I would like to know if there is better system. Thank you.
  6. I have recently discovered a couple of useful pages about improving the speed of canvas operations. I will give links to those pages at the bottom of this item but first let me describe a good speed-up I got as a result of reading them. In my program The Forest (myforest.uk) I am continually looking for ways to improve the speed of drawing scenes. I have made several improvements already but this new one is very useful indeed. I have a Scene object with method draw() which is invoked whenever the observer moves or turns. From its earliest incarnation this method has reported how long it takes, so I can monitor what is going on. Its first line is var t0 = new Date ().getTime (); // ms and its last line calculates a difference and displays it in a status line on the HTML page: var dt = new Date ().getTime () - t0; forest.infoDiv.innerHTML = me.toString () + ", Drawn in " + dt + "ms (" + this.nDrawIms + " images)"; I have augmented that so that the constructor of forest.scene includes this.drawingTimes = ''; and a new final line at the end of draw(): this.drawingTimes += dt + '<br>'; I can cause drawing of the same scene over and over again by clicking a button labelled 'Look level' (as opposed to up or down buttons which would draw a slightly different view of the scene). This means I can build up a long string of forest.scene.drawingTimes. Then in a testing version I can press an otherwise unused key to dump those times as the innerHTML of a div in my HTML test page. The <br>s mean that I get a vertical column of values which I can then select, copy and paste into a spreadsheet (I use OpenOffice). Then it is easy to get the mean and standard deviation of the column. I did that twice for a large number of values. First with my last released version of The Forest and then with a tiny enhancement so that just before every time drawImage(im, x, y, width, height) is called I do this: x |= 0; y |= 0; Those are bitwise OR operations and their effect is simply to chop off the fractional parts of the screen coordinates x and y. This means that drawing starts on an exact pixel and does not require interpolation. The results: without the truncation (ORing) the mean time was 140.9ms with a standard deviation of 35.3ms; truncated the mean was 85.7ms and standard deviation 23.7ms. That is a very significant and useful improvement, so it will be going into my next version. The scene drawn here involved 1,693 calls to drawImage(), scaling each image (tree, ground, and other features) differently each time. From this big improvement I deduce that once drawImage() starts on an integer pixel then it uses integer pixels in the destination to decide where to get pixels from in the original image for scaling. In hindsight this is rather obvious really but I thought it would be useful to others to see how I went about proving the effect. I have noted before in this forum that the drawing time varies quite widely (as shown by the standard deviations) and I still attribute that to the workings of the garbage collector in the background. I should also point out that so far I have only measured this in FireFox. If you want to see more clearly what I am taking about, The Forest is at www.myforest.uk - from the initial map use the button (or key) to go to the scene. The pages which prompted this are: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas https://www.html5rocks.com/en/tutorials/canvas/performance/
  7. 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
  8. 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.
  9. 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
  10. 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?
  11. 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.
  12. 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.
  13. 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?
  14. 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); } }
  15. 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.
  16. 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.
  17. 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);
  18. 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!
  19. 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! 😉
  20. 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
  21. 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/
  22. 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.
  23. 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
  24. 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); }
  25. 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