Gyldstrand

Members
  • Content Count

    24
  • Joined

  • Last visited

  1. I don't know why that was so difficult for me. I never changed the renderer from the stage to the root container. I'm gonna leave you guys alone for a couple weeks.
  2. My game world is a stage with everything in it that scrolls around the map based on players position in the renderer's view. If I try to render a separate container the same way I render the stage I get nothing showing up or a black screen.
  3. Whats the dumbed down version of that? I can't get anything to stay with the screen unless I base it off my players position.
  4. How do you position the user interface graphics / sprites to stay on the screen?
  5. I just discovered that if I take out the MapObjects.chest.hitArea, it will work. Is there a reason for that?
  6. var MapObjects = {}; function setupMapObjects() { MapObjects.chest = new PIXI.Sprite(frame("images/chest.png", 0, 0, 50, 50)); MapObjects.chest.x = 200; MapObjects.chest.y = 200; MapObjects.chest.anchor.x = 0.5; MapObjects.chest.anchor.y = 0.7; MapObjects.chest.interactive = true; MapObjects.chest.on('click', openChest); MapObjects.chest.hitArea = new PIXI.Circle(MapObjects.chest.x, MapObjects.chest.y, 10); MapObjectsArray.push(MapObjects.chest); stage.addChild(MapObjects.chest); }; function openChest() { console.log('open'); }; var Player = {}; function setupPlayer(){ Player.sprite = new PIXI.Sprite(frame("images/Player.png", 0, 0, 128, 128)); Player.sprite.anchor.x = 0.5; Player.sprite.anchor.y = 0.7; Player.sprite.x = 150; Player.sprite.y = 150; Player.vx = 0; Player.vy = 0; Player.direction; Player.directionIdle; Player.idle; Player.moving; Player.frameCycle = 0; Player.action = false; Player.run = false; Player.melee = false; Player.sprite.interactive = true; Player.sprite.on('click', openChest); stage.addChild(Player.sprite); }; MapObjects.chest does not respond to the .on('click', openChest) but Player.sprite does. I don't know man.... I just don't know. I marked this off my To Do list a few days ago cause it was working but now... (head explodes) I guess I should ask if there is another way to apply the click event to the sprite.
  7. Well that only worked when the entire image was green. I'm guessing var collides = pixels[ (player.x + player.y*collisionMap.width) + 1 ] > 0; is not how you get the green pixels. is it? var collides = pixels[ (Player.sprite.x * 4) + (Player.sprite.y*collision.width * 4) + 1 ] > 0; We got it. Close this mother before I come back.
  8. I could not get any pixel data for red. 0's across the board for some reason. Its the defined red hex code and everything. I even tried a solid red image. Luckily green's got my back and var collides = pixels[ (player.x + player.y*collisionMap.width) + 1 ] > 0; seems to be working on the test run. Thanks for the help.
  9. Alright, I got to the Uint8ClampedArray and everything worked but I think I was looking at a blank canvas. I used var img = new Image(); and then img.src = 'images/collisionMap.png' Is that img.src right? Tomorrow we'll be victorious. I can almost taste...Zzzzz..
  10. failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(HTMLImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap)'; whyyyyy
  11. Every time I try to use / find the context, I get errors. I think it's a myth. Tried renderPIXI.context.drawImage(collisionMap, 0,0, collisionMap.width, collisionMap.height); but the drawImage property is undefined.
  12. I know I keep polluting this forum with my dumb questions.. BUT, what would be the easiest way to do a collision map not using tiles. I have seen some that make a solid color and tell the player they can't step into that color. I don't know how to get the color data for that so I was going to draw polygons and use ContainsPoint and kick the player out if he steps in or near and I couldn't figure out how to add points to a polygon already drawn so now I am running around the map and writing down my player location where I want my polygon points to be drawn and I felt stupid. More than usual. Who can shine the light for me? Turns out a huge polygon doesn't know when it contains a sprite's point.
  13. var canvas = document.getElementById("demo1"); var ctx = canvas.getContext("2d"); var light = new Lamp({ position: new Vec2(200, 150), distance: 200 }); var disc = new DiscObject({ center: new Vec2(100, 100), radius: 30 }); var rect = new RectangleObject({ topleft: new Vec2(250, 200), bottomright: new Vec2(350, 250) }); var lighting = new Lighting({ light: light, objects: [ disc, rect ] }); lighting.compute(canvas.width, canvas.height); ctx.fillStyle = "black"; ctx.fillRect(0, 0, canvas.width, canvas.height); lighting.render(ctx); Trying to test out http://greweb.me/illuminated.js/gettingstarted.html but I get errors about the ctx. I tried the renderer.context but nothing changed. Is this something that needs to be rewired for PIXI or is there a simple replacement for the reference?
  14. I see this referenced in everything: var canvas = document.getElementById('mycanvas'); var ctx = canvas.getContext('2d'); How do I access these with PIXI? Is it renderPIXI.gl.canvas and renderPIXI.gl.canvas.getContext?