Lighting Shader Misaligned

by roomyrooms

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/5.2.2/pixi.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pixi-filters@latest/dist/pixi-filters.js"></script>
<script type="x-data-url" id="tree-url">
 ...

JavaScript

var treeUrl = document.getElementById('tree-url').textContent;
var treeImg = document.getElementById('tree-preview');
var lightUrl = document.getElementById('light-url').textContent;
var lightImg = document.getElementById('light-preview');

treeImg.src = treeUrl;
lightImg.src = lightUrl;

var fragmentShader = `
precision mediump float;

varying vec2 vTextureCoord;

uniform sampler2D uSampler;
uniform highp vec4 inputSize;
uniform highp vec4 outputFrame;

uniform vec2 lightPoints[256];
uniform float time;

void main() {
  vec2 f = vTextureCoord;
  vec4 darkcol = texture2D(uSampler, vTextureCoord.xy);
  vec4 lightcol = vec4(0.0);
  
  float lightintensity = 0.05;
  float lightfade = 1.0;
  float lightradius = 256.*(sin(time*0.001)*0.5+0.5);
  vec2 lightgradient = vec2(0.3,0.7);
  vec3 lighttint = vec3(0.7,0.35,0.05);
  
  for (int i = 0; i < 16; i++) {
		if (lightPoints[i] != vec2(-1)) {
    	float ogdist = distance(gl_FragCoord.xy, vec2(lightPoints[i].x, lightPoints[i].y));
      float adjdist = smoothstep(lightgradient.x,lightgradient.y,ogdist/lightradius);
  		lightcol.rgb += lighttint*(vec3(1.0-adjdist)) * lightintensity;
  		lightcol.a += (1.0-adjdist) * lightfade;
    }
  }
  vec4 newcol = vec4(mix(darkcol.rgb,lightcol.rgb,lightcol.a), darkcol.a-lightcol.a);
  gl_FragColor = newcol;
}`

function defaultValue(inputValue, defaultValue) {
    inputValue = typeof inputValue !== 'undefined' ? inputValue : defaultValue;
    return inputValue;
}


function LightFilter(lightPoints) {
    PIXI.Filter.call(this,undefined,fragmentShader);
    this.uniforms.time = performance.now()
    this.uniforms.lightPoints = new Float32Array(lightPoints)
}

LightFilter.prototype = Object.create(PIXI.Filter.prototype);
LightFilter.prototype.constructor = LightFilter;

LightFilter.prototype.apply = function (filterManager, input, output, clear) {
		clear = PIXI.CLEAR_MODES;
    this.uniforms.time = performance.now();
    // draw the filter...
    filterManager.applyFilter(this, input,...