01271

Members
  • Content count

    23
  • Joined

  • Last visited

About 01271

  • Rank
    Member

Profile Information

  • Gender
    Male
  1. It's a simple question but I don't think any of the tutorials told me where to place an index.html file. In melonjs there's a premade file included for testing the game on a browser but here the boilerplate doesn't include it. There are several different project templates in the resources folder but I don't know where to drag them to start. I'm asking so that grunt will be able to pick up my files and package them together. I have the latest phaser CE.
  2. for some reason doing me.levelDirector.reloadLevel(); makes the level come in as a second layer over top of the first level and fixes the issue of the level not scrolling, except it scrolls forwards while advancing over the previous container. This is such strange behaviour...
  3. damn so if I want a level to scroll I can only use states and not containers? I only use me.game.viewport.follow(this, 3); once but I also gave viewports inside the containers a try, even both at once. I think there's an extra factor about the level because I changed the order my containers were being initialized and I got some weird "scrolling" that came from the opposite side of the screen. (yes the level loader has the second parameter with the container:this in it)
  4. Couldn't you take the canvas and apply rules to it with css? It should still draw fine.
  5. I'm still at a loss with both viewports seemingly supposed to follow the player at the same time. I feel the game should at least move the place it's rendering when I do moveTo. Any ideas at all?
  6. As I said, if it runs every frame it will plot different paths. I used code like yours every frame and ended up with wavy paths. You must set the velocity only once every time it reaches a new destination. I myself used this: if (this.body.vel.y === 0 && this.body.vel.x === 0) { var Angle = Math.atan2(target.y - this.pos.y, target.x - this.pos.x); var ySpeed = Math.sin(Angle) * this.speed; var xSpeed = Math.cos(Angle) * this.speed; this.body.vel.x = xSpeed * me.timer.tick; this.body.vel.y = ySpeed * me.timer.tick; } It's basically the same as yours.
  7. I think mentioning the library (if any) in the thread tags would be a good idea. It would make it easier to find ideas and techniques for your wip game.
  8. Is that in the update function running every frame? If things run every frame then the result of the calculation changes a bit every frame and it can end up with something that looks like a sine wave.
  9. Ok so far so good. I added a viewport to the container. this.viewport = new me.Viewport(0, 0, 960, 640); this.viewport.follow(game.pointers.mainPlayer, me.game.viewport.AXIS.BOTH); but it doesn't actually follow the player and it dropped the fps down by half. I think the scene is being rendered twice.
  10. My viewport doesn't like the new system. It refuses to follow the player now that he's divorced from the game world, I tried making the container floating or not, tried updating the viewport bounds. It doesn't move from 0,0. Any ideas now?
  11. side note: sorry for making so many threads ( 3 in ~2 months ) but I have different issues and I think threads should be problem-centric rather than project-centric. So I wanted to know how to swap containers. Here's one of my containers. /** * a HUD container and child items */ game.inventoryContainer = game.inventoryContainer || {}; game.containers = game.containers || {}; game.containers.inventory = me.Container.extend({ init: function() { // call the constructor this._super(me.Container, 'init'); // persistent across level change this.isPersistent = true; // make sure we use screen coordinates this.floating = false; this.alwaysUpdate = false; this.visible = false; // give a name this.name = "inventoryContainer"; me.levelDirector.loadLevel("collision"); this.addChild(new me.ColorLayer("invbg", "#55233B"), 0); this.addChild(new game.invLayer1, 1); this.addChild(new game.ManagerEntity(0, 0), 2); game.pointers.containers.inventory = this; }, update: function(dt) { if (game.screenspace === this.name) { return this._super(me.Container, 'update', [dt]); } return false; }, draw: function(renderer, rect) { if (game.screenspace === this.name) { return this._super(me.Container, 'draw', [renderer, rect]); } return false; }, reactivate: function() { this.isRenderable = true; }, deactivate: function() { // this.isRenderable = false; // for (var i = this.children.length - 1; i >= 0; i--) { // this.children[i].pos.x +=1000; // } // me.game.world.removeChild(this); } }); It's added to the game via this.inventoryContainer = new game.containers.inventory(); me.game.world.addChild(this.inventoryContainer); How do I swap it out without losing its children? All I want is not to have it or its children use up processor cycles while another container is displayed. This I think would be interesting to other developers too.
  12. Sorry to be a bother I decided that container swaps are my best bet for changing things out. That way I can have the enemies moved from container to container easily. I don't know how to swap containers though. I tried making the container move 10000 pixels off the screen and I tried to change it by setting it all isRenderable = false; but neither worked, my other container just doesn't show up. What do I do to swap containers?
  13. The documentation for sprite animation is a bit out of date and a new method setAnimationSpeed(speed) or setAnimationSpeed(identifier, speed) should be added. I have a sprite and an animation this._super(me.Sprite, 'init', [339, 480, settings]); this.addAnimation('normal', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],100); this.setCurrentAnimation('normal'); This animates at a delay of 100 ms. I can change the animation delay by adding another parameter to the addAnimation method. I could not change the delay afterwards with the solutions I found. I have seen this answer: https://groups.google.com/forum/#!topic/melonjs/mk6mVcMoVKo but it is no longer relevant. this.anim.normal.animationspeed isn't a part of melonjs anymore and changing the other animationspeed settings doesn't have any effect. This is I think, because of a change from a 'global' animation delay to a frame-based animation delay. The new method for changing the speed of an animation should now be: setAnimationSpeed: function(identifier, speed) { for (var i = this.anim[identifier].frames.length - 1; i >= 0; i--) { this.anim[identifier].frames[i].delay = speed; } } There should be a note on the sprite and/or renderable pages about the animation speed able to be individually set on a per-frame basis. It could be useful for example if some character is looking to the left and then turning quickly to the right the frame set wouldn't have to look like this: [0],[0],[0],[0],[0],[0],[0],[0],[0],[0],[0],[0],[0],[0],[1],[2],[3],[4],[5],[5],[5],[5],[5],[5],[5],[5] and could just have a long delay on the 0 and 5 frames. Every X.0.0 version should result in a new version of the wiki and documentation with the changes you're making. Relevant changes to each could be made to affected pages after.
  14. I now remember a year ago I used a bunch of hacks to make a similar situation happen. I used this.isPersistent = true; which saves something from being removed by a state change and I used the following code I made up after analyzing melonjs to change sprite images. I guess the only question I have left for this thread is if there's a better way to switch images on the fly that doesn't feel as if I'm trying to break the framework. this.renderable = new me.AnimationSheet(0, 0, { "image": me.loader.getImage('criminal'), "framewidth": 260, "frameheight": 129, "spacing": 0, "margin": 0 }); this.body.width = 260; this.width = 260; this.renderable.width = 260; this.renderable._width = 260; this.renderable._bounds._width = 260; this.renderable.resizeBounds(197, 260); this.updateBoundsPos(197, 260); This worked in melonJS-2.1.3 and probably works now in v4.0.0 (if not it shouldn't be too hard to change)
  15. What sort of framework would be used to switch the way that enemies function in an overworld/battle screen type game. The design is as follows: The player can see enemies on the game world screen and move around up, down, left, right. When the player touches an enemy both of them are transported to the fight screen. Intuitively, this screen should be a separate state. Now the problem arises: in the second fight screen state, the player and enemy behave very differently from normal. They stop moving up/down/left/right and take turns fighting. They are also shown from up close so their sprites are larger and more detailed. The battle can end without all of the combatants being defeated so values need to be persistent across both forms as the enemies & player should remain damaged post-combat. I tried this before without too much success, I had the characters pull out of the pool and then "realize" which state they're in and instantiating with a different image/modifying their behaviour accordingly. The problems with that solution were that the code was super clunky (if/else everywhere) and it didn't have persistent values when returning from a fight. Basically the enemies were managed by a director "class" that impersonated a real method of data storage. They had a prototype Finite State Machine controlling them too. var enemyDirector = { saveEnemyData: function() { var entList = me.game.world.getChildByName(); for (var i = entList.length - 1; i >= 0; i--) { if (typeof entList[i].selfData !== 'undefined') { var essentialEnemyData = { selfData: {}, pos: {} }; essentialEnemyData.selfData.modelname = entList[i].selfData.modelname; essentialEnemyData.selfData.hp = entList[i].selfData.hp; essentialEnemyData.selfData.maxhp = entList[i].selfData.maxhp; essentialEnemyData.selfData.uniqEnemyNum = entList[i].selfData.uniqEnemyNum; game.enemyTracker.enemyStates.push(essentialEnemyData); } } }, fightPositions: [], restoreEnemyFromSave: function(id) { for (var i = game.enemyTracker.enemyStates.length - 1; i >= 0; i--) { if (game.enemyTracker.enemyStates[i].selfData.uniqEnemyNum === id) { createPlaceEnemySprite(0, 0, game.enemyTracker.enemyStates[i], true); } } }, restoreAllEnemies: function() { for (var i = game.enemyTracker.enemyStates.length - 1; i >= 0; i--) { enemyDirector.restoreEnemyFromSave(game.enemyTracker.enemyStates.selfData.uniqEnemyNum); } }, restoreFightEnemies: function() { for (var i = game.data.enemyForFight.length - 1; i >= 0; i--) { enemyDirector.restoreEnemyFromSave(game.data.enemyForFight[i]); } } }; There has to be a better way but though I'm experienced in Javascript I'm not experienced in solving data/interaction models for JS games. I'm thinking for the enemy behaviour I can use my finite state machine to simply have the enemy move how I want him to in any situation but the sprites changing on state change & data persistence is more of a problem.