Closes #11870

Push offline users to the bottom of the list.

This was being shown in both audio in video modal.
Related to #11865.

When browser's name string has whitespaces, we must treat it before adding to the
body class. For example Edge uses 'microsoft edge' string
This class string must match names used in css.

Tested in firefox, chrome and safari and it's corresponding mobile versions,
this is working for all.

Fixes #11865

Etherpad has a limitation of 50 characters for it's pad ids. Although
our SHA1 hash function generates 40 characters length values, after
prefixing (Meteor's instance id) and suffixing (closed captions support)
the pad id we can reach an invalid size.

Firefox doesn't create a  device called 'default' and we were trying
to set this when user is joining the room. We don't do this anymore, letting
devices to be changed when there's some user request.

Moved outputDeviceId inputDeviceId information to be managed in bridge
(just like we do with inputDeviceId), we don't store this duplicated
information in audio container anymore.

Fixed the eslint warning in "playAlertSound(url) { ..."

We are safe to let users try to change input/output devices because the
device list is retrieved from enumerateDevices.

When listen only fallbacks from Kurento to FreeSWITCH, we must guarantee
the muted alert won't be created, speciallly because listen-only's fallback
uses a flow similar to microphone's. Client currently crashes when this
happens: this commit fixes this peoblem.

We now stop the MediaStream (cloned/dummy input stream) when this is not
needed anymore.
We don't create/clone a new MediaStream when it already exists.
Fixed eslint warning in muted-alert/component.jsx

* WIP adding whiteboard special user access test spec

* Adds additional user whiteboard access test spec to whiteboard.obj.js

Setting this as default to prevent bad UX: device selector is currently small
for mobile devices

This could be added as a config in future

By default this is set to true, allowing users to dynamic change audio devices
Fixed a few linter warnings

Allow listenonly users to change output devices
Fixed dynamic audio device change for firefox
Fixed shortcuts for audio join/leave
Show (with a bold font) the current selected device
[performance] Prevent calling mediaDevices.enumerateDevices every time we render
the selector. This adds a delay (~200ms, on my chrome setup) to render this component
[performance] Do not call enumerateDevices to search for new devices, instead we listen on mediaDevices.deviceChange event
Small refactoring and fixed a few errors that were being throw in browser's console
Fixed device selection when this is done in audio-settings modal
Fallback to default device when current device is removed
Truncate device name length
Renamed "Input","Output" labels to "Microphone","Speakers", respectively
Update eslint rule for accessKey

Isolate most Pad related functions and secure shared notes and closed
captions creation to only when there is a reachable Etherpad server
configured.