Search the Community

Showing results for tags 'typescript'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


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

Found 200 results

  1. I'm trying to understand how to setup my tsconfig configuration to work properly with Visual studio community 2017 and my project. The structur of the project is: root debug platformA fileX tsconfig.caseA.json platformB fileX tsconfig.caseB.json platformC fileX tsconfig.caseC.json release platformA fileX tsconfig.caseA.json platformB fileX tsconfig.caseB.json platformC fileX tsconfig.caseC.json tsconfig.json How can I do to let Visual studio understand what fileX read and give me his intellisense? How can I tell him to compile tsconfig.json and then just the correct one of the other three tsconfig? I've looked at the documentation but I didn't understand how to do that. Can anyone help me, please? Thanks!
  2. Hi guys, I was looking for a Phaser boilerplate, simple, clean to get me started but what I've found on the web was outdated, too complex or didn't do the right thing (at least for me) so I've decided to create my own. The Phaser boilerplate that I've put together comes with: - the latest version of Phaser CE 2.9.4 - TypeScript - Howler.js 2.0.7 (an awesome audio library) - can be removed if one does not need it - Webpack 3.10.0 - ... and few things to get a game up and running in no time Some of the awesome features: There is a integrated TypeScript linter that checks your code for readability, maintainability, and functionality errors (we need to code proper ). The code is watched so any change you make the browser refreshes (unless you have errors in your code). I've added a command to pack your code (minify, uglify, comments removal, console.log removals, etc). The uglify process is only applied on your custom code, not on vendor library so that you won't end up with extra MBs in your final build. The boilerplate is available here: Let me know what you think! Hope it will be useful for the community!
  3. [WIP] Kawaii Ketchup

    I've kinda been developing this game in a vacuum. So, if it wouldn't be too much trouble for you, and if you would like to, could you give me criticism or feedback such as what the game does that appeals to you or what the game does that you don't like? I might be missing something, I think. It's still a work in progress (kinda like an alpha version?) and I hope to have it really polished by the end of the first quarter of 2018. Also, I kinda just wanted to share and promote the game It's like an arcade game where you try to avoid getting hit by flying ketchup bottles and then you eat raisins in order to stay alive. And also, you can look at the source code.
  4. Hi everyone, I've been working on a pixi.js - typescript boilerplate using webpack that I would like to share just in case someone finds it of any use. It comes with a helper class to manage some "trivial" tasks such as resizing, stage alignment, toggling full-screen and some utilities like fps-meter and a container to display some visual info. It's a bit heavy on dependencies though. Any suggestion, bug report or improvement submitted would be very much appreciated. Thanks!
  5. Cardinal Run

    Hi, I am finishing this year with a NEW GAME! I am super glad - also was about time to stop working on it. You can play the game here I hope the game performance is alright. I noticed little lag here and there. Not sure if I can fix it. Game was developed using pixi.js, pixi particles and howler.js Gameplay video Some screenshots:
  6. Preferred Language for Phaser?

    That is basically it guys. Which is your preferred language for phaser. If its other I don't know please write a comment.
  7. Best Typescript/Phaser IDE?

    A couple years ago a built an Asteroids clone using JS and Phaser on Cloud9 ( Was a great experience and a great way to learn JS. I'm now looking at a second game that I'd like to code with Typescript and distribute on the Android platform and possibly iOS. C9 has since been bought by Amazon and not supporting the C9 IDE as much. Regardless, it never supported breakpoints for JS, so had to debug using the Chome dev tools. My day job is coding C++ on visual studio. What's the best IDE for coding Typescript for Phaser? Ideally (for me) it would be close to Visual Studio experience (e.g., eclipse) but I'm up for something different. Mostly, I'd like to get away from the clunky C9 / Chome debugging.
  8. loading a text file in phaser with typescript is trival with a simple:"reference", "url") however attempting to write or modify external text files appears to be way more complicated. I'm guessing this is for security reasons, but still don't see why there can't be a "game.write.text()" method or something similar?
  9. First of all Is it called "module" or "library" if it extends pixi.js' functionality? How to use them with Typescript? I'm not totally new to typescript but aren't pro w/ it at all. I added pixi.js and the typings via npm (and successfully use npm-modules and their @types in typescript for the server of this project) But when it comes to pixi.js modules things get weird, it's not enough to add them via npm and adding import * as Stuff from 'pixi-module' which makes sense, because afaik they extend the PIXI namespaces. So I tried adding this reference thing /// <reference path="../node_modules/pixi-module/stuff.d.ts"> but even that did only work half-way. Hard to explain but it was like adding the Apples to PIXI, but not the AppleTree, if I may explain it this way. Even with `require('pixi-module')` Even stranger: VSCode finds the module and even suggests it when writing an import statement. But after auto-completing it, it tells me the module is not found. (The webpack run tells me so, too.) Tried it with @ivan.popelyshev pixi-projection, failed half-way and tried it again with pixi-particles. None of them did work as expected in the end. Wat? To conclude this: How to add modules after `npm install pixi-module` in my Typescript code, where I did `import * as PIXI from 'pixi.js'` Thanks <3
  10. Typescript vs Javascript

    Hello everyone, I've decided to start with PhaserJs, at the getting started page there is a sentence that reads "If you're coming from Flash / AS3 then we'd recommend giving a TypeScript a go"... And yes I coming pretty much from 12 years of Flash. Someone please could explain my what are the advantage of code in TypeScript and also recommend a IDE? Thanks in advance
  11. Arrows - Move Ship Space - Fire Weapon A, S, D - Change Weapon 3 Power Ups : - Slow Time - Speed - Shield
  12. OBJ Exporter help?

    So, with some googling i found this... the problem is, it's in TypeScript (I don't know what this is even)... I don't know how to implement this any time i try using this i get unexpected identifiers. (I also noticed this TypeScript language is really similar to c# lol). So how would i use this... I know this is very nooby but meh
  13. Hi, I am trying to use the Arcade-Slopes plugin in Typescript, but I'm not sure how to do it. I added a ref to the .d.ts file in tsconfig.json: "files": [ "./src/app.ts", "./vendor/phaser.d.ts", "./vendor/phaser-arcade-slopes.d.ts" ] This is how I'm trying to load the plugin. // enable arcade slopes plgin; But when I try to convert the collision layer: // Convert the collision layer to work with Arcade Slopes, 'arcadeslopes'); I get the following errors: src/app.ts(71,26): error TS2339: Property 'convertTilemapLayer' does not exist on type 'ArcadeSlopes'. vendor/phaser-arcade-slopes.d.ts(61,5): error TS7010: 'resolve', which lacks return-type annotation, implicitly has an 'any' return type. vendor/phaser-arcade-slopes.d.ts(156,17): error TS2304: Cannot find name 'object'. vendor/phaser-arcade-slopes.d.ts(157,14): error TS2304: Cannot find name 'object'. vendor/phaser-arcade-slopes.d.ts(238,3): error TS7010: 'clear', which lacks return-type annotation, implicitly has an 'any' return type. It looks like the arcade slopes .d.ts file isn't compiling properly either. Has anyone managed to use Arcade Slopes successfully with Typescript? I'm seriously considering restarting with plain old JS to avoid this problems.
  14. I'm just starting out with Phaser and not sure why I shouldn't use TS. It seems better to me. Not sure if there are any benefits over using JS.
  15. const ASSETS:string = "./assets"; // Simple game. class SimpleGame { phaser_game:Phaser.Game; constructor () { this.phaser_game = new Phaser.Game( 800, 600, Phaser.AUTO, "phaser", { create: this.create, preload: this.preload } ); } create () { let piplup_sprite:Phaser.Sprite = this.phaser_game.add.sprite(,, "logo" ); piplup_sprite.anchor.setTo(0.5, 0.5); } preload () { let piplup_sprite_path:string = ASSETS + "/piplup.png"; console.log(this.phaser_game); // Undefined? this.phaser_game.load.image("logo", piplup_sprite_path); } } window.onload = () => { let simple_game:SimpleGame = new SimpleGame(); }; I suppose the title is self-explanatory. I used Phaser with vanilla JavaScript before. Decided to learn TS but I got stuck why the `this.phaser_game` is undefined, while it is clearly defined in `constructor`?
  16. Phaser with Kotlin

    Hello. I've made a repository with a template and ported 568 examples of Phaser with Kotlin. Kotlin is a modern statically typed programming language that compiles to Javascript and now it can be used to code Phaser games!
  17. In my tsconfig.json I have "strictNullChecks": true That won't let me have something like: function unsetParent(mesh: AbstractMash) { mesh.setParent(null); } Error TS2345 (TS) Argument of type 'null' is not assignable to parameter of type 'AbstractMesh'. I didn't see a tsconfig in BabylonJS project. Seems like it should be setParent(mesh: AbstractMesh | null){...}? Or is it just not support to have strictNullChecks.
  18. Create React App + BabylonJS

    With the recently added NPM support added in 3.1.0alpha3.4 and some popular React ES6/Typescript starter kits being deprecated in favour of CRA (, I wanted to finally try out importing GUI with CRA + TypeScript. Thought I would put up a repo for anybody interested. Here is the demo: Source: Source for page with BabylonJS: So, it's pretty straightforward from the docs (, but also in practice turned out quite fast to get started.
  19. Hello , I'm super new to Typescript , html5 , and I'm looking for some direction, so I started my first "hello world" game and I would like to know how to host it(web host). I have windows hosting through Arvixe... not sure what is required I'm using visual studio 2015 and typescript Thank you in advance Jimmy
  20. [Help] Access function in html file

    Hello there, I am relatively new to game development. I have defined a function ShowAds() within the html index file <script type="text/javascript"> var version = 'dev', libs = [ ]; var game = new StuddGames.AppBoot(); function ShowAds() { console.log("Show Ad"); } </script> is there a way i can call this function from typescript within the game code? Thanks for your help
  21. I'm stuck with loading my meshes. I'm new to all the 3D and modelling so any thoughts are highly appreciated. Basically I want to extends Babylons default Mesh class called BaseMesh and add a 'load' function to it to get rid of clutter in my scene code. I'm extending this BaseMesh class for each model I have. My BaseMesh class: (Note that all code examples are written in TypeScript) // BaseMesh.ts class BaseMesh /* extends BABLYON.Mesh */ { public readonly BASE_URL: string; // I want these to be static public readonly MODEL_URL: string; // I want these to be static public readonly NAME: string; // I want these to be static public body; /* constructor( scene ) { // I don't know what to do here super( this.NAME //name scene // scene null // parent ? // source ); } */ public load( assetsManager: BABYLON.AssetsManager ) { return assetsManager.addMeshTask( this.NAME + ' task', // name "", this.BASE_URL, this.MODEL_URL ); } public onLoaded( results ) { // I don't know what to do here this.body = results.loadedMeshes[0]; } public update(): void {} }; A model class would looks like this: // Robot.ts class Robot extends BaseMesh { public readonly BASE_URL: string = '/models/'; public readonly MODEL_URL: string = 'robot.babylon'; public readonly NAME: string = 'robotMesh'; public update(): void { this.body.rotation.y += 0.03; } } In my code above I store the loadedMesh from the AssetsManager into this.body. But here is question 1: why is my model already showing on the scene when the meshtask has run? I'm only loading a mesh, I've not put anything about putting it on the scene. Question 2: How do I extend my BaseMesh class from BABLYON.Mesh so that the result (loadedMeshes) of my load function is "the mesh itself" (instead of an attribute this.body). For example this would mean I could change my update function to 'this.rotation.y += 0.03;' and just generally makes more sense. Question 3: I'm really confused about the relationship between my "code" and my "model/.babylon files". Is there any good documentation/tutorials about this? These questions range from: - when is it healthy to split different parts of a model in different files - do I apply textures in my code or do I do that in my .babylon file - do I apply animations in my blender file or do I code them - ... This was a pain to type, if you have any questions please do ask Thank you in advance!
  22. I wrote an interactive neural network visualization web program where people can explore the inner workings of neural networks. Here is the description page (where I mention and link to BabylonJS in the FAQ): This is the browser-based application:
  23. Hi, So, I've been following many tutorials but appear to be stuck at the first hurdle. I don't appear to be able to use the Debug Inspector if I'm using TypeScript and ES6 imports. I've setup my first scene using the initial tutorial (a sphere and a surface) on the website just fine using the TypeScript documentation (creating a Game class and so on). To do this in the ES6 way I import BabylonJS from node_modules by doing import * as BABYLON from 'babylonjs'; at the top of my .ts file and it works like a charm. Then I add; to show the debug panel and I'm then faced with the following error in the Chrome debug console: babylon.inspector.bundle.js:408 Uncaught ReferenceError: BABYLON is not defined at INSPECTOR (babylon.inspector.bundle.js:408) at Object.t (babylon.inspector.bundle.js:408) at __webpack_require__ (babylon.inspector.bundle.js:21) at Object.<anonymous> (babylon.inspector.bundle.js:49) at __webpack_require__ (babylon.inspector.bundle.js:21) at babylon.inspector.bundle.js:41 at babylon.inspector.bundle.js:44 This is because it's absolutely right, the namespace BABYLON isn't included globally, my application is ES6, imports libraries where needed and then concatenates using Webpack. I moved to BabylonJS because it's dev team seemed to embrace TypeScript and ES6 but can't believe that something like this would have been overlooked? So that leads me to thinking I'm doing something wrong here. The only way I can see this working (which I found some libraries to do) is if the show() function to take the BABYLON object directly as an optional parameter, rather than expect for it to exist on the window (because it won't if you're importing ES6 style and webpacking). Open to thoughts and suggestions on this one as I'm new to BabylonJS. If I'm right with the above and it's just not something that has been done yet, I don't mind submitting a pull request.
  24. I was trying to layout 3 columns of buttons. The buttons are GUI.Controls. Each column could be a GUI.StackPanel. As far as adding the 3 StackPanels to the texture you might add them to the GUI.AdvancedDynamicTexture using addControl(control :Control). No idea what would happen layout wise. Adding a StackPanel to an AdvancedDynamicTexture works though. If you were to do this in Typescript you would error GUI.StackPanel inherits from GUI.Container. GUI.Control is a root class. Should not the AdvancedDynamicTexture signature for add/removeControl be: public addControl(control: Control|Container): AdvancedDynamicTexture You might also add the 3 stackPanels in to a larger one with horizontal orientation. You could expect to know what would happen. Container.addControl seems to have the same problem, yet Control.AddHeader() does that.
  25. Hey all, just wondering if anyone could spare their knowledge on getting started with PIXI.js with Typescript I've made a couple of simple games now using PIXI.js and love it! Though really find javascript a pain to use as the games get bigger with all code being in 1 js file. What I want to start doing is making a library around PIXI.js for common things I will need (e.g. controls, grid layouts, etc) and build it up from there. Something so simple with UnityC# and even FlashAS3 that I always took for granted! I understand Typescript maybe the best way to do this, though am a little confused about the difference between all the options (Browserify, Babel, ES6, Typescript etc) what they all actually do what if any of those I will need, and what is the best way forward! Many thanks for any advice!