yvesgurcan/web-midi-player

Allow users to add their own MIDI files to the React example by storing them in localStorage

yvesgurcan opened this issue · 0 comments

Acceptance criteria:

  • Once the code is in production, the changes will be visible at https://midi.yvesgurcan.com/example/react/.
  • A simple form should be visible at the bottom of the list of MIDI files preloaded in the example. The form will have 3 components:
    • A text input field with a placeholder that reads "Enter the URL of a MIDI file." This field only accepts valid URLs such as "https://adomain.com/thefile.mid".
    • Another text input field with a placeholder that reads "Enter a name for your MIDI." This field does not accept more than 60 characters.
    • A button labeled "Add MIDI".
  • When clicking "Add MIDI", the application will store the file in localStorage. If the operation was successful, the name of the MIDI will appear in the list of MIDI files that can be played. If an error occurred, the name of the MIDI will not appear in the list and a message reading "Could not add MIDI file." displays.