• Content Count

  • Joined

  • Last visited

Everything posted by 1-800-STAR-WARS

  1. Thanks kevdude, I'd worked it out in the end - had never noticed the 'setMinMax' function in the scaling manager before, so that in combination with resizing the game and offsetting the world co-ordinates to keep things centred did the trick. Cheers.
  2. Hi all, I have a game built in landscape orientation, but there is a lot of dead space around the edges - ie the game elements are all in the centre, and around 40% of the game (ie 20% on each side) is essentially background details that aren't necessary for the game to function. I was wondering if it would be possible to essentially trim the edges off the game while maintaining the central elements when the game is in portrait mode? I was thinking this could be achieved using CSS alone by scaling up the canvas or container element beyond the width of the viewport but I've had no success with that so far, though I reckon it's still possible somehow. Maybe there are some options from within Phaser by resizing the game, if so is there a way to keep the game centred? Cheers!
  3. I see what you mean - I'm focussing mainly on the old Lucasarts style with a character that moves where you click right now. I can see why some may find that cumbersome, but I'm too nostalgic to let it go There should definitely be support for other control schemes as this thing matures though. In terms of having to click exactly on the point on the floor you want to go - the old Lucasarts games would let you click anywhere and move the character to the nearest point on the navmesh. That should be easy enough to do - when the scene is clicked, and no nav polygon is under the mouse, find the nearest one and set that as the destination. I thought about using just collision maps instead of nav maps but I figured there might be weird edges cases. EG say there is, I dunno, a bookshelf between the character and the point you want to go to. With a collision map, the character would walk up to the bookshelf, sort of 'stick' to the edges of it as it moves around it to the target point. With a navmesh system the character would pick a more sensible route that avoids the bookshelf entirely.
  4. OK, I did a bit of hacking over the weekend and started making a pathfinding/navigation system for point n click games. It's by no means a final or even necessarily good approach but it's what I got to after a day or so. http://lewispollard.github.io/phaser-pnc/demo/ You can see faintly on the floor a navigation mesh. You can modify this mesh by pressing D. Clicking will add a point, and pressing Enter will create a polygon out of those points and calculate where the centre point of the poly is. You can press Z to undo the last action (including removing already existing polys). Changing the navmesh will output the JSON for it in the textbox on the right. If a point in the poly overlaps another poly, it will create a path between the two centre points. This creates the graph of linking nodes you see represented by lines. This graph is fed into a Dijkstra's shortest path implementation found here. When you click somewhere in the navmesh, the polygons get iterated over to find which poly the player character is standing in, and which poly is being clicked. It then uses the Dijkstra script to find the shortest path between those two polys. The plugin then essentially creates a chained tween that moves the player sprite to the centroid of each poly in the route. In my local copy it also then moves the player to the exact point clicked but I haven't committed it up just yet as I'm away from my machine. It works! But is pretty janky and quite inefficient, and has some bugs (for example, if you click the poly with index 0 it just straight up tweens to it without following a path. Haven't figured that one out yet!). So if anyone has any suggestions feel free to discuss or submit a pull request or whatever My ideas for improvements: test line intersections for overlapping polys rather than the current way using point intersections. Add points where polys overlap. Move to these points as intermediates rather than moving straight from centre of poly A to poly B. Maybe interpolate the whole path slightly so it doesn't look so much like the sprite is moving along fixed, straight lines?
  5. You should also be able to pass frame names in an array: emitter.makeParticles('atlasName', ['frameName']);
  6. I don't think it's possible to prevent ESC from closing fullscreen. Iirc browsers prevent that keypress (and probably F11) from being halted by Event.preventDefault() so that malicious programmers/advertisers can't prevent people from leaving fullscreen. FWIW if you want to try it I believe the keyCode for ESC is 27. It might work in some but not all browsers.
  7. Double post, I apologise, but I started a document to try and plan this thing out and get it started as I think it could be a great project. https://docs.google.com/document/d/1XKQp-XMvBXb1GgigIqhmJe974W_EEEs6XRF_NqFaLqI/edit?usp=sharing I've made it publically editable so feel free to add any ideas you have and we can get a github repo up soon if people are interested. Edit: Git repo here: https://github.com/lewispollard/phaser-pnc If you wanna get involved PM me here or on github and I'll add you as a collaborator!
  8. I'm still interested! Got too busy with work and never got round to it before, but I'd be eager to collaborate on something like this.
  9. The blur event works fine for me on both Android and iOS Chrome. How are you checking if the events are firing?
  10. You need to add npm/node to your system path: http://www.hacksparrow.com/install-node-js-and-npm-on-windows.html Alternatively there should be an entry in your start menu under the Node folder called 'Node.js command prompt' which will automatically have the path set for that instance of cmd only.
  11. I love you guys. How are you so good at this?
  12. You might have seen the 265 line js raycaster going around recently - I decided to give it a shot myself on this cloudy Sunday afternoon, and implement it in Pixi (as it might be easier down the line to add sprites, use masking, shaders, etc). The code isn't documented at all really and is questionably structured (using browserify modules), but I basically just followed this tutorial while refactoring for convenience along the way, and adapted some bits for Pixi. I'm hoping to improve it further and document it properly, but I think it works quite well for a couple of hours' work. Anyway, here's the demo and here's the code. Arrow keys to move/turn, space to 'fire' (though all that does it play the firing animation ). I've not tested it anywhere other than my laptop in Chrome, so let me know if it runs badly/breaks - it doesn't seem to like Safari, and I've not tried it on mobile at all. If it does run badly, this is a relatively high resolution (800x450) - you can set the resolution in the 'config.js' file, and the FOV is controlled by the 'plane.x' property in camera.js. It runs smoothly in Chrome even at 1920x1080 - though the skybox breaks as it was a last minute addition (should note - textures are ripped from wolfenstein and the skybox is taken from the original demo above)
  13. Also getting cross-origin errors in IE10 in 1.5.2, 1.5.3 and the dev branch - appears to be the bitmap font loader causing the issue, everything else seems to load ok. Each font load triggers a cross origin error and this error in pixi: SCRIPT5007: Unable to get property 'getAttribute' of undefined or null referenceSeems to be when it's trying to get the file attribute from a tag at this line (apologies, only got minified output) var i=this.baseUrl+e.getElementsByTagName("page")[0].getAttribute("file")Context is BitmapFontLoader Hope this is helpful. Cheers!
  14. Interesting, but how does it differ from eg: http://www.free-track.net/english/ or http://facetracknoir.sourceforge.net/home/default.htm
  15. At the time I made the post, I wasn't aware of Browserify - it only really picked up in tech forums earlier this year. As you said, it's mainly for structure & organisation, forced module pattern, as well as dependency injection and the benefits that can bring in terms of reusable code. Really, that stuff just comes down to preference, and I happen to have had the most experience with requirejs. Also, require can do the same concatenation down to one file using its r.js script.
  16. I just copied the above code, and took out the player and bg sprites (as I don't have them). Seemed to work as expected. Are you sure you're not somehow drawing the background on top of the text?
  17. The 'allow rotation' and 'trim mode' settings need to be turned off or you might run into these errors if the texture size isn't big enough and it tries to do tricks to pack the images in that PIXI doesn't support (yet)
  18. Great work Rich! The API is looking really solid. Exciting stuff!
  19. I understand that English isn't your first language, but you need to do a lot of spellchecking in game. Even the title of the game is mis-spelled
  20. Presumably this is related to the freezing bug in Samsung 4.1 roms. If that's the case - it's a stock browser bug and unfortunately there's nothing you can do besides telling your users to install Firefox/Chrome.
  21. Dubious too, this has been hyped to hell on various tech forums, but like Rich said they haven't really demoed much other than a useless periodic table app using CSS3 transforms running in a presumably stripped back chromium fork or something similar. They've yet to demo anything that really shows anything beyond that capability, but at least the release date means it isn't complete vapourware!
  22. Here's a little snippet for graphics based healthbars that go from green to red as health gets lower (copied straight out of a game and minimally edited for context so hopefully it makes sense) this.healthbar = game.add.graphics(0,0);this.group.add(this.healthbar); // this.group being a pre-initialised group for this entity...this.hp = 20;this.totalhp = 20;this._lasthp = 0;if (this._lasthp !== this.hp) { this.healthbar.clear(); var x = (this.hp / this.totalhp) * 100; var colour = utils.rgbToHex((x > 50 ? 1-2*(x-50)/100.0 : 1.0) * 255, (x > 50 ? 1.0 : 2*x/100.0) * 255, 0); this.healthbar.beginFill(colour); this.healthbar.lineStyle(5, colour, 1); this.healthbar.moveTo(0,-5); this.healthbar.lineTo(config.tileSize * this.hp / this.totalhp, -5); this.healthbar.endFill();}this._lasthp = this.hp;Here's utils.rgbToHex: rgbToHex: function (r, g, { return "0x" + ((1 << 24) + (r << 16) + (g << 8) + .toString(16).slice(1);}(I think there's already a function somewhere in Phaser to do that part but when I wrote the code I wasn't aware of it) Also config.tileSize is, predictably, the size of tiles in px (this was a top down game) but you can specify whatever width you want the full bar to be there. This was written a while ago so I have no idea if it works for later versions of Phaser but it's fairly simple so it should do.
  23. From the looks of things, those micro-optimisations didn't do much, as his 'optimised' pixi lib seems to be waaaay more stripped down than what he suggested - ie missing pretty much every feature besides drawing an image file to the screen... No filters, no masking, etc. Still curious to see how much of a difference the micro-optimisations would make, though.
  24. Mastermind is always fun! The UI obscured some of the screen for me (Chrome 32 Windows).