Stephan

Members
  • Content Count

    162
  • Joined

  • Last visited

  • Days Won

    3

Reputation Activity

  1. Thanks
    Stephan got a reaction from greencoder in System Text line break and typewriter-effect update   
    Here it is, a small System Text plugin with 3 features:
     
    1) typewriter effect
    2) strokeColor (border)
    3) example how to use gradient colors with systemText in Panda.
     
    Please note that I included a custom font in the project to achieve the second and third example. See the demo project for files ans details at: 
    https://github.com/stephanvermeire/systemtextplugin
     
    Quick example (typewrite effect not working here because it is a static image):

     
    systemtextplugin.js
    game.module( 'plugin.systemtextplugin' ) .require( 'engine.renderer.text' ) .body(function() { game.SystemText.inject({ /** Enable typewriter-effect @default false **/ typing_effect: false, i: 1, /** StrokeColor of the text. @property {String} color @default #000 **/ strokeColor: '#000', /** Width of the text stroke. @property {Number} color @default 0 **/ lineWidth: 0, _renderCanvas: function(context) { var wt = this._worldTransform; context.globalAlpha = this._worldAlpha; context.setTransform(wt.a, wt.b, wt.c, wt.d, wt.tx * game.scale, (wt.ty + this.size) * game.scale); context.fillStyle = this.color; context.font = this.size * game.scale + 'px ' + this.font; context.textAlign = this.align; context.strokeStyle = this.strokeColor; context.lineWidth = this.lineWidth; if(this.text === undefined) return; var lines; if(this.typing_effect){ lines = String(this.text.substr(0, this.i)).split('\n'); if(this.i <= this.text.length){ this.i++; } }else{ lines = this.text.split('\n'); } for (var i = 0; i<lines.length; i++){ context.fillText(lines[i], 0, (i*this.size) ); if(this.lineWidth){ context.strokeText(lines[i], 0, (i*this.size)); } } } }); });  
    main.js
    game.module( 'game.main' ) .require( 'plugin.systemtextplugin' ) .body(function () { game.createScene('Main', { init: function () { //typewriter demo new game.SystemText('Lorem ipsum dolor sit amet,\nconsectetuer adipiscing elit.\nSed posuere interdum sem.', { size: 50, x: 0, y: 0, typing_effect: true, }).addTo(this.stage); //custom font with strokeColor new game.SystemText('Lorem ipsum dolor sit amet,', { font: 'SoSweetHoney', // align: 'left', color: '#2d963b', strokeColor: '#a2e65e', lineWidth: 2, size: 50, x: 0, y: 300, }).addTo(this.stage); //gradient font color const color = game.renderer.context.createLinearGradient(0, 0, game.width, 0); color.addColorStop(0, "#f47c35"); color.addColorStop(1, "#e6e650"); const strokeColor = game.renderer.context.createLinearGradient(0, 0, game.width, 0); strokeColor.addColorStop(0, "#a2e65e"); strokeColor.addColorStop(1, "#3577ca"); let test = new game.SystemText('Lorem ipsum dolor sit amet!', { font: 'SoSweetHoney', lineWidth: 2, size: 50, x: 0, y: 500, }).addTo(this.stage); test.color = color; test.strokeColor = strokeColor; } }); });  
     
    index.html
    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Panda 2 - SystemText</title> <link rel="stylesheet" href="style.css" media="all" /> <script type="text/javascript" src="src/engine/core.js"></script> <script type="text/javascript" src="src/game/config.js"></script> <script type="text/javascript" src="src/game/main.js"></script> </head> <body> </body> </html> Note that you have to include the fonts directory as well as the style.css file in your project to make the custom font work!
  2. Thanks
    Stephan got a reaction from greencoder in [Solved] Text Drawcalls & SystemText Fonts   
    Check this example:
     
  3. Thanks
    Stephan got a reaction from GregDev in Help connecting an extended class to the core game loop   
    You can use preUpdate() function in the player class. It is being called each cycle without having to active it manually.
  4. Like
    Stephan got a reaction from plicatibu in Will anyone be interested in starting a discord channel dedicated for games with Panda2?   
    Hi greencoder,
    due too the lack of support from enpu and the diminishing community, I decided to rewrite my current project to Phaser3.
    don’t worry, I will still respond to questions about panda in this forum that I can answer quickly. 😊
     
     
  5. Like
    Stephan reacted to greencoder in [Solved] Exporting Instant Games Do Not Work   
    @Stephan hehe! 
    @Wolfsbane,  ... 
    UPDATE : Preloader is working as intended, no issues as I thought. 
  6. Thanks
    Stephan got a reaction from greencoder in [Solved] Exporting Instant Games Do Not Work   
    Good approach. In the end you need a valid zip file to upload and it is expected that you have to make some custom adjustments in the process before you upload it.
    you might also try to upload the old (working) game again and see if it succeeds or fails. This might help you to figure out how a valid zip looks like.
  7. Thanks
    Stephan got a reaction from greencoder in [Solved] Exporting Instant Games Do Not Work   
    Can you check if there is a fbapp-config.json file in the root of your zip file?
    see also: https://developers.facebook.com/docs/games/instant-games/bundle-config
  8. Thanks
    Stephan got a reaction from Wolfsbane in System Text line break and typewriter-effect update   
    Here it is, a small System Text plugin with 3 features:
     
    1) typewriter effect
    2) strokeColor (border)
    3) example how to use gradient colors with systemText in Panda.
     
    Please note that I included a custom font in the project to achieve the second and third example. See the demo project for files ans details at: 
    https://github.com/stephanvermeire/systemtextplugin
     
    Quick example (typewrite effect not working here because it is a static image):

     
    systemtextplugin.js
    game.module( 'plugin.systemtextplugin' ) .require( 'engine.renderer.text' ) .body(function() { game.SystemText.inject({ /** Enable typewriter-effect @default false **/ typing_effect: false, i: 1, /** StrokeColor of the text. @property {String} color @default #000 **/ strokeColor: '#000', /** Width of the text stroke. @property {Number} color @default 0 **/ lineWidth: 0, _renderCanvas: function(context) { var wt = this._worldTransform; context.globalAlpha = this._worldAlpha; context.setTransform(wt.a, wt.b, wt.c, wt.d, wt.tx * game.scale, (wt.ty + this.size) * game.scale); context.fillStyle = this.color; context.font = this.size * game.scale + 'px ' + this.font; context.textAlign = this.align; context.strokeStyle = this.strokeColor; context.lineWidth = this.lineWidth; if(this.text === undefined) return; var lines; if(this.typing_effect){ lines = String(this.text.substr(0, this.i)).split('\n'); if(this.i <= this.text.length){ this.i++; } }else{ lines = this.text.split('\n'); } for (var i = 0; i<lines.length; i++){ context.fillText(lines[i], 0, (i*this.size) ); if(this.lineWidth){ context.strokeText(lines[i], 0, (i*this.size)); } } } }); });  
    main.js
    game.module( 'game.main' ) .require( 'plugin.systemtextplugin' ) .body(function () { game.createScene('Main', { init: function () { //typewriter demo new game.SystemText('Lorem ipsum dolor sit amet,\nconsectetuer adipiscing elit.\nSed posuere interdum sem.', { size: 50, x: 0, y: 0, typing_effect: true, }).addTo(this.stage); //custom font with strokeColor new game.SystemText('Lorem ipsum dolor sit amet,', { font: 'SoSweetHoney', // align: 'left', color: '#2d963b', strokeColor: '#a2e65e', lineWidth: 2, size: 50, x: 0, y: 300, }).addTo(this.stage); //gradient font color const color = game.renderer.context.createLinearGradient(0, 0, game.width, 0); color.addColorStop(0, "#f47c35"); color.addColorStop(1, "#e6e650"); const strokeColor = game.renderer.context.createLinearGradient(0, 0, game.width, 0); strokeColor.addColorStop(0, "#a2e65e"); strokeColor.addColorStop(1, "#3577ca"); let test = new game.SystemText('Lorem ipsum dolor sit amet!', { font: 'SoSweetHoney', lineWidth: 2, size: 50, x: 0, y: 500, }).addTo(this.stage); test.color = color; test.strokeColor = strokeColor; } }); });  
     
    index.html
    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Panda 2 - SystemText</title> <link rel="stylesheet" href="style.css" media="all" /> <script type="text/javascript" src="src/engine/core.js"></script> <script type="text/javascript" src="src/game/config.js"></script> <script type="text/javascript" src="src/game/main.js"></script> </head> <body> </body> </html> Note that you have to include the fonts directory as well as the style.css file in your project to make the custom font work!
  9. Like
    Stephan got a reaction from khleug35 in System Text line break and typewriter-effect update   
    Nice! 😃
  10. Like
    Stephan got a reaction from Wolfsbane in Is Panda 2 Dead?   
    Hi all,
     
    I just wanted to let you know that Panda is still my primary game engine and I have no plans to abandon Panda. The absence of @enpu is unfortunate but don't forget that Panda is open source so most of the time, it is possible to fix minor issues yourself by having a look in the source code. Currently I have two large commercial projects powered by Panda and it is expected that these project will be running for at least several years.
    Don't forget that Panda by itself is a great engine and that it has a couple of features that not all other engines currently are supporting. Take hires support and the custom Panda GUI for example, these are just great!
    I will continue to read this forum on a regular basis. If there are questions that I can answer quickly, you can count on my support.
     
    Stephan
     
  11. Like
    Stephan got a reaction from greencoder in Is Panda 2 Dead?   
    Hi all,
     
    I just wanted to let you know that Panda is still my primary game engine and I have no plans to abandon Panda. The absence of @enpu is unfortunate but don't forget that Panda is open source so most of the time, it is possible to fix minor issues yourself by having a look in the source code. Currently I have two large commercial projects powered by Panda and it is expected that these project will be running for at least several years.
    Don't forget that Panda by itself is a great engine and that it has a couple of features that not all other engines currently are supporting. Take hires support and the custom Panda GUI for example, these are just great!
    I will continue to read this forum on a regular basis. If there are questions that I can answer quickly, you can count on my support.
     
    Stephan
     
  12. Like
    Stephan got a reaction from khleug35 in Is Panda 2 Dead?   
    Hi all,
     
    I just wanted to let you know that Panda is still my primary game engine and I have no plans to abandon Panda. The absence of @enpu is unfortunate but don't forget that Panda is open source so most of the time, it is possible to fix minor issues yourself by having a look in the source code. Currently I have two large commercial projects powered by Panda and it is expected that these project will be running for at least several years.
    Don't forget that Panda by itself is a great engine and that it has a couple of features that not all other engines currently are supporting. Take hires support and the custom Panda GUI for example, these are just great!
    I will continue to read this forum on a regular basis. If there are questions that I can answer quickly, you can count on my support.
     
    Stephan
     
  13. Like
    Stephan got a reaction from Wolfsbane in bugfix for joystick plugin   
    Hi,
     
    I would like to add to propose the following small update to the joystick plugin in order to make it compatible with hires scaling:
     
    var radius = this.bg.shapes[0].shape.radius / 2; must become:
    var radius = this.bg.shapes[0].shape.radius / 2 / game.scale; could you update this  @enpu?
     
    Thanks!
  14. Like
    Stephan got a reaction from khleug35 in Top Down Shooter Template   
    Great work! 😃
  15. Like
    Stephan got a reaction from Wolfsbane in Error with Spine version 3.8.60   
    quick fix for the time being: you can change the spine version in spine settings => Version =>to 3.7.x (dropdown) and it should work again.
     
  16. Like
    Stephan got a reaction from Wolfsbane in Spine plugin enhancement   
    Hi @enpu
    I have a small request for the Spine plugin. In the previous version of Panda there used to be a property animationSpeed that could be used to alter the speed of the spine animation. I noticed that this prop is lacking in the current version of tne plugin. It was easy enough to add myself but since the plugin is not open source, I cannot create a pull request for you. Could you add the following code to the plugin?
     
    spine.js
    game.createClass('Spine', 'Container', { ... animationSpeed: 1, ... updateTransform: function() { this.state.update(game.delta * this.animationSpeed); ... } }) Thanx, Stephan
  17. Like
    Stephan got a reaction from Wolfsbane in [Solved]Collision detection problem for P2 plugin   
    hi,
     
    Have you set up the code in Mainscene correctly? It should look something like this:
     
    add world this.world = new game.Physics({ gravity: [0, 1], }); //add eventhandler collision this.world.on("beginContact",function(event){ if(typeof event.bodyA.collide !== 'undefined'){ event.bodyA.collide(event.bodyB); } if(typeof event.bodyB.collide !== 'undefined'){ event.bodyB.collide(event.bodyA); } });  
  18. Like
    Stephan got a reaction from khleug35 in [Solved]Collision detection problem for P2 plugin   
    Great! Glad I could help you. 😊
  19. Like
    Stephan got a reaction from khleug35 in [Solved]Collision detection problem for P2 plugin   
    hi,
     
    Have you set up the code in Mainscene correctly? It should look something like this:
     
    add world this.world = new game.Physics({ gravity: [0, 1], }); //add eventhandler collision this.world.on("beginContact",function(event){ if(typeof event.bodyA.collide !== 'undefined'){ event.bodyA.collide(event.bodyB); } if(typeof event.bodyB.collide !== 'undefined'){ event.bodyB.collide(event.bodyA); } });  
  20. Like
    Stephan got a reaction from Wolfsbane in bugfix for Panda2 p2 plugin   
    Hi @enpu,
     
    I just encountered en fixed a small bug in the p2 pulgin. Since it is not open source, I cannot create a pull request so I decided to post it here instead:
     
    p2.js line 13876:
    context.rect( -shape.width / 2 * body.world.ratio, -shape.height / 2 * body.world.ratio, shape.width * body.world.ratio * game.scale, shape.height * body.world.ratio * game.scale );  
    should be:
    context.rect( -shape.width / 2 * body.world.ratio * game.scale, -shape.height / 2 * body.world.ratio * game.scale, shape.width * body.world.ratio * game.scale, shape.height * body.world.ratio * game.scale );  
    Hope this is helpful.
    Stephan
  21. Like
    Stephan got a reaction from Wolfsbane in RESOLVED: graphics hires problem   
    I just had another look at the problem and I think it is a small bug in the engine. I just posted a pull request for the develop branch to fix the problem.
  22. Like
    Stephan got a reaction from Wolfsbane in (solved) bug report: TilingSprites with hired problem   
    hi @enpu,
    It looks like I found another small problem with TilingSprites when hires is enabled. 
    config file:
    game.config = { system: { width: 320, height: 320, scale: false, center: true, resize: false, hires: 2 } };  
    This is the code. (I added panda@2x.png to the media folder)
    game.module( 'game.main' ) .body(function() { game.addAsset('panda.png') game.createScene('Main', { init: function() { this.sprite = new game.TilingSprite('panda.png', game.width, game.height).addTo(this.stage); }, update: function() { this.sprite.tilePosition.x -= 100 * game.delta; } }); });  
    The background now has a gap when it is moved to the left. (This gap is sequential).

  23. Like
    Stephan got a reaction from Wolfsbane in (Solved)How to check if the timer is paused??   
    there is no public property available but you could use the following private property 
    timer._pause  
    working example:
    var timer = game.Timer.add(1000, function() { sprite.remove(); }); if(timer._pause){ console.log("paused") } else{ console.log("Not paused") }  
  24. Like
    Stephan got a reaction from khleug35 in (Solved)How to check if the timer is paused??   
    there is no public property available but you could use the following private property 
    timer._pause  
    working example:
    var timer = game.Timer.add(1000, function() { sprite.remove(); }); if(timer._pause){ console.log("paused") } else{ console.log("Not paused") }  
  25. Thanks
    Stephan got a reaction from Ninjadoodle in Question about Physics / Box2d   
    I might write a plugin for box2d in the future. This is because I have many games with box2d that I am planning to port to Panda v2.