Search the Community
Showing results for tags 'Twistfilter'.
-
Hi all, Im trying to get my Twistfilter offset to follow my mouseposition across the screen on mouseDown... been at this all day, poured over the documentation and tried multiple ways... no luck.. any help would be greatly appreciated. So far I have this: // sets up the screen/stage var viewWidth = 1000; var viewHeight = 500; var renderer = PIXI.autoDetectRenderer(viewWidth, viewHeight);renderer.view.className = "rendererView";document.body.appendChild(renderer.view);var stage = new PIXI.Stage(0xffffff, interactive);var interactive = true;//adds the flag as a spritevar flagTexture = PIXI.Texture.fromImage("img/flag3.jpg");var flagSprite = new PIXI.Sprite(flagTexture);stage.addChild(flagSprite);// creates a wavy texture over the flagvar waveDisplacementTexture = PIXI.Texture.fromImage("img/displacementMap.jpg");var displacementFilter = new PIXI.DisplacementFilter(waveDisplacementTexture);var DotScreenFilter = new PIXI.DotScreenFilter();// configures the filters..displacementFilter.scale.x = 30;displacementFilter.scale.y = 20;// apply the filters to the stagestage.filters = [displacementFilter, DotScreenFilter];var tick = 0;requestAnimationFrame(animate);function animate(){tick += 0.4;displacementFilter.offset.x = displacementFilter.offset.y =tick*10;renderer.render(stage);requestAnimationFrame( animate );} // Mouse interactionstage.mousemove = function(mouseData){ //console.log("MOUSE MOVE!");var localCoordsPosition = mouseData.getLocalPosition(stage);console.log(localCoordsPosition);}stage.mousedown = function(mouseData){ console.log("down");displacementFilter.scale.x = 50;displacementFilter.scale.y = 50;var twister = new PIXI.TwistFilter ();var localCoordsPosition = mouseData.getLocalPosition(stage);twister.offset.x = localCoordsPosition.x;twister.offset.y = localCoordsPosition.y;stage.filters = [twister, displacementFilter];}