0914 Computer Drawing Class

// hell world 

// font size, style, type, alignment, color 

// message = "hello world" 

// postion of the message 

// background color 

// screen / canvas = resolution, resolution (w x h) in pixel 

// pixel has a color and position 

​

// set intial variables 

let x = 200

let y = 200

let vx = 1

let vy = 1

let col = [0, 0, 0, 25]

let pen = [255, 255, 255]

​

function setup() {

​

  createCanvas(800, 400) // pixels

  background(col) // 'red', (255,0,0), '#ff0000'

​

}

​

function draw() {

  noStroke()

  fill(col, 1)

  rect(0, 0, width, height)

​

  // fill('yellow')

  // textSize(32)

  // textAlign(CENTER, CENTER)

  // text('Hello World', x, y)

​

  strokeWeight(3)

  stroke(pen)

  line(x, y, mouseX, mouseY)

  line(x, y, 0, 0)

  line(x, y, width, height)

  line(mouseX, mouseY, 0, height)

  line(mouseX, mouseY, width, 0)

  line(x, y, width, 0)

​

  fill(pen)

  // ellipse(mouseX,mouseY,50,50) 

      fill('red')

  noStroke()

  rect(mouseX,mouseY,x/5+25,y/5+10)

    fill(pen)

  rect(mouseX,mouseY,x/5,y/5)

​

  x = x + vx

  y = y + vy

​

  // set conditions 

​

  if (x < 0) {

    // x = 0

    vx *= -1

  }

​

  if (x > width) {

    // x = 0

    vx *= -1

  }

​

  if (y < 0) {

    vy *= -1.1

  }

​

  if (y > height) {

    vy *= -1.1

  }

​

}

​

function mousePressed() {

​

  save() // downloads an image 

  col = [random(255), random(255), random(255), 25]

  pen = [random(255), random(255), random(255)]

  background(col)

  x = random(width)

  y = random(height)

  vx = random(-1, 1)

  vy = random(-1, 1)

​

​

}