sHAYM4N

Members
  • Content count

    24
  • Joined

  • Last visited

About sHAYM4N

  • Rank
    Member

Contact Methods

  • Twitter
    digilocker
  1. PIXI.js & Typescript Getting Started

    absolutely brilliant! Thanks for taking the time to type that all up, yep modules is the main thing I'm missing at the moment! Probably another stupid question here... Compatibility maybe a problem though, the games I'm currently putting together for a client do need to run on devices (probably up to 4 years old), and Ive already come across a couple of problems with using es6 features (const was one if I remember) so if modules are only going to run on es6 capable browsers, do any of these tools offer an option to rebundle/recompile into a single js file if that was the only solution? I'm using VSCode alongside a localhost works perfectly for checking on mobile + desktop, but not sure how to set that up with modules, I tried a couple of tests from es6 code I found but it came back with errors on import So would something like browserify also enable to extend classes I presume? One of the first things I want to try it out with is a basic UI Kit, so intially starting with layout grids, tables, controls etc. So a type checker - on a simple level guessing that's more of a way to cast types to variables? Something I do again miss, but not vital atm
  2. 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!
  3. Spine 3.6

    In case anyone missed it, Spine got a significant update yesterday, with better weight and mesh tools + clipping/ finally! Clipping not ideal for everything (using a vertices system) so complex masks may still need to be done manually. Still nice for quick and simple masks! Just tested in PIXI and clipping not working as I imagined, but hopefully could be added to pixi-spine soon? http://esotericsoftware.com/blog
  4. Spine and cacheAsBitmap

    Think I may have got one step closer with this by accident. I was running a bit of debug, so added an standard browser alert before the spine icons were due to play out. Confirming the alert then goes back to the code. With this alert active the caching seems to work, and the animations do not play. Could it be a time delay that is needed for the caching - could the spine animation playing out too quick and stopping this from happening?
  5. Spine and cacheAsBitmap

    Hi Ivan Have tried it again with the cactusContainer in my scene with the cactus spine object as a child. Thought it would be a more simple test than the icons, with them not being through a prototype. I don't think there is anything else that would be interfering with the cache, but it still appears not to be working, Could it possibly be the animation? Do they need to be stopped before cacheing? If the cacheAsBitmap=true was successful wouldn't that instantly cause the spine animation to stop playing? I have dropped a link your way with the current build and problem. Any clues greatly appreciated!
  6. Spine and cacheAsBitmap

    lol I've given them a shot! ES6 is definitely something I need to figure out, I'm used to Unity and Flash really so just being able to split classes down to OOP on GameObjects and MovieClips! Updated the code and its still not cacheing, I'll take another look later, I've probably messed up somewhere
  7. Spine and cacheAsBitmap

    Many thanks, I'm still very new to prototypes! So should that be? ... function winIcon() { this.name="winIcon"; PIXI.Container.call(this); this.spineIcon; this.setSpineIcon = function(spineIco) { this.spineIcon = spineIco; // Declaring the spine icon } this.resetIcon = function() { this.spineIcon.state.clearTracks(); this.alpha = 0; this.scale.set(2,2); } this.iconWin = function(delay) { this.spineIcon.state.addAnimation(0,'win', false, delay); TweenMax.to(this.scale,0.3,{x:1.4,y:1.4, repeat:1, yoyo:true, delay:delay, ease:Sine.easeIn}); } } winIcon.prototype = Object.create(PIXI.Container.prototype); winIcon.prototype.constructor=winIcon;
  8. Spine and cacheAsBitmap

    Thanks, the spine elements are already in containers (which is what I was trying to cache on) I'm using a couple of prototypes, one for gameReel which is where this function creates the winIcon(Containers) also from a prototype. The spine icons are just added as children to the winIcons.... This is the function on the gameReel prototype that generates the icons... this.createIcons = function(res,data) { this.icons = []; // Generating an portion of the reel generated by a random index(see function) this.iconData = data; var newIcons = getIconRange(this.iconData); this.currentIcons = newIcons; this.iconData = data; // Create 3 icons for(var i = 0; i < newIcons.length; i++) { var icon =new winIcon(spineIcon); icon.cacheAsBitmap = true; this.icons.push(icon); var spineIcon; this.addChild(icon); switch(newIcons[i]) { case 0 : spineIcon = new PIXI.spine.Spine(gameArt.icoStar.spineData); break; case 1 : spineIcon = new PIXI.spine.Spine(gameArt.icoKing.spineData); break; case 2 : spineIcon = new PIXI.spine.Spine(gameArt.icoQueen.spineData); break; } // Declare the icon only once it has been created.. icon.setSpineIcon(spineIcon); // If a Spine Icon has been created (failsafe for errors) if(spineIcon!=null) { spineIcon.skeleton.setToSetupPose(); icon.addChild(spineIcon); icon.y = i*190; } icon.resetIcon(); } } then this is the the prototype for the winIcon itself.. // WIN ICON Prototype function winIcon() { this.name="winIcon"; PIXI.Container.call(this); this.spineIcon; this.setSpineIcon = function(spineIco) { this.spineIcon = spineIco; // Declaring the spine icon } this.resetIcon = function() { this.spineIcon.state.clearTracks(); this.alpha = 0; this.scale.set(2,2); } this.iconWin = function(delay) { this.spineIcon.state.addAnimation(0,'win', false, delay); TweenMax.to(this.scale,0.3,{x:1.4,y:1.4, repeat:1, yoyo:true, delay:delay, ease:Sine.easeIn}); } } winIcon.prototype = Object.create(PIXI.Container.prototype); Please excuse the code, I'm still very new to javascript and still much more of a designer than a developer I'm afraid! I also tried adding the line this.cacheAsBitmap = true; to a few different places in the winIcon prototype but still doesn't seem to be working
  9. Hi all, been working on trying to get my game a little more optimised for mobile. It's a slot game - just 9 icons all spine skeletons. The icon drop is animated with GSAP. Win detection then plays out the winning lines. At the moment FPS for mobile (on my G4 is around 20-30fps, desktop 60fps) So I've tried setting cache to bitmap as true once the icons have been created but neither seems to work. The animation still plays out once a win is detected (without turning cacheAsBitmap back to false) Tried setting cacheAsBitmap on both the parent containers and the icons themselves, but still no luck. Tested it on a spine animated cactus I have in the background as well and that works fine which is weird. Any ideas greatly appreciated!
  10. Morning! Just working on a bit of a debug console for my game, was just wondering if it was at all possible to switch the renderers at runtime? Have tried a couple of methods, but it just halts the code from executing I think (no error), but guessing it would be a nogo?
  11. (FIXED) InteractionManager Error (pointerType)

    That's brilliant thanks! Will stick with what's working at the moment (Don't have a massive use of DisplayGroups atm) do you know if there are plans to incorporate DisplayGroups or something similar directly into Pixi with V5 maybe?
  12. (FIXED) InteractionManager Error (pointerType)

    Looks like I didn't! Sorry about that again. Have replaced with the latest and that has fixed it for me, many thanks again!
  13. (FIXED) InteractionManager Error (pointerType)

    Sorry think I've found this issue already raised on pixi-display.js? https://github.com/pixijs/pixi-display/issues/13 Will see if I can get around without using DisplayGroups for the time being, unless anyone has any suggestions?
  14. (FIXED) InteractionManager Error (pointerType)

    Have narrowed this one down. Believe it has something to do with pixi-display.js I have just added this script to another project with a couple of displayGroups and the same error occurs in that one too?
  15. (FIXED) V4 9-Sliced Sprites

    Wow! Massive apologies, no idea how I got that one so wrong! Can only guess I had tried playing with the numbers before I updated to 2.5.2 though sure I double checked them. Many thanks - fresh eyes certainly helped on this one I think!