search

NAVADMC / ADSM

A simulation of disease spread in livestock populations. Includes detection and containment simulation.
Other
10 stars 5 forks source link

Apply and Cancel buttons are under import buttons on production panel #957

Closed ConradSelig closed 4 years ago

ConradSelig commented 5 years ago

image.png

ConradSelig commented 5 years ago

@missyschoenbaum Trying some new formatting - how do you feel about the "Apply" and "Cancel" button placement on the following screenshots? The advantage to this formatting is that buttons are no longer fixed in scrolling frames, ie if the user has lots of listed items in a panel (like production types for example) the buttons will NEVER be overlapping the options.

I know this doesn't follow standard styling for the program, so I'm running it past you now before waiting until the next update.

image

image

image This is an interesting one, as the Scenario Description page is NOT a center or right panel, but looks like it uses the base edit buttons template file.

image Some pages (like Vaccination Global) remain unchanged, this is because they are using a different set of buttons - even though they look and act the same.

By the way, these are not the only places the buttons will have moved - any "Apply" or "Cancel" buttons from the standard button holder would be moved. This does include the "Delete Results and Apply" button, as well as the "Remove References before Deleting" and "Delete" buttons (which I've never actually seen in the program- I'm not even sure how to get them to show up - but they sure are in the code!).

If you are worried about any particular page I would be more than happy to send you a screenshot of it.

ConradSelig commented 5 years ago

Regardless of what Missy has to say about button placement, the above commit does fix an overlapping issue that I discovered while working on this ticket.

missyschoenbaum commented 5 years ago

I'm thinking we have moved these buttons around a few times, and don't recall all the reasons why. Want to check for old tickets before we do anything else? I do like the up close placement. It makes more sense to me.

ConradSelig commented 5 years ago

Likely #931, which I think was covering a similar issue. If you like the change I'll go ahead and make it so this ticket can go into testing - we can revert it if you change your mind.

missyschoenbaum commented 5 years ago

I bet the "Remove References before Deleting" was before we reworked how functions act. It now gives you delete disabled if there are references.

missyschoenbaum commented 5 years ago

Just a thought, did we have these in the other place because sometimes they are out of the vision of the user when a scroll is necessary? There would be times when even I would miss them because they were outside my immediate vision. @BryanHurst, do you recall? BUttonsoutofsight

BryanHurst commented 5 years ago

I don't recall. Ideally this fix will change the behavior us the apply and cancel buttons everywhere and this problem will go away for good.

If the screenshot above is recent and there are still missing buttons, then there are more place to look into applying this fix.

missyschoenbaum commented 5 years ago

Yes, this is recent. It was #802 that we last change the apply. You guys want to look through the history before we proceed?

missyschoenbaum commented 5 years ago

I found an image of the 2017 version, it looked like this and was a problem because long pages were hidden. OnLoad_9-21

ConradSelig commented 5 years ago

Long forms will cause the buttons to be below the screen with the current build. Are we sure that we don't want that action? We warn users to move slowly through the program to make sure that they don't miss or brush over anything they should be - it could be easy to skip over fields that are hiding below the bottom of the screen if they don't have to scroll down to the bottom to hit "Apply"

missyschoenbaum commented 5 years ago

I agree in theory, but in practice what happens is that you just don't save. I did this repeatedly, and I know exactly how things should work. Therefore, I expect new people to completely be lost on this. This is a crazy idea, but could you turn the scrollbar red or something to indicate that save hasn't happened? That might call it out a little more. What would be our options to give us a warning that something more existed?

ConradSelig commented 5 years ago

Hmmm let me think on the idea.

ConradSelig commented 5 years ago

@missyschoenbaum What do you think about this idea?

image

The "red" on the tab would show regardless of if the tab is completed or incomplete - but would only turn red if there is an unsaved changed. My only fear here is that this is still not obvious enough, perhaps we could make the single bar more of an outline on the tab? Here is a mockup screenshot I made with paint:

image

First screenshot would be fairly easy to implement, second would take significantly more time.

Red color was chosen from "ADSM/fontandcolorguide.pdf" but could be made brighter.

missyschoenbaum commented 5 years ago

Just to confirm I understand: Ondirty would cause the tab color to change to red, and is only resolved with a save? And if you just X out, then you lose your change, and lose your red tab because all changes were discarded?

ConradSelig commented 5 years ago

Think of the red tab color like the apply button on any given page - if the apply button is usable (not grayed out) then the tab color would be red. Otherwise if would be it's normal green or yellow depending on the form state.

missyschoenbaum commented 5 years ago

Could it also have hover text that says something like "Save required"? I like it.

BryanHurst commented 5 years ago

Just so it is out there, changing the scroll bar color with a CSS class is a fairly simple task if we still want to take that approach.

image

ConradSelig commented 5 years ago

I think that's doable - I'll see what I can make work

ConradSelig commented 5 years ago

@missyschoenbaum do you like the scroll bar more? We can do hover text on either.

missyschoenbaum commented 5 years ago

Wow, I love the scroll bar.

BryanHurst commented 5 years ago

Speaking of the scroll bars, I think we should make them slightly more visible site wide and put them on the right side of their panels.

missyschoenbaum commented 5 years ago

I think there was a reason Josiah put them left. Like they will conflict with links in on the right. They were odd on the left, but I'm accustom to it now.

ConradSelig commented 5 years ago

I'm assuming you want to keep them on the left then, we can still make them a little more visible by increasing width by a few pixels and darkening colors across the board. I'll get the scroll bar to go to red colors when the current form is unsaved, and I'll see about some hover text as well. Going to be a lot of CSS work!

ConradSelig commented 5 years ago

@missyschoenbaum Can I get some hover text wording?

missyschoenbaum commented 5 years ago

How about "Apply to save changes" ?

ConradSelig commented 4 years ago

Hover text does not seem possible with the way that CSS handles non-stacked elements. On the alternative, here is what I can offer:

image

@missyschoenbaum Do you like how this looks? Is this text obvious enough?

I'm pushing my changes as is - we can make small changes if we want.

missyschoenbaum commented 4 years ago

I think that is good. I need to include these items in the training as well.

missyschoenbaum commented 4 years ago

New issues done, documentation done. This one is good.