Мне нужна помощь в формировании этого кода, я застрял на несколько часов, кажется, не могу понять. Любая помощь будет высоко ценится.
У меня есть несколько разделов, в которых есть приложение 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; **
Спасибо всем.