Some final layout simplifications

* Always show number of players
* Hide players list, if it is empty, allow overwrite by using css class "secret"
* Have four "formSection" containers in server tab
* Added css class for tab pages
* Tab title/channel name is now contained in span tag
* Tab headers having tooltips showing the channel name

index.html

@@ -118,7 +118,6 @@
         .chatUsersCount,
         .chatChannelName {
-            display: none;
             padding: 7px 7px;
             border-bottom: solid 1px #aaa;
             font-size: 0.9em
@@ -187,10 +186,12 @@
     <div id="tabsystem">
         <ul class="tabsystemHeaders">
-            <li data-id="tabPageServer" data-content="label.server_tab" class="active">Server</li>
+            <li data-id="tabPageServer" title="Server" class="active">
+                <span data-content="label.server_tab" class="title">Server<span>
+            </li>
         </ul>
         <div class="tabsystemViewport">
-            <div id="tabPageServer">
+            <div id="tabPageServer" class="tabPage">
                 <div class="chatOutputContainer">
                     <div class="chatMessagesContainer">
                         <ul class="chatMessages">
@@ -225,6 +226,8 @@
                         <div class="formSection">
                             <input type="submit" id="channelCreateSubmitButton">
                         </div>
+                        <div class="formSection">
+                        </div>
                     </form>
                 </div>
             </div>
@@ -233,7 +236,7 @@
     <div id="tabPageSkeletonContainer" style="display:none;">
-        <div id="tabPageSkeleton">
+        <div id="tabPageSkeleton" class="tabPage">
             <div class="chatOutputContainer">
                 <div class="chatMessagesContainer">
                     <ul class="chatMessages">

src_coffee/webclient/chat_controller.coffee

@@ -239,21 +239,34 @@ class this.ChatController
         isNewTab = (tabPage?.length is 0)
         if isNewTab
-            # Set up tab parts
-            htmlTabHeader = "<li data-id=\"#{tabID}\">#{channelTitle}</li>"
+            # Build tab header
+            tabHeaderTitle = $("<span/>")
+            tabHeaderTitle.addClass('title')
+            tabHeaderTitle.text(channelTitle)
+            tabHeader = $("<li/>")
+            tabHeader.attr('data-id', tabID)
+            tabHeader.attr('title', channelTitle)
+            tabHeader.append(tabHeaderTitle)
+
+            # Build tab body
             tabSkeleton = @ui.tabPageSkeleton.clone()
             tabSkeleton.attr('id', tabID)
             tabSkeleton.attr('data-channel', channel)
             # Add tab to DOM
             @ui.tabsystemViewport.append(tabSkeleton)
-            @ui.tabsystemHeaderList.append(htmlTabHeader)
+            @ui.tabsystemHeaderList.append(tabHeader)
             @_updateGuiBindings()
             # Get new tab
             tabPage = @_getChannelTabPage(channel)
             tabPage.hide()
+            # Hide non-default boxes
+            tabPage.find(@gui.tabPagesUsersNumberBox).hide()
+            tabPage.find(@gui.tabPagesChannelNameBox).hide()
+            tabPage.find(@gui.tabPagesUsersIngame).hide()
+
             # Remove invalid buttons
             unless data.isCustom
                 tabPage.find(@gui.channelLeaveButton).remove()
@@ -308,8 +321,17 @@ class this.ChatController
     handleChannelUserList: (channel, clientList) ->
         tabPage = @_getChannelTabPage(channel)
         @_clearUserListOfTab(tabPage)
+        clientsNumber = 0
         for identityData in clientList
             @_appendUserEntryToTab(tabPage, identityData.name, identityData.title, identityData.isIrcClient)
+            clientsNumber++ unless identityData.isIrcClient
+        # Show list and number of players, if joined players are not hidden (number not zero)
+        if clientsNumber isnt 0
+            tabPage.find(@gui.tabPagesUsersIngame).show()
+            tabPage.find(@gui.tabPagesUsersIngame).removeClass('secret')
+            @_setUserNumberToTab(tabPage, clientsNumber)
+        else
+            tabPage.find(@gui.tabPagesUsersIngame).addClass('secret')
     handleChannelUserNumber: (channel, clientsNumber) ->
         tabPage = @_getChannelTabPage(channel)