var dragon

​

// why tf is this DEVOURING my gpu, this is such a simple shader

var PS = `precision highp float;

​

  // x,y coordinates, given from the vertex shader

  varying vec2 vTexCoord;

​

  // the canvas contents, given from filter()

  uniform sampler2D tex0;

  // other useful information from the canvas

  uniform vec2 texelSize;

  uniform vec2 canvasSize;

​

  void main() {

    // get the color at current pixel

    vec4 color = texture2D(tex0, vTexCoord);

    // set the output color

    color.r = color.r * ((vTexCoord.y * 0.5 + 0.25) - 0.9);

    color.g = color.g * ((vTexCoord.y * 0.5 + 0.25) - 0.9);

    color.b = color.b-0.9;

    gl_FragColor = vec4(color.rgb, 0.2);

  }`;

var shade;

​

var l1;

​

function preload(){

  clouds = loadImage('/clouds_pink_desampled.png')

}

​

function setup() {

  createCanvas(1200, 700, WEBGL);

  l1 = createGraphics(1200,700, WEBGL)

  shade = l1.createFilterShader(PS)

  frameRate(60)

}

​

let drawn = false

​

function draw() {

  background(6,2,15);

  // draw stars

  // draw cloud image

  image(clouds,-600,-350)

  // apply transparent gradient

  if(!drawn){

    l1.fill(6,2,15)

    l1.rect(-600,-350,1200,700)

    l1.fill(color(255,255,255))

    l1.rect(-600,-350,1200,700)

    l1.filter(shade)

    drawn = true

  }

  image(l1,-600,-350)

  // draw dragon

  // draw simulation-y stuff

}