Невозможно получить элементы pixi js после инициализации - PullRequest
0 голосов
/ 01 июля 2019

Мне нужна помощь в формировании этого кода, я застрял на несколько часов, кажется, не могу понять. Любая помощь будет высоко ценится.

У меня есть несколько разделов, в которых есть приложение pixi.js. Инициировал функции, как показано ниже.

var pixiFunctions = [
    function(type) {

    var pixi, sectionContainer, stage, texture, sprite, bars;

    sectionContainer = $('section[data-media="established"]');

    var established = {
        init: function() {

            pixi = new PIXI.Application({
                width: getViewport().width,
                height: getViewport().height,
                transparent: true,
                resolution: window.devicePixelRatio || 1,
                antialias: true
            });

            sectionContainer.append(pixi.view);
            stage = new PIXI.Container();
            texture = new PIXI.Texture.from(loadedMedia[1].src);
            texture.baseTexture.resource.autoplay = false;
            texture.baseTexture.resource.source.loop = 'loop';

            sprite = new PIXI.Sprite(texture);

            texture.baseTexture.on('loaded', function() {

                sprite.height = pixi.renderer.screen.height;
                sprite.width = pixi.renderer.screen.width;

                pixi.stage.addChild(sprite);
                established.start();
            });


        },

        start: function() {
            pixi.render(stage);
            requestAnimationFrame(established.start);
        },

        animateIn: function() {
            console.log('animateIN');
            **console.log(pixi)**
            sectionContainer.addClass('active');
        },

        animateOut: function() {
            console.log('animateOut');

            sectionContainer.removeClass('active');
        }
    }

    if (type === 'animateIn') established.animateIn();
    if (type === 'animateOut') established.animateOut();
    if (type === 'init') established.init();
}
]

У меня есть такие наборы функций для каждого, При загрузке DOM я вызываю эти функции следующим образом:

for (var i = 0; i < pixiFunctions.length; i++) {

    pixiFunctions[i]('init');

}

И тут возникает проблема, когда я прокручиваю, я настроил функции для запуска таким образом;

 pixiFunctions[currentPosition]('animateIn');

[currentPosition] - относится к счетчику, который увеличивается при прокрутке, чтобы я мог анимировать по разделам.

Проблема заключается в том, что всякий раз, когда я вызываю эту функцию с помощью, консоль записывается как PIXI undefined. Я понятия не имею, как с этим разобраться. Мне это нужно, потому что мне нужно взять пикси, чтобы оживить маску.

** pixiFunctionscurrentPosition; **

Спасибо всем.

...