3 ms·
first problem is if you have 20 modals you want not to copy paste over and over again. Of course, but you can trivially generate the required divs in JS, and y
by Silhouette 9y ago
first problem is if you have 20 modals you want not to copy paste over and over again.
Of course, but you can trivially generate the required divs in JS, and you can easily track the number of current modals displayed and set the z-index to ensure proper stacking if necessary.
Other than that, what you put in the modal in terms of HTML content or rendering a template presumably works the same way as any other part of your UI. There's nothing magic about the fact that this particular div happens to be styled as a modal dialog.
For non basic modals you also need events to know if user accepted or dismissed the modal, you want the Escape key to also work, you want the option to allow or not closing the modal when clicking outside of it
OK, so you need two callback functions, a couple of buttons to proceed or cancel, and possibly a couple of event handlers for keyboard and mouse/touch events.
Again, you surely have something to render buttons and handle their events for your UI more generally anyway. Other than that, the only thing special about the modal is that maybe you're connecting a couple of other events to the same handler logic as the explicit cancel button.
Really, none of this is difficult, nor does it need anything like thousands of lines of code just to handle modal dialogs. You could code everything we've been talking about here from scratch in a few minutes, and you could integrate it straightforwardly with any UI library I can think of if you're already using something else to render templates or handle input events. If you already have something available that will save you those few minutes, great, go right ahead and use it, but let's not pretend this is some tricky problem that requires a lot of thought and a lot of code written by experts. It's an elementary exercise in UI design, which I'd expect any junior dev to handle easily.
- simion314 9y agoYpu also need to have the modal setup the focus correct in the first input(or the one that makes sense), usually GUI libraries have a property for tab index that specify how focus changes when you press Tab, bootstrap seems to not properly setup the focus and I had to write code to fix that. It is not impossible to write such code but I am sure the code you will write in 10 minutes will not be good enough, my point is this modal feature should be native and not have people re-invent it, Also what if you want to allow resize or move, then you get again more and more code that is reinvented each time. IMHO is the same issue as with the dropdown/select , when you need a dropdown that has icons or something that the native one is not good enough it is easy to write one yourself, soem divs, some events but this 10 minutes dropdown will have missing feature or issues, like corner cases when the popup thing goes outside the screen or conflicts with something else,or the thing that opens contains 6 and half entries and if you want to look good you need to put more work into it, then if you want support for arrow keys more work, or if you want the feature where the user presses the first letters and selection jumps down to the correct item even more code, my point is basic implementations are fast, good enough implementation like you have in Qt,Flex, WPF is a lot more work and we do not have a standard way of doing it, and the developer needs to research what library works with the current stack he uses
- Silhouette 9y agoIt is not impossible to write such code but I am sure the code you will write in 10 minutes will not be good enough Well, you keep saying that, yet putting focus on a designated element when opening the dialog is literally one line of code, and setting tab order isn't particularly difficult either (and is probably something you'd have to do in much the same way whether you wrote the code yourself or used someone else's library to create your modal). In any case, we seem to have drifted well off the original topic now. The comment by revscat was about a requirement to add a very simple modal without any of these hypothetical complications you keep introducing, and how the resulting PR involved 27 files. That's crazy.