Top Bar for Chat Rooms

Question

As of 1.12, thanks entirely to Shog9's efforts, this now works on Firefox as well as Chrome!

Description:

Provides a fully functional top bar, including realtime notifications, easy chat server switching, and fast room list searching, at the top of all chat rooms. Keep tabs on your inbox and site activity while chatting.

Can also match the chat room's theme:

And now contains a fancy room finder dropdown, with an optional compact layout.

---

Download:

• Github
• Github raw

Features:

• Fully functional with dropdowns and realtime notifications.
• Topbar background can match chat room theme.
• Adds a dropdown that lets you search for rooms directly (with optional search-as-you-type support and the ability to open rooms in the same tab or a new one).

• Adds chat server links to SE dropdown (click server name to open in new window, click "switch" to open in same window), with optional auto-rejoin favorite rooms. Makes using multiple chat servers convenient:

  

• Does not require additional authentication or access tokens.

• To configure settings, click the "topbar" link in the footer:

  

Console Usage:

Some options are settable through the console via the ChatTopBar object. All options set will be saved. The following console commands are available:

• ChatTopBar.setWiden(boolean): True to use wide layout, false to use default width.
• ChatTopBar.setThemed(boolean): True to make the topbar match the current chat room's theme, false to use the default dark background.
• ChatTopBar.setBrightness(float): Set brightness of icons and text in topbar (1.0 is default). This setting is saved per theme, and is only applied when themes are enabled. Can help deal with themes that don't contrast well with the icons.
• ChatTopBar.setQuiet(boolean): True to suppress console output.
• ChatTopBar.setShowSwitcher(boolean): True to show chat server links in SE dropdown.
• ChatTopBar.setRejoinOnSwitch(boolean): True to make "switch" links in SE dropdown auto-rejoin favorite rooms.
• ChatTopBar.setOpenRoomsHere(boolean): True to open rooms from the room search dropdown in this tab, false to open them in a new tab.
• ChatTopBar.setAutoSearch(boolean): True to search for rooms in the room finder as you type, false to require you to press a search button.
• ChatTopBar.setSearchByActivity(boolean): True to sort room search by activity, false to sort by number of people in room.
• ChatTopBar.setLinkifyDescriptions(boolean): True to convert URLs in room search result descriptions to clickable links, false not to.
• ChatTopBar.setFaviconVisible(boolean): True to show site icons in room seach, false not to. This setting is per chat server, not global.
• ChatTopBar.setFaviconStyle(string): Site icon position (if visible), one of "margin", "left", or "right". This setting is global.
• ChatTopBar.setRunInFrame(boolean): True to allow the topbar to load when chat is in an iframe, false not to. For compatibility with other scripts.
• ChatTopBar.showChangeLog(): Show the change log dialog.
• ChatTopBar.forgetAccount(): Forget cached network account ID, useful for testing.
• ChatTopBar.forgetEverything(): Erase all persistent settings, useful for testing.
• ChatTopBar.dumpSettings(): Print all persistent settings, useful for testing.
• ChatTopBar.fakeUnreadCounts(inbox,rep): Fake unread item messages to show indicators, useful for testing and photo ops.

All of the set* functions can be run with no parameters to return the current setting.

Notes:

• Uses one API query per chat server (SO, MSO, MSE) to get account ID. However, this value is cached, so usage should be extremely minimal. This is the only thing it uses the API for, so your quota should be safe.
• Mad props to Gerry and Shog9 for helping me figure stuff out.

Issues:

• Initial state of notification / reputation unread counts may be inaccurate due to fundamental issues with the topbar on chat.
• You may post bugs and requests here or on Github (or ping me in The Tavern)!

Change Log:

• 1.14, 1.14.1

  • New "compact" view for room search results (check it out in settings).
  • Search params are now preserved across room changes when room is visited from result list and "open search result rooms in this tab" is enabled. (Can be disabled with ChatTopBar.setPreserveSearch(false), no option in settings dialog.)
  • Title of current room is bold in room search.
  • Default site icon position changed to 'margin'. Previous default was 'left', you'll have to explicitly pick it if you wish to return to it (sorry).
  • Option to automatically load more results when scrolling to bottom of room search list. It's experimental and can only be enabled via console (ChatTopBar.setAutoLoadMore(true)).
  • Room search server errors no longer break the search dropdown.
  • Topbar source iframe was continuously generating a lot of background XHR noise, since it was / and would periodically refresh room/event/user lists, etc. Now loads /faq instead, which prevents loads of unnecessary requests.
  • ChatTopBar.setCompactCompactResults to support compact mode option.
  • Misc. code and source comment tweaks.
  • 1.14.1: Fixed a minor style issue (no visible change).
  • 1.14.1: Restore all settings back to proper types instead of strings (your settings should not be affected, but apologies in advance if they are).
  • 1.14.1: Slightly more graceful handling of errors when visiting a chat room while not logged in.

• 1.13

  • Site icons are now displayed in room results. Three options for positioning are present in settings dialog (I could not decide).
  • The site icon visibility setting is per chat server. Seems reasonable given that MSE and SO rooms all have the same boring icons, while SE is very exciting.
  • ChatTopBar.setFaviconVisible and ChatTopBar.setFaviconStyle to change icon settings.
  • Window event names changed to avoid future namespace collisions.
  • Runs at document-idle to ensure availability of SE objects.

• 1.12, 1.12.2, 1.12.3, (all)

  • Now supports Firefox, thanks entirely to Shog9.
  • Compatible with internal SE chat rooms (which have an extra iframe), so they say.
  • Updated topbar chat theme code to work on Firefox.
  • Stricter match rules for ?ctbjoin pages.
  • 1.12.2: Fix issue where Chrome sometimes failed to load script due to missed window load events.
  • 1.12.3: Entire area of room search results is now clickable.
  • 1.12.3: Option to linkify URLs in room search results (enabled by default).
  • 1.12.3: Links in room search results are now underlined on hover, to make it clear what you're clicking on.
  • 1.12.3: ChatTopBar.setLinkifyDescriptions to change linkify option.
  • 1.12.3: Add workaround for chat highlighting style bug.

• 1.11, 1.11.1, 1.11.2, 1.11.3, (all)

  • Chat room search contains selector for room tab (all, mine, favorites).
  • Default search sort order is now by people, with option to use activity instead. Improves search results greatly.
  • ChatTopBar.setSearchByActivity to change sort order option.
  • 1.11.1: Topbar icon hover fixed (thanks Shog9!)
  • 1.11.1: Update flasher notification now ignores revision number updates.
  • 1.11.2: Fix match patterns to not run on room info pages.
  • 1.11.2: Make flag icon (blue notifications on right) disappear on click.
  • 1.11.2: Scrolling to replies no longer hides them under the topbar.
  • 1.11.2: Overscrolling on change log no longer scrolls chat.
  • 1.11.2: Overscrolling on room search results no longer scrolls chat.
  • 1.11.3: Room dropdown button brightness fixed to match other buttons.
  • 1.11.3: Also, theme brightness was being applied twice to that button.

• 1.10

  • Search for chat rooms from new dropdown in topbar.
  • Styling tweaks to change log dialog.

• 1.09, +, +, +, +

  • Clicking site search box in SE dropdown no longer closes dropdown.
  • Also the site search didn't work, now it does.
  • Prevent overscrolling in dropdowns from scrolling chat when using mouse wheel.

• 1.08, +, +

  • Chat server links placed in SE dropdown (click name to open in new tab, "switch" to open in current tab).
  • Clicking "switch" on chat server link automatically rejoins favorite rooms (can be disabled in settings).
  • Brightness setting is now associated with the current room's theme rather than the room itself (so it applies to all rooms with the same theme). Apologies for any reset settings (it does make a good attempt to copy them, though).
  • Change log now displayed after update (when flashing "topbar" link clicked).
  • ChatTopBar.showChangeLog() will always show the change log, too.
  • ChatTopBar functions for additional settings added.
  • Don't load jQuery UI if it's already loaded.
  • Don't run in iframes (by default), for compatibility with some other scripts. ChatTopBar.setRunInFrame() can control this.

• 1.07

  • Settings dialog (accessible from 'topbar' link in footer).
  • Wide mode now matches right side padding instead of fixed at 95%.
  • More descriptive search box placeholders.
  • ChatTopBar.forgetEverything, for testing.

• 1.06, +

  • Brightness now only applied if theme enabled.
  • Sidebar resized so it doesn't hide behind the bottom panel.
  • ChatTopBar.fakeUnreadCounts(inbox,rep) for debugging.
  • Explicit unsafeWindow grant.
  • Sort output of dumpSettings().

• 1.04, 1.05

  • Per-room icon/text brightness option.
  • Option to suppress console output.
  • Ability to dump settings to console for testing.
  • Fixed a style bug where things were happening before CSS was loaded, was sometimes causing non-themed topbar to have a white background instead of black.

• 1.03

  • ChatTopBar console interface for setting options.
  • Widen / theme options now user-settable.
  • Ability to forget cached account ID for testing.

• 1.02

  • WebSocket reconnect when connection lost.
  • Beta code for themed topbar.
  • Better console logging.

• 1.01

  • Realtime event handling via websocket.

• 1.00

  • Initial version.

---

Check out my other scripts.