Ezelia

Members
  • Content Count

    487
  • Joined

  • Last visited

  • Days Won

    2

Everything posted by Ezelia

  1. Hi @ThanosS Thank you for sharing our tutorial. if you are interested in multiplayer topics please also check our other tutorial about making a multiplayer game in Phaser and eureca.io http://ezelia.com/2014/tutorial-creating-basic-multiplayer-game-phaser-eureca-io and give a try to our open source library : eureca.io
  2. Hi @blackgames Thank you for using eureca.io, I'm curious to see the game using eureca.io, and very happy to know that it helped you in your game creation. About the /eureca.js file, you can prefix it with the server url : if your game server is mygameserver.com, you can use http://mygameserver.com/eureca.js or you can open the /eureca.js in your browser, save it, and include it to your cocoonjs package then reference it as a static file. make a test and let me know
  3. No, nothing to configure. Phaser 2.x do not have its own rendering engine, it use Pixi renderer. EZGUI detect if you are using Phaser and adapt automatically.
  4. the initialization process only load EZGUI resources to make sure they are available for components. then, for each component, there is a processing for JSON settings, then a creation of the component, and finaly the component is cached. this processing, is only done once, then everything is handled by Pixi or Phaser . the EZGUI component become a Phaser DisplayObject with specific interactions.
  5. There is no real difference between Phaser button and EZGUI button, both user sprite for rendering and eventmanager to catch events. But for each component, EZGUI create a specific phaserGroup to isolate EZGUI specific complement from game components .... this is not supposed to reduce performance (it add a hierarchi level but will surely not lead to a drop of 30% !) also EZGUI will use the current active renderer, if you use canvas2D it'll use canvas2D too. I never tested on iOS devices, maybe there is some difference in behaviour .... do you have any way to monitor CPU performance and memory allocations ?
  6. Hi @caragones, I have noticed similar case in a game where I used an HTML5 wrapper (similar behavior on both Cordova and Crosswalk). For me it was only happening for GUIs taking the whole screen, the game performance itself was not affected .... I thought that it's related to cordova behaviour : maybe limitting RAF calls when nothing change on the screen leading to fake FPSmeter drop ? and I stoped investigations there. I don't think that EZGUI itself will cause performance drop because of coputation, because each EZGUI control is constructed once, and cached using Pixi bitmap cache. so the build code (which require CPU time is only executed once). it can also be the fact that drawing a big texture (the cached bitmap) can degrade performance, but in this case it'll be more related to Pixi. if you think it really degrade game performance, I'd like to investigate more. but I need more information. have you tried Chrome profiler to see if some code is using lot of CPU time (also check heap allocations)
  7. Just pushed a new version to git repository. this one mainly fix Phaser 2.4 compatibility. since some Pixi classes and structures was removed in Phaser 2.4, this version allow you to use EZGUI with Phaser 2.4 by including a compatibility script. compiled version and compatibility scripts are available here : https://github.com/Ezelia/EZGUI/tree/master/dist also added two usage examples : https://github.com/Ezelia/EZGUI/blob/master/examples/Phaser/phaser-2.4.htmlhttps://github.com/Ezelia/EZGUI/blob/master/examples/game/phaser-2.4.html
  8. Well I think that thing are much easier with the PixiV3. I mainly wrote this tutorial by the time where Pixi.Stage was a special container, now with Pixi v3, Stage no more exist, it's just a container like others. so the easiest way to handle scenes is to crete a container for each scene, and put all your stuff into it, then hide/show the container depending on what scene you wan't to display. it's really very simple with Pixi v3. are you having some specific issue which is adressed by the tutorial but not with the method described above ?
  9. This is the isometric engine I'm working on, it use Pixijs v3 for rendering. Nothing playable for now, but I'll share an online demo soon
  10. Hello @omarojo, please note that this Tutorial is very old and outdated it's about Pixijs 1.6 and the last Pixijs version is 3 ! I'll be surprised if it's still working with new Pixi version about Typescript usage, I used it because the structure of the code is Object Oriented and TypeScript support OOP very well, the code logic itself do not differ ... I'll update the tutorial for new Pixi version when I have some time, and I'll write it in both TypeScript and Javascript
  11. Hi @horkoda sorry for the very late reply, for some reason I didn't get notification of post replies on this topic. about your questions, there is absolutely no problem to use websocket and webRTC side by side, (this is btw usually used by WebRTC apps to initialize the connection). the only thing you'll need here is to create a separate server instance for each, and of course listen on different ports. about WebRTC issues, you can encounter incompatibility issues on old browsers or on some mobile browsers since it's quite new standard. I encountered some strange connection loss but it was rare, can't say if it's because of unreliability nature of webRTC or something else. if you encounter any problem feel free to open issue on github repository hope it'll help.
  12. Good catch ! this is a bug in text property I just pushed a fix update.
  13. a first version of input control was pushed . this is the live demo to see how it work : http://ezgui.ezelia.com/examples/07-input/1-simple.html it's still not perfect but is usable on both desktop and mobiles. let me know if it works fine for you, and feel free to open issue on Github or post here if you encounter any bug
  14. Hi sanafa, thank you for you comment. the input component is the one I'm working on now it'll be added in the next update very soon. just trying to figure out the best and cleanest approach to make it, so it support both desktop and mobile devices. follow the developement repo on github since it's updated more frequently than the zip package.
  15. fix published, you can now use the latest dev version and remove the workaround (https://github.com/Ezelia/EZGUI/tree/master/dist)
  16. got it here is a quick and dirty patch. I'll make a cleaner version in the next EZGUI update (maybe tonight). Add the following code to your script (make sure it'll be executed after ezgui.js) function isMasked(x, y, obj) { var parent = obj.parent; if (parent == null) return false; if (!parent.worldTransform || !parent.guiMask) return isMasked(x, y, parent); var wratio = Phaser.GAMES[0].scale.width/Phaser.GAMES[0].width; var hratio = Phaser.GAMES[0].scale.height/Phaser.GAMES[0].height; var tx = (parent.worldTransform.tx + parent.guiMask.x) * wratio; var ty = (parent.worldTransform.ty + parent.guiMask.y) * hratio; var w = parent.guiMask.width * wratio; var h = parent.guiMask.height * hratio; if (x < tx || y < ty || x > tx + w || y > ty + h) return true; return isMasked(x, y, parent); }EZGUI.utils.isMasked = isMasked;let me know if it fixe all the scaling issues nice game btw let me know when you publish it. I'll add some projects using EZGUI to the showcase in the official page and project wiki.
  17. This is wired :/ EZGUI use native Phaser events, it should work if Phaser events work. can you please show me your GUI definition ? there is also couple of things to check if you don't scale, is the gui working ? is the close button in your example working ? is it possible to create a simple phaser code with two interactive sprites, one in the top, other in the bottom, then scale and test if phaser events trigger correctly ? (the goal here is to exclude the possibility of phaser bug)
  18. Have you tried to destroy/recreate the GUI after rescale ? EZGUI don't handle specific engine features (like rescaling) ... I'll maybe support it in future versions if it don't break things. if you want to try destroy/recreate solution please use the latest EZGUI build from girhub repository (https://github.com/Ezelia/EZGUI/tree/master/dist), there was a bug in destroy method in last published version.
  19. EZGUI do not rely on phaser update function if this is your question I modified the breakout example so the update function is ignored when the continue dialog shows, you can check it again using the same link. GUI components are rendered by the internal PIXI render loop which remain active even if phaser update function is not called. so yes, all EZGUI features remain available when the game is paused.
  20. found time to make a very quick integration example here is the breakout game from Phaser examples with EZGUI integrated : http://ezgui.ezelia.com/examples/breakout/ I will write a dedicated tutorial to this example when I find some time. the source code of the game is almost untouched. the GUI stuff is separated to gui data in breakout-gui-data.js and gui event handling in breakout-gui.js
  21. @nkholski each GUI element lives in a separate Container, and is not impacted by the game state, so you can show/hide GUI elements or manipulate them as you like when the game is paused. if you look at this example : http://ezgui.ezelia.com/examples/game/phaser.html or this one http://ezgui.ezelia.com/examples/kits/MainScreen-Phaser.html the GUI works just fine, and the game.paused is true (because no game is running actually)
  22. I implemented the first game kit yesterday It's the simplest one (the main game screen), next one will be the levels screen. just to give you an idea of what a kit is. it's mainly a composite component, dedicated to one usage, and simplified. here is an exemple to illustrate how it works the definition of MainScreen kit is as follow var guiCfg = { id: 'mainScreen', component: 'MainScreen', width: 600, height: 550, logo: '../../assets/img/myGameLogo.png', buttons: [ { event: 'play', text: 'Play', width: 300, height: 80 }, { event: 'options', text: 'Options', width: 300, height: 80 }, ]}here we define a MainScreen with a custom logo and two buttons note the "event" property of the buttons. this will provide easy access to the click event of each button, so when you create the GUI component you can listen to "play" and "options" events like this : guiContainer = EZGUI.create(guiCfg , 'kenney');guiContainer.on('play', function (event, btn) { console.log('clicked', btn.Id, btn.text); });guiContainer.on('options', function (event, btn) { console.log('clicked', btn.Id, btn.text);});and the final result will look like this http://ezgui.ezelia.com/examples/kits/MainScreen-Pixi.html want custom background image ? just specify it in the GUI definition var guiCfg = { id: 'mainScreen', component: 'MainScreen', width: 600, height: 550, //our custom background image image: '../../assets/img/panel-650x400.png', logo: '../../assets/img/myGameLogo.png', buttons: [ { event: 'play', text: 'Play', width: 300, height: 80 }, { event: 'options', text: 'Options', width: 300, height: 80 }, ]}and the result will look like this http://ezgui.ezelia.com/examples/kits/MainScreen2-Pixi.html and this is only a foretaste of some cool features we want to implement
  23. @totor this is exactly what we are planing to do . if you are thinking about a specific template please let me know so I add it to our roadmap.
  24. @playtwice @bali33 thank you ! let me know when you test it. btw I added a lot of new examples to help you get started : https://github.com/Ezelia/EZGUI/tree/master/examples numbered examples demonstrate the usage of a single GUI component. named examples are more complex I'm aware that current Wiki documentation is still not enought, I hope that those example will compensate, the time I write more documentation. PS : the example named "test" is not a good start, it's just a test file I use to debug issues
  25. Just added some documentation to the repo wiki page : https://github.com/Ezelia/EZGUI/wiki far from being complete but those are the basics to understand how themes and gui work. will update it in the coming days