ipop

Members
  • Content Count

    25
  • Joined

  • Last visited

About ipop

  • Rank
    Member

Contact Methods

  • Twitter
    principlegames
  1. ipop

    Box 2d wraparound

    Hi i found this flash example for wraparound in a box 2d environment, does anyone know how to port this over to javascript or know of a similar javascript example? http://www.wildbunny.co.uk/blog/2012/04/13/implementing-a-wrap-around-world/ thx
  2. ipop

    Need Help :-)

    Hi all ill contain all my questions in here so as not to clutter up the forum, im trying to write a simplish platform game ... to learn both javascript and pixi. So if you have the time and patience to help me make the code any better or poitn out what im doing wrong, i would greatly appreciate it. It takes me ages to get what i want working but largely through trial and error. So here's my first attempt at generating tiles from an array (pasted from tiled export) and a set of textures in a folder: var myContainer = new PIXI.DisplayObjectContainer();var map_tile_size = 64;var WIDTH = 1024;var HEIGHT = 768;var width_in_tiles = WIDTH/map_tile_size;var height_in_tiles = HEIGHT/map_tile_size;var row = 0;var column = 0;var map = [ 1,17,2,3,4,0,0,0,0,0,0,0,0,0,0,0,0,18,0,0,0,0,0,0,0,0,1,2,1,2,0,0,0,26,4,2,6,7,8,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,2,3,4,6,7,8,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,6,7,2,3,0,0,0,0,0,0,0,0,0,0,0,5,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,7,8,0,0,0,0,0,0,0,0,0,8,7,0,0,0,0,0,0,0,0,0,0,0,0,6,7,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,21,22,23,24,21,22,23,24,21,22,23,24,21,22,23,24]; console.log("map data loaded", map)function drawmap(){ for (tile_count = 0; tile_count < map.length; tile_count++, row++){map_tile_value = map[tile_count];if (row >=16){row=0;column ++;}if(map_tile_value >0){var new_tile = PIXI.Texture.fromImage("art/tiles/current/tiles_jungle_"+ (map_tile_value) + ".png");t = tile_count;var t = new PIXI.Sprite(new_tile, 64,64);t.position.x = row *map_tile_size; t.position.y = column *64; myContainer.addChild(t); } stage.addChild(myContainer);console.log(myContainer)}}SO here's what i think im doing: loading the map data iterating through it if theres a number greater than zero in map data, create a pixi sprite referencing that png and add it to the container at the appropriate position So it Works ... :-) What can i do differently to improve it? Is it fast/slow? Am i reloading textures when var new_tile is the same value or is pixi referencing the same sprite behind the scenes.. how do i access the tiles in the container to update them when they scroll ( i will need to have an offset for the x (based on player movement) and then some logic to repeat a column if it is the end of the map and goes off scrreen ..) So im fine i think with the logic, but my main problem at the moment is how to access the x propoertiies of everything int he container.... Any help appreciated as ill be cracking on regardless but it would be awesome to get some feedback and guidance from people who understand pixi and javascript a whole lot better than me! How do i find the info im looking for such as what sin a container, its x and y position and inevitably some custom values.... EDIT: https://chrome.google.com/webstore/detail/webgl-inspector/ogkcjmbhnfmlnielkjhedpcjomeaghda/related im not duplicating textures at least :-) Any time or effort, greatly appreciated, ill write up some noob tutorials in return :-)
  3. ipop

    Tiled json export

    Many thanks .. im making a lot of mistakes with my code (but enjoying the challenge) .. you think people would mind me throwing stuff up here so i can learn ... maybe i could write it up for you in return as some noob tutorials?
  4. ipop

    Tiled json export

    Wow! goes a bit above my head .. been lokoing at the json export from tiled, which looks pretty simple. Im just learning JS so im confused as to what the pixi loader/parser does with any json it loads .. as it seemingly parses the data when it loads? how do you access the object(s)?
  5. the other thing ive found is a jerk every 60fs or so on the render texture demo .. anyone any ideas why that might be , cocoon is displaying 62fps .. do you have to synch the gfx display in some way or set an fps somewhere? .....any advice also appreciated
  6. Well great news i tested all the pixi examples on coocoon js and they all work (except fonts) including touch events, the two photon demos were the only ones that didnt run at 62 fps... the one issue i found so far is with tiling texture.. if you let the demo example run for awhile the smooth scrolling and scaling soon becomes jerky, would that be a problem on cooccons end? and anyone have nay idea what it is or how to fix it!
  7. when i try to loop a backgound using TilingSprite, i get Stuttering of the graphic: // create an new instance of a pixi stage var stage = new PIXI.Stage(0x97c56e, true); // create a renderer instance var renderer = PIXI.autoDetectRenderer(window.innerWidth, window.innerHeight, null); // add the renderer view element to the DOM document.body.appendChild(renderer.view); renderer.view.style.position = "absolute"; renderer.view.style.top = "0px"; renderer.view.style.left = "0px"; requestAnimFrame( animate ); // create a texture from an image path var texture = PIXI.Texture.fromImage("sky.jpg"); var tilingSprite = new PIXI.TilingSprite(texture, 1024,1024); stage.addChild(tilingSprite); //stage.addChild(tilingSprite1); function animate() { requestAnimFrame( animate ); tilingSprite.tilePosition.x += 7; renderer.render(stage); } https://www.dropbox.com/s/k49119yz1griq2q/sky.jpg
  8. ipop

    Tiled json export

    Has anyone looked into or have example code of using tiled editor to export json and display in pixi?
  9. With var tilingSprite = new PIXI.TilingSprite(texture, window.innerWidth, window.innerHeight) var count = 0; stage.addChild(tilingSprite); The stage is filled by the same tile repeating is that what PIXI.TilingSprite does? How do you reference an array of tiles, and then display them using .TilingSprite? or is this for scrolling a background, for example?
  10. hi thanks fro the tutorials.. i was trying to work through them but there's no link to the json file ..edit ( i guess its in the repo :-)
  11. ipop

    Duplicate Container

    theres a point where the tile is visible on both sides as its a single screen ...
  12. ipop

    Duplicate Container

    Hi All I have a container holding sprite tiles. I want to loop the screen. so im duplicating the container and displaying a second container on the edges of the screen then turning the visibility on and off when either container leaves the screen completely. IS there a better way of doing this? Whats the best/quickest way of duplicating a container. How do you move the duplicate container separately to the other container.
  13. Thanks for the tutorials, it got me up and going really quickly. Im a bit of a js noob and was hoping you coudl explain wahts going here, in a little more detail? var __extends = this.__extends || function (d, b) { //?? function __() { this.constructor = d; } //?? __.prototype = b.prototype;//?? d.prototype = new __();//no idea!!! }; var tuto; (function (tuto) { (function (Ezelia) { // Class var GameScene = (function (_super) { __extends(GameScene, _super);//whats going on here? function GameScene() { _super.call(this);//whats this?
  14. ipop

    SpriteSheet.json

    We were using the adobe shoebox .. but i have to be frank .. the output changes every time there's an update and results also change .. doesnt handle mip mapping well either .. even with a 4/8 pixel border....
  15. ipop

    SpriteSheet.json

    Hi What package (other than texture packer, ie a free one:-) outputs the SpriteSheet.json used in the Movie clip Example? Cheers