I apologize for my directness but the newly implemented 'Create table' Dialog has an awful usability. Especially once you've added 2 more columns. The idea of AJAXifying pma is to increase the usability, but with a small dialog where I have to scroll horizontally and vertically several time to create the table, it will take me way way longer compared to the old create-table interface.
I don't know if its just me, but I see so many things gone wrong with this dialog.
Some things I would change globally (taking the create table dialog as example) : - Decrease the massive amounts of padding/margin of the jquery ui dialogs. - I don't need a 40 pixel high title telling me that I'm currently creating a table. - Did you notice that there's is a 900 x 60 pixel (!) area that only performs a single function: Containing the cancel button. This should be either drastically reduced in size or removed altogether (and put the cancel button inside the content) - Decrease those massive margins and paddings around input fields. Those should be made big only where it actually improves the usability/readability. I would reduce the margin/padding from 6/4 to 2/2
And for the create table dialog: - Display always in horizontal mode! Hardly any tables contain just 2 columns. - Start always with 4 fields - Bug: You can actually open the dialog several times, cause the enum/set editor to be in the background - Make all selects and text inputs way shorter. I'd reduce them by ~30% (selects as well!). The length/value field I would reduce by 50-70% or so. - The null and A_I checkbox waste big amounts of space. I would put them together in the form of " [ ] Null [ ] A_I " in a column called "Options" - Remove the "Table name:" title, instead put 'Table name' into the input field that disappears once the user focuses it - Instead of "Add x tables [Go]" which does it's own ajax request I would place a link "Add column" that adds one single column, but therefore adds it immediately (no ajax here!), allowing users to just spam click the link if they need a lot. Or alternatively use a select list that contains the numbers from 1 to 10 which adds columns immediately on the onchange event. - Display the input field for the default value only after "As defined:" is selected, and also focus it automatically once its selected so the user can type immediately - Why do we have these footnotes at the bottom of the dialog when we got PMA_showHint()? (Forgot to initialize them in js?) - For all the form fields below the columns: Remove all the gradient backgrounds on the titles. What are they there for? - In whatever way, put the Save and Cancel button side by side
- The enum/set editor I find so bad, I don't even know how you could improve that: - If my table would be having 3 enums, I get 3 times this sentenced thrown onto my screen causing the columns table to get even bigger. - The dialog itself has a completely different style than everything else in PMA and really badly implemented. Just some bugs: - Values for column "" - wheres the column name? - Why is "Go" a button and "Cancel" a link? - Single quotes are not escaped (put a ' into the value field) - Breaks if a user accidently enters a space - The background is grayed out, yet you can still interact with it (e.g. select text) - You can actually scroll away the content of the dialog by selecting text downwards - Visual bug: One can see all input fields disappear if you press ok/cancel
- Why not just a simple textfield where you let the user write one value per line? I would build the enum/set like this: - if set/enum is selected and the user focuses on the input field, pop out a bigger textarea (that is placed like a datepicker) - let the user write one element per line - extend the textarea row height with every line written so the user doesn't have to scroll. (up to a certain limit of course, like 15-20 lines - also it should not force the to scroll the page) - with every line written or on lost focus, automatically parse the text and update the value field correctly formatted
Now lets say my enum has 5 elements. With the current enum/set editor that would require me to perform 13 mouse clicks and 5 interruptions (where my hands need to switch between mouse and keyboard), whereas with a textarea that pops up like a datepicker requires 2 mouse clicks and 0 interruptions. Why build things so complicated? ;-)
Sorry again if I sounded too unpolite :<