CS4640 - WebPL

POTD 2: Get started with JS

Due 27-May-2022, 1pm EST (no late submission, no extension)

Purpose: Introducing and Hands-on experience with JavaScript; get ready to work on homework assignment

For this activity, you may work alone, with your project partner(s), or with another student in this class. Write JavaScript code to solve the following problems.

To run your program, you may:

Use a web browser's console. For example, in Chrome — for Mac users, press command+option+J; for Windows users, press Ctrl+shift+J. Enter your code in the console, then press Enter key to run.
Use JavaScript visualizer. Enter your code in the editor, then press either Visualize Execution button or Live Programming Mode button. You may choose to run the entire code or run a step-by-step execution using Previous and Next buttons.
Create an HTML file or use a template, embed your JavaScript in the HTML file (directly in the document or as an external file).
You may simply allow the script to be executed as the HTML page is loaded. Open the browser's console to see the result.

Alternatively, you may write HTML code to call the JavaScript function; you may need to modify your JavaScript such that the results are written as part of the HTML document.

Problem #1: Simple Grid

Use simplegrid.js, complete at least one of the functions: isDiagonal, isEdge, or isMiddleRow.

Imagine that the user specifies the width of a grid, as well as a tile. Complete the isDiagonal function to return either "diagonal" or "not diagonal" depending on whether or not the tile is along the diagonal of the square grid. For example, on a 7x7 grid, assuming the tile numbers (starting at the top-left corner) are 1, 2, 3, ..., 49

1	2	3	4	5	6	7
8
15
22	23	24	25	26	27	28
29	30
36
43

all yellow tiles are on the diagonal.

You may use the following formulas in your program as needed:

var row = Math.floor((tile-1)/width);   // Math.floor returns the largest integer less than or equal to a given number
var col = (tile-1) % width;             // %  returns the remainder of the division

Imagine that the user specifies the width and height of a grid, as well as a tile. Complete the isEdge function to return either "edge" or "not edge" depending on whether or not the tile is along the edge of grid. For example, on a 7x8 grid, assuming the tile numbers (starting at the top-left corner) are 1, 2, 3, ..., 56

1	2	3	4	5	6	7
8
15
22	23	24	25	26	27	28
29	30
36
43
50

all yellow tiles are on the edge.

You may use the following formulas in your program as needed:

var row = Math.floor((tile-1)/width);   // Math.floor returns the largest integer less than or equal to a given number
var col = (tile-1) % width;             // %  returns the remainder of the division

Imagine that the user specifies the width and height of a grid, as well as a tile. Complete the isMiddleRow function to return either "middle row" or "no" depending on whether or not the tile is along the middle row(s) of the grid. For example, on a 7x8 grid, assuming the tile numbers (starting at the top-left corner) are 1, 2, 3, ..., 56

1	2	3	4	5	6	7
8
15
22	23	24	25	26	27	28
29	30
36
43
50

all yellow tiles are on the edge.

You may use the following formulas in your program as needed:

var row = Math.floor((tile-1)/width);   // Math.floor returns the largest integer less than or equal to a given number
var col = (tile-1) % width;             // %  returns the remainder of the division

Problem #2: Array and Loop

Use array-loop.js, complete at least one of the functions: sumList, findLast, or sum2D.

Complete the sumList function that takes a non-empty list of integers, and then returns the sum of all elements in the list.
Complete the findLast function that takes a non-empty list of integers, and then returns the position of the last occurrence of the largest element.
Complete the sum2D function that takes a non-empty, square, two-dimentional array of integers, and then returns the sum of all the elements in the array.

Grading rubric

[Total: 10 points]: Done (or provide evidence of your attempt, full or reasonable effort)

(5 points) — Providing evidence of your attempt, minimal effort
(0 point) — No evidence of your attempt

Submission

Log in to Collab, then upload all your files (.html and .js) to POTD 2 on Gradescope.
Make sure you connect your partner(s) to your group on Gradescope so that everyone receives credit
Each team submits only one copy

Making your submission available to instructor and course staff is your responsibility; if we cannot access or open your file, you will not get credit. Be sure to test access to your file before the due date.