• Content count

  • Joined

  • Last visited

About Joncom

  • Rank

Contact Methods

  • Twitter
  1. Freelance HTML5 Game Developer

    Love your Arrow of Janissary game! Brings back memories of the bazooka in Worms Armageddon
  2. Hi lukasdev. Respectfully, why not share some examples of your work first, so that people know if they even want to reach out to you?
  3. Any game examples?
  4. Game developer available

    Hi AntonBel. It is probably better to show you can make games (rather than simply telling). Got any examples online? Edit: Think I stumbled across one of yours games: Cool
  5. May be helpful to others if you include links to some HTML5 games you have created.
  6. Looking for javascript developer

    Hi AndyTyurin. Game developers can be busy people. You might find somebody quicker if you post more details about the kind of game you would like to build.
  7. Haha, yeah sorry about that ^^
  8. Woops. I had previously updated the demo with the fix, and then accidentally replaced it with the broken version again. Should working working now.
  9. Just wanted to clarify. You would like to pay your users real money for playing the game(s)?
  10. Thanks for looking into it @TheBoneJarmer. I opened an issue on Github:
  11. Hello. I put together a water ripple effect demo: Each time you click, a new set of ripples is created. However, a brief flash of black occurs each time a new filter is added to the stage.filters array! But I must add the filters to this array for there to be any effect, so... I am really doomed to have this ugly flicker? <!DOCTYPE html> <html> <head> <title>PixiJS Ripple</title> <script src="pixi.min.js"></script> </head> <body> <script> var stage = new PIXI.Container(); var renderer = PIXI.autoDetectRenderer(512, 512); document.body.appendChild(renderer.view); // load assets PIXI.loader .add("background.jpeg") .add("map.png") .load(setup); var ripples = []; function setup() { // background var bg = new PIXI.Sprite(PIXI.loader.resources["background.jpeg"].texture); bg.anchor.set(0.5); bg.scale.set(0.6); bg.position.set(renderer.view.width/2, renderer.view.height/2); stage.addChild(bg); // add new ripple each time mouse is clicked renderer.view.addEventListener('mousedown', function(ev) { ripples.push(new Ripple(ev.clientX, ev.clientY)); stage.filters = { return f.filter; }); }, false); gameLoop(); } function gameLoop() { requestAnimationFrame(gameLoop); // update ripples for(var i=0; i<ripples.length; i++) { ripples[i].update(); } renderer.render(stage); } function Ripple(x, y) { // sprite this.sprite = new PIXI.Sprite(PIXI.loader.resources["map.png"].texture); this.sprite.anchor.set(0.5); this.sprite.position.set(x, y); this.sprite.scale.set(0.1); stage.addChild(this.sprite); // filter this.filter = new PIXI.filters.DisplacementFilter(this.sprite); } Ripple.prototype.update = function() { this.sprite.scale.x += 0.025; this.sprite.scale.y += 0.025; } </script> </body> </html>
  12. About fonts...

    I put together an example of using a Google Web Font which seems to work reliably. Here is a demo: Here is the code: <!DOCTYPE html> <html> <head> <title>PixiJS Web Font Example</title> <script src=""></script> <script src=""></script> <script> // fontsLoaded = false; WebFont.load({ google: { families: ['Noto Sans'] }, loading: function() { console.log('Font(s) Loading'); }, active: function() { console.log('Font(s) Loaded'); fontsLoaded = true; }, inactive: function() { console.log('Font(s) Failure'); } }); </script> </head> <body> <script type="text/javascript"> var renderer = PIXI.autoDetectRenderer(640, 128); document.body.appendChild(renderer.view); // create the root of the scene graph var stage = new PIXI.Container(); // PIXI.loader // .add("image1.png") // .add("image2.png") // .add("image3.png") // .load(setup); // calling setup directly because we do not actually need any images, etc. setup(); function setup() { var intervalId; intervalId = setInterval(() => { if(fontsLoaded) { text = new PIXI.Text('The quick brown fox jumps over the lazy dog', { fontFamily: 'Noto Sans', fontSize: 24, fill: 0xffffff }); stage.addChild(text); text.x = renderer.view.width/2; text.y = renderer.view.height/2; text.anchor.set(0.5); renderer.render(stage); clearInterval(intervalId); } }, 20); } </script> </body> </html>