gui: Display folder and device count number (#8615)

In large setups, it is currently impossible to know the exact number of
folders and remote devices without counting them manually, either in the
GUI or in config.xml. Thus, to provide this information to the user, add
a specific number right next to both Folders and Remote Devices headers
in the Web GUI. The numbers are only displayed when two or more folders
or devices are present.

Signed-off-by: Tomasz Wilczyński <[email protected]>

gui/default/index.html

@@ -336,7 +336,7 @@
         <!-- Folder list (top left) -->
 
         <div class="col-md-6" aria-labelledby="folder_list" role="region" >
-          <h3 id="folder_list" translate>Folders</h3>
+          <h3 id="folder_list"><span translate>Folders</span><span ng-if="folderList().length > 1"> ({{folderList().length}})</span></h3>
           <div class="panel-group" id="folders">
             <div class="panel panel-default" ng-repeat="folder in folderList()">
               <button class="btn panel-heading" data-toggle="collapse" data-parent="#folders" data-target="#folder-{{$index}}" aria-expanded="false">
@@ -731,7 +731,7 @@
           </div>
 
           <!-- Remote devices -->
-          <h3 translate>Remote Devices</h3>
+          <h3><span translate>Remote Devices</span> <span ng-if="otherDevices().length > 1"> ({{otherDevices().length}})</span></h3>
           <div class="panel-group" id="devices">
             <div class="panel panel-default" ng-repeat="deviceCfg in otherDevices()">
               <button class="btn panel-heading" data-toggle="collapse" data-parent="#devices" data-target="#device-{{$index}}" aria-expanded="false">