Project details page layout

[sjDCC]

I like the look of the revised project details page, and having everything on a single save, but I've just realised that it's very easy to miss the save button. When you're configuring the guidance, the save button is off screen (you need to scroll down). I had checked a guidance box and navigated away without a notification of unsaved changes.

@jollopre had introduced an autosave for the guidance checkboxes so perhaps this is worth reintroducing? Or repositioning the save button higher up the page so it always on screen, or adding a notification of unsaved changes?

@JEK-III can you advise?

[stephaniesimms]

Good to capture this here. Button positions, refining all page layouts, etc are a later-stage task once all new features have been added so will also be addressed by UX and as part of #424.

• We also flagged the need to add the PI/Data Contact Phone No. below Email on this page.
• I think autosave was implemented throughout the site but maybe not on the project details page. @jollopre can we autosave all the things?

[sjDCC]

Hi @stephaniesimms The autosave had been added to the guidance configuration and write plan page by @jollopre but seems to have been lost on both with recent changes. I noticed as I could change tabs without any warning of unsaved changes. Autosaving throughout the site would be best in my opinion too so hopefully we can implement that

[briri]

Yes. Jose's code is still there, it stopped firing though when the HTML structure of the pages changed. Its fairly easy to add it back in.

Do we want to just make the guidance auto-save or would we like the project details themselves to auto-save? We are auto-saving changes to visibility and user permissions for plans on the share tab and the test flag on the dashboard now, so it may make sense to move everything to the auto-save mode.

[briri]

@sjDCC I've added the auto-save functionality back into the write plan page (pending a PR before I can deploy). I'm looking at dmponline-test though and can't seem to get the warning message about unsaved changes to appear. The auto-save waits a few seconds to fire, so there is a brief lag after the user makes their change when they can click on the share tab or navigate away via the menu. I have tried multiple approaches but the warning never appears.

[sjDCC]

Thanks @briri. Good to know it was there but just not firing. And thanks for reinstating it.

We used to have a warning that popped up when you moved between sections with unsaved changes but I think the autosave replaced this. That does leave a couple of seconds where you could navigate away but probably low risk.

The place I'd lost changes was on guidance configuration. Here I guess it's good to implement autosave on whole page (covering guidance config and plan details).

I agree with you that it would be best to have autosave throughout site. It's more googledocs style, which is approach we're going for long term I think anyhow

[briri]

The page is no longer auto-saving after we moved all of the JS over to ES6 and webpack. I'm going to close this one out, we should create new tickets for any pages we want to start auto-saving.