Improve UX of visibility setting dialog on registration page

[dcavins]

When a user is changing the visibility setting for profile fields while registering (and while editing a profile), the interface doesn't offer consistent feedback.

First, if a user opens the visibility settings dialog and changes to a different privacy level, upon closing the dialog, the privacy level text isn't updated to show that the user has made a change. Second, if a user fails to successfully register (if the passwords don't match, or she doesn't fill in a required field), the form 'loses' the user's choices upon reload.

I've attached a patch that adds to buddypress.js to update the privacy level text upon closing the dialog and changes the functions bp_get_the_profile_field_visibility_level and bp_get_the_profile_field_visibility_level_label in bp-xprofile-template to respect privacy levels stored in _POST rather than resetting to defaults on the registration page.

Thanks for all the 1.7 goodness!

-David

[dcavins]

Profile Field Vis Dialog

[boonebgorges]

Thanks for the patch, dcavins. If we're going to introduce the change - so that visibility changes are reflected in the help text even before the page is saved - then I would also like to add one of those "Are you sure you want to leave this page with unsaved changes?" bits of JS. I don't know off the top of my head how to do this, but I think it's crucial so that we don't give the impression that this stuff is updated via ajax.

[dcavins]

That's a good point. I've attached a new patch that adds functionality like that to the profile edit form. The user confirmation dialog is based on this document: ​https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload

The logic I used was:
If the user changes any input on the form (other than submit), then the window.onbeforeunload function is active, preventing the user from navigating away. However, if the user attempts to "leave" the page by clicking submit, window.onbeforeunload doesn't return anything, so the action is allowed.

I think it could be tidier, but it does work as I expect.

[dcavins]

Revision of patch, includes leaving form confirmation dialog

[dcavins]

Cleanup of jQuery traversal, added confirmation dialog when leaving registration page

[dcavins]

I revisited this code and cleaned up a couple of things. The confirmation dialog challenges the user if he tries to leave an incomplete registration form or unsaved profile edit form.

Is there a preferred BP/WP method for making strings in javascript translatable?

[boonebgorges]

In 7150:

Populate registration field visibility settings from $_POST, if available

By giving preference to values in the $_POST global when populating the profile
field visibility settings on the registration page, we ensure that users who
modify those values and then submit a failed registration do not have to
reenter the values after the page reloads.

See #4958

Props dcavins

[boonebgorges]

In 7151:

Prompt user before leaving profile edit mode if changes have not been saved

See #4958

Props dcavins

[boonebgorges]

In 7152:

Change field visibility gloss when setting has been changed in profile edit mode

This is a less confusing UX for users who are changing the visibility levels
of their profile fields.

Fixes #4958

Props dcavins

[boonebgorges]

Excellent patch - thanks so much, dcavins.

You can see in r7151 how I did the localization for the JS string. (wp_localize_script())