Render JS

[ccasalme]

What is Render.js?

Have attached the foundation of the Render.JS file but will comment it out for now || This will be the next patch

• When we input the data, we have to manually refresh the page in order for the data to display on the webpage
• The purpose of having the render.js is to have the data to automatically display

Possible steps that need to be taken to implement the render. js:

- Refine render.js for Initial Render

Ensure render.js is correctly calling displayMovies during page load. Update render.js

- Trigger Render on Local Storage Update

The storage event only fires when localStorage is updated from another tab or window. If you’re updating it in the same tab, this event won’t trigger. I.e. Ensure that render.js can handle updates within the same tab!

- Hook Manual Trigger into display.js

When you update localStorage in your app (e.g., in the modal submission), you need to manually dispatch the manual update event to trigger re-rendering.

We can update the form submission logic in modal.js.

I have commented from line 81 of what needs to be done.

- Expected Flow

1. When the form is submitted, userDataArray is updated in local Storage
2. A manualUpdate event is dispatched
3. rendre.js listens for manualUpdate and calls reRenderMovies()
4. reRenderMovies() invokes displayMovies(), updating the UI dynamically 💪

[ccasalme]

Render.js File commented out for now

I have commented it out for now since we want the website to be fully functioning and running today. We can uncomment these codes after testing and ensuring that there are no other bugs.

P.S. I didn't catch any bugs when I tested it on my end so far but I'm not sure how it will behave on other people's devices yet

[ccasalme]

window.location.reload();

//Reload the page to display the new movie without refreshing the page //may not need the render.js file (Cyrl's & Corey's note) //Leave the render file just in case we need it and the data grows //Limitation: we have not tested it yet with larger data sets

@cpars @ArtOfTheNiles