AnimatedSprite does not play

[Alekz Force]

I'm new to Pixi.js I did a code to make a simple 3 frame animatedSprite but it never leaves the first frame, if I do a gotoAndPlay(1) it goes to the desired frame and stops, and if I console.log the ticker it keeps on the frame as it were stopped but the playing property is true. Can't find the error anywhere. Somebody could help me out here? The code is below:

 

var	w = window.innerWidth,
	h = window.innerHeight,
	objs = {},
	tex = {},
	anim = {},
	prop = w/16,
	props = {
		grass: [2060, 745, 16],
		trave: [1334, 471, 10],
		rede: [1309, 454, 9.8]
	};

var app = new PIXI.Application(w, h, {backgroundColor: 0x33aaff});

app.renderer.autoResize = true;

resizeAll();

$('#div_canvas').append(app.view);

objs['message'] = new PIXI.Text(
	"Carregando...",
	{fontFamily: "Arial", fontSize: 20, fill: "white"}
);
objs['message'].position.set((app.screen.width/2)-(objs['message'].width/2), (app.screen.height/2)-(objs['message'].height/2));

app.stage.addChild(objs['message']);

app.loader
	.add('css/fonts/Quantico-Regular.otf')
	.add('img/grass.png')
	.add('img/trave.png')
	.add('img/rede.json')
	.on("progress", loadProgressHandler)
	.load(onAssetsLoaded);


function loadProgressHandler(loader, resource){
	objs['message'].text = "Carregando..."+(Math.round(loader.progress*100)/100)+"%";
	objs['message'].position.set((app.screen.width/2)-(objs['message'].width/2), (app.screen.height/2)-(objs['message'].height/2));
	app.renderer.render(app.stage);
}

function onAssetsLoaded() {
	app.stage.removeChild(objs.message);
	delete objs.message;
	tex['grass'] = app.loader.resources["img/grass.png"].texture;
	tex['trave'] = app.loader.resources["img/trave.png"].texture;
	tex['rede'] = app.loader.resources["img/rede.json"].textures;
	anim['rede'] = [];
	for(var i=0; i<3; i++){
		anim['rede'].push(tex['rede']['rede0'+i+'.png']);
	}
	console.log(anim.rede);
	objs['grass'] = new PIXI.Sprite(tex['grass']);
	objs['grass'].anchor.set(0.5, 0.0);
	objs['grass'].position.set(app.screen.width/2, app.screen.height/2);
	objs['trave'] = new PIXI.Sprite(tex['trave']);
	objs['trave'].anchor.set(0.5, 0.8);
	objs['trave'].position.set(app.screen.width/2, app.screen.height/2);
	objs['rede'] = new PIXI.extras.AnimatedSprite(anim.rede);
	objs['rede'].anchor.set(0.5, 0.8);
	objs['rede'].position.set(app.screen.width/2, app.screen.height/2);
	objs['rede'].animationSpeed = 1;
	objs['rede'].play();
	resizeAll();

	app.stage.addChild(objs['grass']);
	app.stage.addChild(objs['rede']);
	app.stage.addChild(objs['trave']);

	app.ticker.add(function() {
		console.log(objs['rede'].totalFrames, objs['rede'].currentFrame);
	});
}

function resizeAll(){
	var propW = w/16;
	var propH = h/9;

	if(propW>propH){
		w = propH * 16;
	}else if(propW<propH){
		h = propW * 9;
	}
	prop = w/16;
	for(var i in objs){
		if(typeof props[i] !== 'undefined'){
			objs[i].width = props[i][2]*prop;
			objs[i].height = (objs[i].width/props[i][0])*props[i][1];
		}
	}
	app.renderer.resize(w, h);
}

 

[ivan.popelyshev]

Its supposed to work. Make a fiddle please (jsfiddle.net), with absolute paths to your resources, and I'll debug it. Code is good but doesn't allow my telepathy to work on it. Zip-file also will do the job.

[Alekz Force]

Uploaded the files to http://gol.aeonforce.com/demo

I'm creating a fiddle now...

Original:
https://jsfiddle.net/gqn50t6x/3/

Trying to embed pixy.js inside jsfiddle and failing misarably:
https://jsfiddle.net/gqn50t6x/5/

[Alekz Force]

Found out, I tested out on my friend's computer and it worked, the problem is my computer or my browser.