// Daniel Shiffman

// http://natureofcode.com

​

// Smoke Particle System

​

// A basic smoke effect using a particle system

// Each particle is rendered as an alpha masked image

​

let emitter;

let img;

​

function preload() {

  img = loadImage("data/texture.png");

}

​

function setup() {

  createCanvas(320, 240);

  emitter = new Emitter(width / 2, height - 40);

}

​

function draw() {

  // Try additive blending!

  // You also need clear or else the colors will accumulate between frames

  // blendMode(ADD);

  // clear();

​

  background(0);

​

  //{!2} Wind force direction based on mouseX.

  let dx = map(mouseX, 0, width, -0.2, 0.2);

  let wind = createVector(dx, 0);

  emitter.applyForce(wind);

  emitter.run();

  emitter.addParticle();

​

  // Draw an arrow representing the wind force

  drawVector(wind, createVector(width / 2, 50, 0), 500);

}

​

// Renders a vector object 'v' as an arrow and a position 'loc'

function drawVector(v, pos, scayl) {

  push();

  let arrowsize = 4;

  // Translate to position to render vector

  translate(pos.x, pos.y);

  stroke(255);

  // Call vector heading function to get direction (note that pointing up is a heading of 0) and rotate

  rotate(v.heading());

  // Calculate length of vector & scale it to be bigger or smaller if necessary

  let len = v.mag() * scayl;

  // Draw three lines to make an arrow (draw pointing up since we've rotate to the proper direction)

  line(0, 0, len, 0);

  line(len, 0, len - arrowsize, +arrowsize / 2);

  line(len, 0, len - arrowsize, -arrowsize / 2);

  pop();

}

​