NTX-McGill / NeuroTechX-McGill-2021

Other
16 stars 5 forks source link

Software (Frontend): Create a new page for inference #109

Open mlej8 opened 2 years ago

mlej8 commented 2 years ago

On the inference page, there will be the following three components:

  1. Textbox showing all the predicted characters we have up to now (it should be a sentence/string stored in a state of the component)
  2. Make 3 textboxes showing the 3 suggestions from the suggestions given to us by the ml team's model (this will be sent to you by the backend) and you'll need to store these 3 suggestions in the frontend in the "suggestions" component.
  3. Flash the keys for 1 second, then 1 second shifting period, etc. (alternating until infinity). The flow should be flash keys for 1 sec, have a shifting period of 1 sec (no flashing and repeat the cycle.
  4. Include a pause button when in shifting mode similar to what @TheMatrixMaster has implemented for the DCP.

also, provide a way to toggle between collection and inference pages

TheMatrixMaster commented 2 years ago
Screen Shot 2022-03-23 at 11 17 04 PM

@HassanKanj16, I'm working on the UI on this branch: https://github.com/NTX-McGill/NeuroTechX-McGill-2021/tree/feature/inference

There is no logic in terms of the flashing or the api calls yet. I figured that if you're working on api, then it might make more sense for you to figure out the flashing logic too. I'm basically using dummy data right now and I've made an inference screen component.

mlej8 commented 2 years ago

Nice work @TheMatrixMaster Some feedback:

  1. can we hide the collector name textbox on the inference page
  2. Can we have the textbox displaying the sentence we have so far above the keyboard in a horizontal textbox?
  3. Same thing for the 3 suggestions, it'd be better to have them above the keyboard.

The layout of the page would be

  1. The sentence we have so far
  2. Autosuggestions
  3. Keyboard