server : (web UI) Add back sampler settings

[MaggotHATE]

• I have read the contributing guidelines
• Self-reported review complexity:
  • Low
  • Medium
  • High

This PR adds samplers and penalties back into new server UI - I'm taking small iterative steps with this since I'm not familiar with vue yet. I've divided them into two "sections" for better distinction.

[slaren]

It's good to add more sampler options, but IMO this UI should focus strictly on usability. As it is, a list of options without any explanation is not much better than the "custom JSON config" field.

[MaggotHATE]

not much better than the "custom JSON config" field

It's already better by not having to print or copy-paste "xtc_probability" manually XD
In general, this simplifies organizing payload from this UI, considering that it is the main server UI now - and it's hidden enough to not distract when not needed.

As it is, a list of options without any explanation

If I were to add "tooltips" for samplers, should I also consider mobile use (i.e. vertical orientation/aspect ratios)?

[MaggotHATE]

@slaren @ngxson
I've added simple tooltip buttons to parameters; the information itself can be adjusted easily later, but this way it should be accessible both from mouse and touch input. Will also look into fixing stretching input fields back. Should be fixed.

[MaggotHATE]

Thank you for fixing the name, forgot to change it.

The only thing that bugs me here is the scrollbar. It appears that there's no universal way to change it (and it's not a built-in element, like in ImgUi). Is it possible to shift settings content in order to always reserve a space for the scrollbar?

[ngxson]

I pushed some changes:

• Input field is not wrapped inside a component (prevent too many repetitions in the code)
• Help message now show on hover, so no modal is needed:
  
• Re-group settings to top-level collapse sections:
  

Can you test it once more time to confirm that it's still working correctly @MaggotHATE ? Then I think it's good to merge. Thank you.

[MaggotHATE]

Can you test it once more time to confirm that it's still working correctly

@ngxson looks like everything works correctly, thank you!

Would tooltips work on mobile though? So far this UI is compatible with touch, even though it's not the main focus for now. It was the only reason I went with modals.

[ngxson]

I haven't tested, but because the tooltip is implemented using dropdown component from daisyui, it should be toggle it by touch too.

tailwindcss make it quite easy to make responsive UI though, so normally I don't have to worry too much about that. We can fix responsiveness in the future if users really need it.

[ngxson]

Side note, I'm not very confident that the settings are being categorized in a correct manner (i.e. DRY should be re-grouped to its own section?)

Not a big issue though, suggestion are welcomed for that part.

[MaggotHATE]

Previous versions of server UI didn't have any such grouping, only "More options/Further options", I think it's good for now because it serves the purpose and looks uniform with the rest of UI. Given the limited space (it's probably not a good idea to have a looooong settings menu from the beginning) we might have to introduce smaller UI elements with more densely packed information in them (like more granular grouping).