// run as fast as possible for smooth lines
frameRate(0);

var draw = function() {
    // draw the "computer screen" outline
    noFill(); // don't want a colored inside to the screen, it'll overwrite drawings
    stroke(0, 0, 0);
    strokeWeight(1);
    rect(50, 50, 300, 300);
    
    // this equals true if the mouse is in the rectangle
    // and false if it's outside of the rectangle
    var mouseIsOnScreen = (mouseX > 50) && (mouseX < 350) && (mouseY > 50) && (mouseY < 350);
    
    // this does the same as the above line, but
    // with the mouse's coordinates from the last frame
    var mouseWasOnScreen = (pmouseX > 50) && (pmouseX < 350) && (pmouseY > 50) && (pmouseY < 350);
    
    // draw the line if the mouse is pressed and in the rectangle
    if(mouseIsPressed && mouseIsOnScreen && mouseWasOnScreen) {
        // set to thin black line
        strokeWeight(1);
        stroke(0, 0, 0);
        
        // if 'e' is pressed have a thick white line
        if(keyIsPressed && key.toString() === 'e') {
            strokeWeight(5);
            stroke(255, 255, 255);
        }
        
        // draw the line
        line(pmouseX, pmouseY, mouseX, mouseY);
    }
};