Explore jump to Z-index / slider feature

[RFSH]

@rastogi-bhavya please update the issue with more information. You mainly should list whatever you think works and iterate over all the pros and cons. You don’t need to fully implement any of them. just come up with different ways to achieve these. It’s a lost easier to discuss this when one of us (in case you) have gone through all the iterations and thought about different pros and cons

[rastogi-bhavya]

Jump to Z Index

1. Provide an input box to the user which will allow him to enter the desired index
2. If the index entered by the user exists, update to show that particular plane in the OSD, update the z-plane container such that the desired index is the center one in the carousel.
3. If the index does not exist use the closest index to the input, and show a pop-up (or some other UI) to indicate to the user that the index is not present in the database.

26 Jan Meeting Discussion

1. The place which shows the current z index should to be changed to an input box for the user to enter the desired index.
2. When the index is entered wait for a certain time (eg 2 sec) or enter key to be pressed and then fetch the data. A tooltip can also be added to help the user in figuring it out.

3. When an index is written 2 request would be needed to return a valid response. Eg: Current page size is 7, the index entered is 21.

   • Request one: look for 7 indexes less than or equal to 21
   • Request two: look for 7 indexes greater than or equal to 21

   Combine these 2 lists and return the response with 7 indexes center aligned around 21

2nd Feb Meeting Discussion

1. Create a Reset/Back icon, which will reset the input box to the original value that was there before the user started to edit. Use Case: initially the input box has 26, and the user edits it to 16 without pressing the enter button. When the reset/back button is pressed the text box should change back to 26.
2. The button should have a tooltip to show the user what the button will actually due.
3. No placeholder needed for the input box.
4. When the user jumps to a particular index, then change the z plane list (shown in the carousel), update the main image in the OSD to z index which the user entered or to the one that was closest to the input.

[rastogi-bhavya]

Slider Feature

From the carousels that I have seen, slider is only possible when the carousel is free flowing and not paginated.

One way to implement a slider would be to have a slider to select the index

|--|--|--|--|--|--|--|--|--|

Each of the | would mark an index and dragging the slider would jump to that particular index (having the same UI behavior as the Jump to Z Index).

To implement this a list of indexes would be needed before hand so that they could be mapped. https://www.w3schools.com/howto/howto_js_rangeslider.asp