PART 1

Create a function to calculate the positioning and width of meetings on a calendar for a single day (9 AM to
9 PM). Assume each minute on the calendar to have a height of 2px(Total height = 1440px). The width
should be 600px.
- If there is one meeting between 11.30 and 12, show the meeting at the appropriate time, with a width of
600px.
- If there is more than one event, then the entire width should be split accordingly. (2 events of 300px
each).
The input to the function will be an array of meeting objects with the time of the beginning and end
specified in minutes after 9 AM. For example,
[{
id : 123, start : 120, end : 150
}]
specifies a meeting starting at 11 AM and ending at 11.30 AM.
Return the array of the meetings with the width of each meeting, as well as the CSS attributes for its
position. (top and left)
PART 2
Build a webpage that uses the function from PART 1, to show the following meetings -
[
{ id: "New", start: 60, end: 120 },
{ id: "New 1", start: 150, end: 270 },
{ id: "New 2", start: 240, end: 300 },
{ id: "New 3", start: 200, end: 360 },
{ id: "New 4", start: 180, end: 330 },
]

Should have output like(please goto next page for the image):
PART 3

• Add new meeting, and All meetings should be aligned accordingly.

• Extensibility of the function.