Interactive Web Pages

You have the following code excerpt to allow a user to select a file from the input element with ID "finput" and display it to a canvas with ID "can." var file = document.getElementById("finput"); var image = new SimpleImage(file); var canvas = document.getElementById("can"); image.drawTo(canvas);

A script specifying where to find the JavaScript library for SimpleImage

You have two pixels to convert to grayscale, and you would like to determine visually whether your code is likely to be working, so you work an example by hand. The first pixel is orange and has rgb(255,153,51), and the second pixel is green and has rgb(51,153,51). Once the grayscale pixels are printed, which one should appear as a lighter gray (closer to white).

First pixel

What is the purpose of initializing the global image variables to null in the green screen web page?

The code can check if the image is null before processing it.

You are building a web page, and you create a text input element and specify an element ID for it. Why did you do this?

You would like to be able to reference the input element programmatically.

You have created the following file input element: <input type="file" onchange="loadImage()" >

accept="image/*"

In which of the following code snippets does the program alert the user "x is null"?

var x = null; function myFunction() { var x = 2; } myFunction(); if (x == null) { alert("x is null"); }

You would like to display an alert message if the image variable for the foreground image fgImage is not loaded. Which two of the following expressions evaluate to true if the image is not ready?

✅fgImage.complete() ✅fgImage == null!