Update to Navbar - Member Info and Avatars

Hey,

I moved the user information in the top right on the navbar to side panel and replace it with a clickable avatar image. If you have an avatar, you will see your avatar and if you don't you will see some default one (will change it to something better later).

If you have any notification (like a private message) your avatar will blink slowly to let you know. If you do not have any notifications, it will not blink.

I'm still testing it; so please let me know your thoughts.

If the blinking avatar is annoying (when you have messages unread in your inbox), please suggest something less annoying; maybe adding a color border to the image? or changing the image opacity? or maybe changing the avatar to something else like a notification looking avatar? or put some little badge overlay on the avatar image?

It's all up in the air for discussion and design changes.

Thanks.

2 Likes

I like the improvements you're making!

I don't mind the blinking avatar, but a possible alternative would be to have icons appear that could be clicked on directly when alerts occur. For example a mailbox could appear next to the avatar (either always be there and have a flag rise on the icon if unread mail is present or just have a mailbox icon appear with a raised flag if unread mail is present) and a grayed out mailbox with a raised flag could appear if "new" or "recent" hidden messages are present.

It would also be nice if "new" or "recent" hidden messages could be changed to "unread" hidden messages such that the notification only disappear when new hidden messages have all be read (and would only disappear when new hidden messages have been read instead of never getting any notice if you miss logging in for a few hours).

As a personal preference, it would also be nice if the Bits displayed would include not only the total, but also the Bits in Checking and the Bits in Savings in the list you see when you click on your avatar.

PS. It appears that having "new" or "recent" hidden messages does not cause my avatar to blink? Is that because I was the author of the last hidden message; or is there no visible notice anymore that there are "new" or "recent" hidden messages unless I happen to click on my avatar?

1 Like

Hi Neo...

As you know I usually view signed out, as an outsider the first screen in both Safari and Firefox is this and the top left hand close 'X' does not work...
See image...

1 Like

Thanks. Fixed. Please confirm.

1 Like

Good idea. Thanks.

Good idea. thanks again.

OK. will look into this.

Yes, there is some small issue with how that plugin is written which I need to change to get the confidential message notification to work. It's on my list to do.

OK, I have this mostly working I think.

But I still need to "Mark Forums Read" to turn off the notifications (blinking icons) for this hidden messages.

Please confirm, thanks.

1 Like

I can confirm that having one or more "new" confidential posts causes my avatar to blink :slight_smile: and that reading the "new" confidential posts does not cause my avatar to stop blinking. :frowning:

I also note that if I click on where my avatar was after it blinks out, it is a no-op. I can only click on my avatar when it is visible to turn on or turn off the blue status region on the left side of the window. I'm not sure if this is a bug or a feature, but it is annoying to click on my avatar just as it is disappearing and have to wait to try again when it reappears. :wink:

Yes, after reading the "new confidential posts" you have to select Mark Forums Read to reset the notifications to zero (stop blinking).

Regarding blinking in general, I plan to make this go aways soon (no more blinking at all) and replace with little badges on the avatar image, like little circles or boxes with the number of unread PMS or unread confidential posts in the little circles or boxes.

I just need to download the new libs, and I think I will do this with Bootstrap and a little bit of CSS and JS code.

2 Likes

OK Don,

I have got the PM part basically done, where instead of a blinking avatar, there is a blinking red badge with the number of PMs unread in the center.

LOL

What should we do about unread confidential posts? Add another badge? Alternate them? Or just add another badge in another corner? Use one badge and just change colors? Or just change the blinking rate when there are unread confidential posts? Not sure how to proceed with badge notifications for CPs (confidential posts).

What do you think?

I like the badge with a number, be it for PM or CP; why not for new posts?
It's a bit difficult to scroll down to the bottom to click "Mark Forums read" - mayhap a click on the avatar could suffice.
The line spacing is a bit generous now, making contents drop beyond the bottom, and some lines and boxes I was used to have disappeared. I will accustom myself...

1 Like

I agree it needs something better to clear this. I am not sure why it does not clear after reading the posts, but I'll put it the TODO list. Thanks.

I'm trying to get rid of the very congested areas with so many unnecessary lines. If you have particular area you are not happy with, please post a screen shot with comments on that screen shot. Thanks.

It's a very big site with 100s of thousands of lines of code, so I need a bit more specific comments to address them. Thanks!!!

In a few areas, the lines have disappeared, but that may be because I moved some CSS out of the pages to be loaded via a link. Somewhere along the way, some lines got lots, and I'll try moving that CSS back onto the main code area and see if that fixes the problem... but on the other hand, I like less lines and grids, but it was by accident, LOL

Update, I found the code which caused the line spacing where it should not be:

td{ padding:10px;}

Which I added to a single table in a forum view template, but it seems to apply that TD CSS "across-the-board" so I've nixed it until I find a better way. :slight_smile:

OK, I think this is close to OK for now.

There is blue badge when there are new confidential posts with the number of posts inside. I added a "Mark Forums Read" item in the new member panel to clear these since they do not immediately clear after a post is read. I will think about how best to fix this later.

There is a slow blinking red badge when there are new PMs in your inbox with the unread number inside, and it will clear when the PMs are read and the page reloaded.

Cheers.

2 Likes

I reverted this CSS file back to "the old way" and it seems to work better; still some lines are missing, but I'm OK with that for now.

Yes, all present and correct...

OK. I know why some lines are missing, etc.

For badges and other new features, I am using the Bootstrap CSS file and that file resets certain CSS elements with Reboot, including the <fieldset> elements used here.

Ref: Reboot * Bootstrap

I think this is OK since we will get rid of tables and change other elements over time to be more responsive.

Update: Confirmed. It is Reboot used by Bootstrap which resets the lines in the forum. I will leave it without all the lines, as it looks better without so many horizontal lines all over the place. There is only a few issues where it should have lines, but I plan to remove that code and replace with div elements so, let it be for now.

Actually, I'm not that happy with the looks of this when there are both unread PMs and CMs. Too many badges on the avatar, it seems. What do you think?

I'm happy with it. It's temporary, once you've read the PM / CM it disappears. Please don't have it blink, esp. with a zero value (as it does right now).

1 Like

Fixed regex typo .... does not blink with a zero value anymore.

Neo -

In mozilla (61.0.1):
Clicking on the avatar produces a nice blue display with:

rivate Messages: Total 57 Unread 0

Because the text position seems to be left shifted a few character positions

Screenshot?

Thanks.