Search the Community

I want to create 5 possible animations text instances that cycle through every time an action happens (like a button press for example). I am thinking this needs to be an array that increases the x position with a for loop (i++). What is the syntax for an array of text objects that can be cycled through with a for loop? Thanks in advance. Im new at pixi this is what I have so far: //Aliases: this is shorthand var Container = PIXI.Container, autoDetectRenderer = PIXI.autoDetectRenderer, loader = PIXI.loader, resources = PIXI.loader.resources, Sprite = PIXI.Sprite; //Create a Pixi stage and renderer and add the //renderer.view to the DOM var interactive = true; var stage = new Container(interactive), renderer = autoDetectRenderer(500, 500, { antialias: false, transparent: false, resolution: 1 }); document.body.appendChild(renderer.view); var btbTexture = PIXI.Texture.fromImage('https://res.cloudinary.com/dubyisimd/image/upload/v1481228417/buttonplaceholder_iit0dp.png'); var btn = new PIXI.Sprite(btbTexture); btn.scale.x = 0.5; btn.scale.y = 0.5; btn.anchor.x = 0.5; btn.anchor.y = 0.5; btn.position.x = 55; btn.position.y = 475; btn.interactive = true; btn.on('mousedown', () => console.log('mousedown')); stage.addChild(btn); //load an image and run the `setup` function when it's done loader //add images by: //.add("images/beerCup_logo.png") .add("https://res.cloudinary.com/dubyisimd/image/upload/v1481228417/buttonplaceholder_iit0dp.png") //creates a progress statement that will check to see if assets are loading .on("progress", loadProgressHandler) .load(ScrollingText, addButton); //.load(); //this function will check to see if all assets are loading to the stage. loader function loadProgressHandler(loader, resource) { //Display the file `url` currently being loaded console.log("loading: " + resource.url); //Display the precentage of files currently loaded console.log("progress: " + loader.progress + "%"); //If you gave your files names as the first argument //of the `add` method, you can access them like this //console.log("loading: " + resource.name); } //button: function addButton() { button = new sprite(resources["https://res.cloudinary.com/dubyisimd/image/upload/v1481228417/buttonplaceholder_iit0dp.png"].texture); stage.addChild(button); button.x = 15; button.y = 15; } //text scroll: function ScrollingText() { //Im thinking this is where the array of 5 possible text positions should be text = new PIXI.Text('This is a pixi text', { fontFamily: 'Oswald', fontSize: 24, fill: 0xff1010, align: 'center' }); stage.addChild(text); text.x = 500; text.y = 0; gameLoop(); } function gameLoop() { requestAnimationFrame(gameLoop); text.x -= 1; renderer.render(stage); }