Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Create a class to be stored in a separate javascript file, Comment that represents both the data and affordances of a comment made by a

Create a class to be stored in a separate javascript file, Comment that represents both the data and affordances of a comment made by a visitor.

Just like how our examples have been previously, make sure you have two .js files. One scripts.js that utilizes the data from Comment.js.

The class should have the following properties:

- email (not displayed)

- datePosted (Date object, created from a compatible string)

- userName (displayed)

- comment (displayed)

- author (boolean) if true, the comment should be displayed with a distinct format.

The class should also have the following methods:

- post (this will add the comment to the end of a list of comments)

- postComments (this will accept an array of comments and display them on the page. The comments must be in reverse-chronoligical order, no matter what)

A sample array of comments to be passed in to postComments is:

[{ email: "jack@ibm.com", datePosted: "2022-09-14T19:08:33.107Z", userName: "Jack", comment: "This was a great post", author: false }, { email: "jill@hotmail.com", datePosted: "2022-08-14T19:08:33.107Z", userName: "Jill", comment: "I wanted to clarify that this was written before the event", author: true }, ] 

Comments should accept a constructor with the five values passed in as parameters and create a comment accordingly.

Add a comment form that will call the post method of the comment class to add the comment to the page. You can use the HTMLFormElement submit event to record the data provided by the user.

The comment form should have fields for userName, email and comment, but the date should be generated by the current time.

Your event handler should use the comment class above to directly add the contents of the form to the DOM.

Provide all of the above in index.html with a short blog entry of your own design, index.js and comments.js. Use an array to populate the page with a set of initial comments. You do not need to add any logic or functions to the blog page itself, just the comments.

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

More Books

Students also viewed these Databases questions