maklad42 / number-plates Goto Github PK

Better to use Event delegation and bubbling to reduce the number of event listeners and improve performance of the page.

When a number is added, add a function to reload the current page to show the added number.

For mobile devices, add css to stack the blocks of each 1,000 numbers on top of each other.
Can possibly be combined with #1

Add a floating div that moves between the current and selected page number as they are clicked.

Add code to display a pop up when a number's pane is hovered over.
The pane should show the number, whether it is input (found) yet, or not.

When a number is added to the database, add a css animation to make the cell expand and change color briefly when the page is reloaded.

This can probably be achieved with a class ("new") etc added, and then used to target the cell with js or possibly just css.

Create a history.json file to store info on when the number was added, and when it is duplicated.

Add a text parsing script to read a list of spotted numbers from a text file and add them to the database.

Log the entries by date. Also, include duplicates.

Style the matrix so that it expands and contracts with the viewport size.

Set row and columns to 10, with align-items as stretch. Gap of 2px.

Add a message area to return the result of an input number plate.

Show green message for successful addition of new number plate.
Show red message for duplicate number plate.

Add a submit button to the input form.
Create the POST script to add the new number to the list and return a message

• Added xxxx to the database
• xxxx already in the database

Enable speech input for the plate numbers.
Also want to have the form submitted by a voice command.

Add a div to display the total number of plates still to be found, and the number in the current one thousand still to be found.

Get the first 1,000 entries from the list and display them.
Create pagination tab to load another 1,000 at a time.