When on mobile galene.css tunes #left-sidebar to appear/disappear
when #sidebarCollapse is tapped. It indeed works ok when in chat mode,
but when in video mode, when #sidebarCollapse is tapped the only thing
that happens is that only "Galène" title of left sidebar window appears
- the other content of that window below the title is completely black
and even more: I only see title bar of the whole screen being scrolled
to the right, but the main area with videos is not scrolled to the
right.
That happens because video is overlaying left sidebar.
-> Fix that by setting z-index on #left-sidebar.active so that it always
comes on top of video.
The chat window appears when #show-chat is clicked. That click leads
to #left becoming visible, which contains chat elements. However when
mobile user taps #input, on-screen keyboard appears, which triggers
screen resize -> setViewportHeight() and the latter calls showVideo()
which hides the chat completely.
-> Fix that by doing showVideo() in setViewportHeight() only if we were
not in chat mode.