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. 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 https://labrat.mobi/games/cardinal_run/ 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 Game is available for non-exclusive license and API integration. Please contact me https://labrat.mobi/#contact Gameplay video Some screenshots:
  2. 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 https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends but I didn't understand how to do that. Can anyone help me, please? Thanks!
  3. 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: https://github.com/numbofathma/phaser-typescript-webpack Let me know what you think! Hope it will be useful for the community!
  4. That is basically it guys. Which is your preferred language for phaser. If its other I don't know please write a comment.
  5. 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. https://github.com/dacaher/pixijs-ts-boilerplate Any suggestion, bug report or improvement submitted would be very much appreciated. Thanks!
  6. Hey Crew, I'm trying to implement a custom font, I'm using Phaser through typescript, but I can't seem to get it to function correctly. I've checked the phaser examples, unfortunately, as I'm both new to web dev and Typescript, I'm not sure how to convert that info into my game. I've tried googling around and there aren't any examples that I've found that deal specficially with typescript, phaser and fonts. I tried adding this: <link href='http://fonts.googleapis.com/css?family=Holtwood+One+SC' rel='stylesheet' type='text/css'>into my html, and referring to it with this: var style = { font: "30px Holtwood", fill: "#ff0044", align: "center" };But I don't know if I'm missing something? Otherwise my text shows up, it's just default font. Thanks!
  7. 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
  8. https://makizo.itch.io/phaseroids Arrows - Move Ship Space - Fire Weapon A, S, D - Change Weapon 3 Power Ups : - Slow Time - Speed - Shield
  9. 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
  10. 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 (https://github.com/facebookincubator/create-react-app), 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: https://brianzinn.github.io/create-react-app-typescript-babylonjs/ Source: https://brianzinn.github.io/create-react-app-typescript-babylonjs/ Source for page with BabylonJS: https://github.com/brianzinn/create-react-app-typescript-babylonjs/blob/master/babylonjs-site/src/containers/home/index.tsx So, it's pretty straightforward from the docs (http://doc.babylonjs.com/overviews/npm_support), but also in practice turned out quite fast to get started.
  11. 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.
  12. 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 this.game.plugins.add(Phaser.Plugin.ArcadeSlopes); But when I try to convert the collision layer: // Convert the collision layer to work with Arcade Slopes this.game.slopes.convertTilemapLayer(this.collisionLayer, '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. 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): miabellaAI.net This is the browser-based application: ann.miabellaAI.net
  16. 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! https://github.com/hiperbou/kotlin-phaser
  17. 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( this.phaser_game.world.centerX, this.phaser_game.world.centerY, "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`?
  18. 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
  19. Hi guys, I am trying to create a Game with Ionic 2 (=> Typescript) and Phaser and so far it was fine... until that I tried to add the plugin Virtual Joystick. The line this.pad = this.game.plugins.add(Phaser.Plugin.VirtualJoystick); return an error about undefined "game" But the comment above this line works fine ... It's maybe that I don't use the correct syntax to call a plugin ... Please Help me import { Component } from '@angular/core'; import { NavController, NavParams } from 'ionic-angular'; import { Platform,AlertController } from 'ionic-angular'; import { Storage } from '@ionic/storage'; import { HomePage } from '../home/home'; /* Generated class for the Play page. See http://ionicframework.com/docs/v2/components/#navigation for more info on Ionic pages and navigation. */ ///<reference path="js/phaser-virtual-joystick.min.js"/> @Component({ selector: 'page-play', templateUrl: 'play.html' }) export class PlayPage { score: any; scoreObj: Number; game: Phaser.Game; map: Phaser.Tilemap; balloon: Phaser.Sprite; bg: Phaser.TilemapLayer; start: Phaser.TilemapLayer; hit: Phaser.TilemapLayer; cursors: Phaser.CursorKeys; pad; stick; test; constructor(public navCtrl: NavController, public navParams: NavParams,platform: Platform,public storage:Storage,public alertCtrl: AlertController) { platform.ready().then(() => { storage.get('scores'); storage.get('level'); }); } ionViewDidEnter(){ this.score = 0; this.scoreObj = 100; var innerWidth = window.innerWidth; var innerHeight = window.innerHeight; this.game = new Phaser.Game(innerWidth, innerHeight, Phaser.AUTO, 'myGame', {create: this.create, preload: this.preload,update:this.update, render: this.render}, true); } preload(){ this.game.load.spritesheet('balloon', 'img/balloon-01.png',112,150); this.game.load.image('lest','img/sac.png'); this.game.load.image('target','img/hole.png'); this.game.load.tilemap('level1', 'img/bg-test.json', null, Phaser.Tilemap.TILED_JSON); this.game.load.image('bg-test', 'img/bg-test.png'); this.game.load.atlas('arcade', 'img/arcade-joystick.png', 'img/arcade-joystick.json'); } update = () =>{ this.game.physics.arcade.collide(this.balloon, this.hit,() => { this.balloon.kill(); this.score = this.score + 3; console.log("hit"); }); this.game.physics.arcade.collide(this.balloon, this.start); this.game.physics.arcade.collide(this.balloon, this.bg,() => { this.balloon.kill(); console.log("bg"); this.score = this.score - 1; }); this.game.input.update(); if (this.cursors.left.isDown) { this.balloon.position.x -= 5; } else if (this.cursors.right.isDown) { this.balloon.position.x += 5; } } render = () =>{ this.game.debug.body(this.balloon); } create = () =>{ /*var plugins = new Phaser.PluginManager(this.game); console.log(plugins);*/ this.pad = this.game.plugins.add(Phaser.Plugin.VirtualJoystick); this.game.physics.startSystem(Phaser.Physics.ARCADE); this.cursors = this.game.input.keyboard.createCursorKeys(); this.game.world.setBounds(0, 0, 9600,800); //MAP var map = this.game.add.tilemap('level1',9600,800,9600,800); map.addTilesetImage('bg-test'); this.hit = map.createLayer('hit'); this.start = map.createLayer('start'); this.bg = map.createLayer('bg'); //BALLOON this.balloon = new Phaser.Sprite(this.game, 192, 490, 'balloon'); this.balloon.debug = true; this.game.world.addAt(this.balloon, 3); this.game.physics.enable(this.balloon, Phaser.Physics.ARCADE); this.balloon.body.gravity.y = 15; this.balloon.body.collideWorldBounds = true; this.balloon.inputEnabled = true; this.game.camera.follow(this.balloon, Phaser.Camera.FOLLOW_LOCKON, 0.1, 0.1); this.balloon.animations.add('fly', [ 0, 1, 2, 3, 4, 5], 20, true); this.balloon.body.velocity.y = 10; // GAME map.setCollision([1,2,4,5],true,this.bg.index,true); map.setCollision([6],true,this.hit.index,true); map.setCollision([3],true,this.start.index,true); } }
  20. 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. Hello, guys. I'm trying to set up a workplace using CreateJS and Typescript. So far I tried only to use VisualStudio for this. I see everyone using the "createjs." namespace, can't find it in .d files from here: https://github.com/borisyankov/DefinitelyTyped Or is there another way of using Typescript with all the typing, intellisense and debugging?
  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 this.scene.debugLayer.show(); 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. 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!
  25. A small simple multiplayer game https://github.com/code0wl/Multiplayer-Phaser-game There is also book that I have just published showing the steps to take to create such a game Preview: http://www.codeowl.tech:3000/