Search the Community

Showing results for tags 'typescript'.



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
  • 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 244 results

  1. Hello, I began to make a Battle City clone for studying a programming in TypeScript and Phaser. You can run it: https://8observer8.bitbucket.io/Phaser/BattleCity/dist/ I don't understand how to write an algorithm for snapping a tank to a grid how it is in an original game. When I turn a tank I need to snap tank coordinates to: 16, 32, 48, 64, ..., 384, 400. Thank you in advance
  2. Hi, I guess this is a question and an answer, but not an announcement. I wanted to switch my BabylonJS game from javascript to TypeScript and wanted to share my experience in case it will help somebody else - otherwise looking forward to finding an even better way! The project template I used will run on Windows, Linux and Mac. My javascript was getting a bit unwieldy, so I looked around for a TypeScript solution that would also be easy to deploy and integrate later with server-side. I found that I was doing a lot of things in javascript by convention (ie: 'name' property on meshes) and I wanted the benefits of the structural typing provided by TypeScript - so, a compiler to pick up on my mistakes instead of run-time errors. I got additional benefits like better intellisense and less bugs (actually found bugs during the conversion!). My code is easier to read and my intent is sometimes clearer on the purpose of functions. Since switching a couple of weeks ago, I have found that my code is a lot easier to maintain and most importantly much easier to change and there was not a big learning curve. I checked out quite a few solutions like starter kits with TypeScript and settled on using the Microsoft SPA templates. I created a github demo repo: https://github.com/brianzinn/dotnet-new-babylonjs-starter The first commit is generated by the template and the second commit were the changes to add BabylonJS and create the attached screen. If you opt for Visual Studio you can put a break point in your TypeScript and it will break on code running in your scene. I only installed the free community version of Visual Studio, which installs the .NET Core dependencies as well. In the attachment can see that I clicked on the sphere in the scene and I can inspect the Mesh properties in the IDE. Nothing really new if you are used to the browser debugger, but nice that you can use your IDE and it will break in Chrome or IE. If you haven't used other transpilers like TypeScript/GWT that generate code maps for javascript, keep in mind you are breaking on TypeScript, but the browser is running javascript. You can look at the generated javascript in ./wwwroot/dist (that is what is served to the browser). I attached a breakpoint and the BabylonJS scene of the project running. Have Fun!!
  3. Hi, We just published an article about how to install TypeScript IDE inside Phaser Editor. This allow you to create Phaser projects with TypeScript support and edit/compile the TypeScript files. Read the article here
  4. Hi, we are happy to announce a new (preview) release of Phaser Editor! There are a lot this time: The so waited MacOS support! Visual prefabs (sprites and groups). Visual editor support for states and preloader states. Some TypeScript support. Assets refactorings (great for larger projects) New Project wizards with more options (like include demo assets or use TypeScript). Updated Phaser Editor demos with prefabs and multi-levels. Git UI integration. And lot of fixes and enhancements. Many of them requested by Phaser Editor users (that's great, so many thanks!) Read the release notes. Arian
  5. PearFiction Studios is looking for an experienced HTML5 Game Developer to work with our highly talented Montreal team. Develop the next generation of online casino games in our cool loft style office in the trendy Plateau Mont-Royal district. If you have a personality to handle responsibility and collaborate in a small team environment, we'd love to have you join PearFiction Studio's dev team. Candidates should have an interest in online, mobile, and social casino games. You will be responsible for: Participating in designing the front-end aspects of a game design including entertainment, pacing, features, and UI functionality. Designing, developing, and maintaining games in HTML5. Developing new front-end game development tools, features, or extending current ones. Creating and owning all design documentation and deliverables for our HTML5 game development toolset. Developing new casino games with our HTML5 game development toolset. Integrating the game graphics and visual effects. Integrating the game business requirements and features. Ensuring entertainment value to end users. Maintain and test HTML5 games and tools to ensure stability. Essential Experience: Technical degree or higher in computer science Minimum of three years of HTML5 (Canvas and JavaScript/Typescript) game development for mobile and desktop platforms. Experience with Pixi.js or Phaser.io JavaScript/CSS frameworks. Solid knowledge of Object Oriented Programming, MVC and other design principles. Experience working in agile and iterative environments. Familiarity with project tracking tools such as JIRA or Trello. Familiarity with Git and feature branching approach. Understanding web browser game development, with focus on mobile. A flair for game graphics programming, animations, effects, and optimization for best performance for online and mobile use. Desirable Experience: Experience developing slot machine front ends. Good understanding of casino games and real money gaming mathematics. Experience working with graphically performance-heavy web applications. Experience with client-server integrations and serialization techniques. Open to challenges of learning new languages, technologies, frameworks and approaches to development. Experience in game development projects (hobby or professional). Experience with other programming languages (C#, Java, / PHP / Python / C++, etc) is an asset. Genuinely wants to do a good job as a matter of pride in one’s work. Keen to learn and demonstrate ability. Self-motivated. Bilingual (French and English) is an asset. You can apply on our website here -> http://pearfiction.com/careers/ or via LinkedIn here -> https://www.linkedin.com/jobs/cap/view/271185313/?pathWildcard=271185313&trk=job_capjs
  6. Hello, I'm trying to add animations to a class which is extending Phaser.Sprite export class PlayerEntity extends Phaser.Sprite { constructor(game: Phaser.Game, x: number, y: number) { super(game, x, y); this.game.add.sprite(x, y, "player"); // Error this.animations.add("down", [0, 1, 2, 3], 10, true); this.animations.add("left", [8, 9, 10], 11, true); this.animations.add("right", [4, 5, 6, 7], 10, true); this.animations.add("up", [12, 13, 14, 15], 10, true); this.animations.play("down", 4, true); this.game.add.existing(this); } } Stacktrace: Uncaught TypeError: Cannot read property 'getFrameIndexes' of null at c.AnimationManager.add (phaser.min.js:19) at new PlayerEntity (:9000/js/entity/playerentity.js:18) at l.CreatePlayer (:9000/js/entity/entityfactory.js:5) at Level01.create (:9000/js/level/level01.js:20) at LevelController.create (:9000/js/level/controller.js:15) at WorldController.create (:9000/js/world/controller.js:27) at c.StateManager.loadComplete (phaser.min.js:10) at c.Loader.finishedLoading (phaser.min.js:20) at c.Loader.processLoadQueue (phaser.min.js:20) at c.Loader.asyncComplete (phaser.min.js:20) So "this.animations.add..." is the problem. this.game.add.existing(this); Doesn't have any effect. Thanks for reading and any help is appreciated!
  7. If you want to start testing WebGL 2 in TypeScript I have already written a definition file right here that you can use Reason I wrote this is because I couldn't find reliable ones on Internet (they were very obsolete) and currently TypeScript doesn't support WebGL 2 Edit: In order to use WebGL 2 API in code you need to write: const CANVAS: HTMLCanvasElement = document.getElementById("myCanvas") as HTMLCanvasElement; // get canvas element let GL: WebGLRenderingContext & WebGL2RenderingContext = CANVAS.getContext("webgl2") as any; // get webgl2 context
  8. Hi, I'm writing a class that extends Phaser.Weapon and i want that the method update() keep running, like this: class MissileWeapon extends Phaser.Weapon { constructor(game: Phaser.Game){ super(game, game.plugins); } update(){ /*this not execute*/ } } But it not running. If i add this "hack": class MissileWeapon extends Phaser.Weapon { constructor(game: Phaser.Game){ super(game, game.plugins); /*the hack*/ this.active = true; /*active plugin*/ this.hasUpdate = true; var test = game.plugins.add(Phaser.Weapon); /*Only for the game.plugins(PluginManager) start running*/ game.plugins.plugins.push(this); /*add my weapon in the PluginManager*/ } update(){ /*executing */ } } It seems that when extends of plugin Weapon, it not is added direct in the game.plugins (PluginManager), then the method update not executes. How could i make this without uses the "hack"? and i'm using Phaser version 2.6.2 thanks :-)
  9. Hi, I realized that I was not using the right indention and formatting option for the typescript files and this added a lot of unwelcomed whitespaces, linebreaks etc.. Is there a current formatting guideline for babylonjs ? If yes, would you consider adding it to the .tsconfig ? These are apparently my default ts formating settings. { "formatCodeOptions": { "indentSize": 4, "tabSize": 4, "newLineCharacter": "\r\n", "convertTabsToSpaces": true, "insertSpaceAfterCommaDelimiter": true, "insertSpaceAfterSemicolonInForStatements": true, "insertSpaceBeforeAndAfterBinaryOperators": true, "insertSpaceAfterKeywordsInControlFlowStatements": true, "insertSpaceAfterFunctionKeywordForAnonymousFunctions": false, "insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false, "placeOpenBraceOnNewLineForFunctions": false, "placeOpenBraceOnNewLineForControlBlocks": false } } Thanks !
  10. I built a 1st release of entity system with typescript. You can find the library at https://github.com/francoagusto/entities and here an example with a quick developed game shooter (crimson like): https://github.com/francoagusto/entities-example I hear suggestions.. Thanks
  11. @Deltakosh @davrous In the past year I've and others have seen a huge shift to Typescript. Why? In my opinion it is only creating a gap between native JS and those who might wish to use a wrap-around language - which has far less advantages than native WebGL. And for the future, will create serious limitations and divisions between users. Please explain the advantage to .TS files in the Github src directory of recent versions of BJS - if you can come up with ANY good reasons. Sorry if this sounds a bit harsh, but I'm having issues working with BJS for the first time in more than 2 years due to reading and working with Typescript. DB
  12. let mat1 : BABYLON.StandardMaterial = new BABYLON.StandardMaterial("mat1", scene); let mesh1 = new BABYLON.Mesh("mesh1", scene); mesh1.material = mat1; mesh1.material.opacityTexture = null; // '<-- This is not allowed.' In this situation TypeScript complains that we can't set opacityTexture because mesh1.material is of type BABYLON.Material (not BABYLON.StandardMaterial). I could of course just do "mat1.opacityTexture = null", but what is the typical way to handle this type of situation in TypeScript if I really want to access the material via "mesh1.material"?
  13. I have made a basic gulp file following Techemon's code (he uses grunt though) here: https://github.com/Temechon/Babylon.js-FPS I notice he is using babylon.2.3.d.ts. (Not 2.5 or 2.6.) With my gulp build I am able to compile my project with babylon.2.3.d.ts and everything compiles successfully. With sublime text if I build (using the official typescript sublime text plugin) with babylon.2.5.d.ts, it compiles my game.ts file successfully, no errors. But if I try to use babylon.2.5.d.ts with gulp using gulp-typescript, I get the following compilation error: node_modules/typescript/lib/lib.d.ts(5603,11): error TS2320: Interface 'AudioContext' cannot simultaneously extend types 'AudioContextBase' and 'EventTarget'. Named property 'addEventListener' of types 'AudioContextBase' and 'EventTarget' are not identical. Am I doing something wrong? Is this a bug with babylon 2.5? Does anyone have an example gulpfile.js (preferably with browserify+tsify) that compiles their TypeScript game successfully with a recent version of Babylon? I don't know if it's relevant but here is my gulpfile.js: 'use strict'; var gulp = require('gulp'); var ts = require("gulp-typescript"); var sourcemaps = require('gulp-sourcemaps'); var paths = { ts: [ 'babylon.2.5.d.ts', 'game.ts', ] }; gulp.task("ts1", function () { return gulp.src(paths.ts) .pipe( ts({ module: 'amd', target: 'es5', declaration: false, sourceMap:true, removeComments:false, out: 'dist' }) ); });
  14. I'm still a relative newbie with BJS and typescript. I've managed to get observers working in my TS class but I found that I couldn't use "this" instance references within the callback function e.g. class MyMesh extends BABYLON.Mesh { private myMeshChild:BABYLON.Mesh; constructor() { // Create child mesh and add some animation etc. this.myMeshChild.onBeforeRenderObservable.add(function () { console.log(this.myMeshChild.rotation); } } } This compiles fine but results in runtime error "Cannot read property 'rotation' of 'undefined'". But if I instead assign to a local variable first, then it works, e.g. class MyMesh extends BABYLON.Mesh { private myMeshChild:BABYLON.Mesh; constructor() { // Create child mesh and add some animation etc. let myMeshChild = this.myMeshChild; this.myMeshChild.onBeforeRenderObservable.add(function () { console.log(myMeshChild.rotation); } } } I feel like I'm using Observables all wrong in Typescript. I'm wondering what's the best way to pass variables to the callback function from within my TS classes? Also I feel like if I add an observer to a mesh then the callback function should be aware of the context i.e. the mesh object from which it's called and therefore I shouldn't have to also assign objects to local variables before I can refer to them in the function, but maybe I'm expecting too much. Any pointers on using Observables correctly from within Typescript classes would be most appreciated. @Nockawa @Deltakosh
  15. I want to setup a Phaser project via npm: npm install --save phaser-ce When I put some code in a *.ts file, TSLint in VS Code will always say "cannot find name 'Phaser'". I can use triple-slash reference, but are there any better ways to do that? Or there are some tutorials on how to setup a project via NPM in TypeScript? Using NPM will be easier to keep Phaser up-to-date instead of downloading *.js and *.d.ts files respectively. Although there are many templates to help us setup a project with Phaser+Webpack+TypeScript, I think it's better to learn how to setup, so I could do more on it myself such as bundling Cordova and Eletron with Phaser in TypeScript. Thanks for advance!
  16. Hello everyone, I'm working on a small game using TypeScript, and I hit a compilation issue with the Phaser.Tilemap object. I was going to submit it as an issue to GitHub, but because I'm new here I wanted to error on the side of caution and make sure that this is actually an issue, as per the contribution guidelines. According to the phaser.d.ts file, on [line 5057](https://github.com/photonstorm/phaser-ce/blob/master/typescript/phaser.d.ts#L5057), the objects project is supposed to be an any[]. When running my application, I can see that Phaser.Tilemap.objects is an Object, with another property called objects, which is an any[]. I have attached a screenshot of my code editor watch expressions that shows the issue I'm facing. If we make the following change to the def file, it would resolve the issue. I have confirmed the change in my local repository, and everything appears to compile as expected. objects: { objects: any[]; }; To generate the error, I am loading TILED_JSON map data and iterating through it to find a specific tile, as follows: let map: Phaser.Tilemap for(let o of map.objects.objects) { if(o.type === "start") { start = new Phaser.Point(o.x, o.y - map.tileHeight); break; } }
  17. Hey all, I'm trying to filter an entire group, but I can't seem to succeed, where applying that same filter to a sprite instantly works. I'm working on my first Typescript project and I like it a lot! I have a MainGame class (mainGame.ts) which extends Phaser.State and I have a Container class (container.ts) which extends Phaser.Group When I apply a filter to a sprite that I simply added like: this.body = this.add.sprite(0, 0, 'bgBase'); this.body.filters = [ new Phaser.Filter.BlurY(this.game, null,'') ]; the blur filter is applied. Now when I try to apply the filter to a container which contains Sprites, like: this.container = new Container(this.game); this.container.filters = [ new Phaser.Filter.BlurY(this.game, null,'') ]; does NOT work. But when I apply the filter directly to a Sprite inside the container, like: this.container.someSprite.filters = [ new Phaser.Filter.BlurY(this.game, null,'') ]; the filter is applied as expected. I must be overlooking something important for how I create or add the group, but I keep missing it. I hope somebody has an idea about where to look. Help will be much appreciated!
  18. Hello I started to study this tutorial: Advanced Phaser and TypeScript Projects I want to write a code on JSFiddle. I started here: https://jsfiddle.net/8Observer8/bjss7bwj/ But I see the error in console: _super is not defined Please, help me.
  19. I am currently converting my working Babylon typescript code into an angular 2 component, but it doesn't seem to render on the screen. It is finding the correct canvas, and everything including the render loop (which calls scene.render) is running without errors and I am not sure why everything is working except for making it show up on the canvas, I had no issues with this prior to adding the code to a component and all of the code works except for that single part. Any suggestions regarding what could be going wrong?
  20. Hello guys, just wanted to show an HTML5 game made with superpowers. Super Coin Collector is a shoot e'm up 2D for Android inspired by Super Crate Box. You can download it from: https://goo.gl/cD0fHt
  21. Just4fun game, developed with phaser+typescript. http://xmas2016.zero89.it You are the Governor of Campania (south of Italy)... and you must save Salerno (my city) from the Evil Imperial invasion.... Why "fried fish edition"... its a complex story related to a vote exchange in last italian constitutional referendum... hauhaahahauh!! Never mind... just play! tnx in advance for any feeback! Here a video about Salerno... and Penguins!
  22. Our company is developing a browser-based collectible card game where players will be able to create personal collections, build and edit decks, create and join games in a lobby, and play against live opponents entirely inside their browser. We are hiring a front-end web developer to build our website. We already have a backend game engine and database. The selected job applicant will be required to develop the site and connect it to the backend through our API. Our website is already partially developed. We have had two previous developers and it will be important that our new developer can work with a large existing code base. The platform is written in Typescript using the HTML5 based open-source game library Phaser. Technical requirements: This position is for a front end developer only. No back end work will be assigned Code written in Typescript, with Phaser Collect and validate user input Transmit user input to the API: user interactions include typing, clicking, and drag & drop Process responses from API Display responses to the user: output includes displaying cards moving to different locations, highlighting values that have changed. Attractive display (smooth animations, pleasant arrangement) are a must If you're interested in the position, message me with the following information: - Your CV - A brief description of what interests you about the project - How many hours a week you would like to work on the game - What is your desired rate of pay
  23. Hello, I'm trying to make separate weapon classes in an Asteroids-type game, for example a Missile.ts, Laser.ts, etc. What I have so far is this (Missile.ts): module Spaceroni { export class Missile extends Phaser.Weapon { constructor(game: Phaser.Game) { super(game, game.plugins); this.bulletKillType = Phaser.Weapon.KILL_LIFESPAN; this.bulletSpeed = 1500; this.fireRate = 20; } } } In my Player.ts I have weapon: Spaceroni.Missile; up top and I'm adding a weapon in its constructor with this.weapon = game.add.weapon(30, 'missile'); This isn't working (bulletSpeed and fireRate aren't changing), I think because game.add.weapon() creates a new weapon instance, separate from my Missile class. I would like to avoid putting all of this Missile-specific code directly into the Player class since I want to be able to change the weapon based on power-ups, as well as add the Missile weapon to enemies. Any ideas on how to properly extend the weapon plugin? Thanks in advance!
  24. Hello, I have a question about the layer property of the TileMap class. The documentation ( (https://phaser.io/docs/2.6.2/Phaser.Tilemap.html#layer) says that the layer property is of the type Phaser.TilemapLayer. However, the Typescript definition (https://github.com/photonstorm/phaser/blob/v2.6.2/typescript/phaser.d.ts#L5041) says that the type is a TilemapLayer[]. Is this right? How is this supposed to be used? I was under the impression that Tilemap.setLayer() could be used to set the current layer on the Tilemap object, and the the TilemapLayer object could be referenced through the Tilemap.layer property.
  25. So far I've been developing my project using TypeScript and simply compiling it into JavaScript via VS Code. Is there any good reason for me to migrate to Webpack? Will it positively affect the code or structure in any way?