Merge remote-tracking branch 'brb-at/sidebar' into release-4.2.4

Conflicts:
	app/common/main-controller.js

app/common/main-controller.js

@@ -108,14 +108,15 @@
         }
     };
     $rootScope.showQueue = function () {
-        // TO DO: Fix me
+        $('#SideBar').css('display', '');
+        $('#right-component').removeClass('lgcolumn_expanded');
     };
     $rootScope.hideQueue = function () {
-        // TO DO: Fix me
+        $('#SideBar').css('display', 'none');
+        $('#right-component').addClass('lgcolumn_expanded');
     };
     $scope.toggleQueue = function () {
-        var submenu = $('#QueuePreview');
-        if (submenu.css('display') == 'none') {
+        if ($('#SideBar').css('display') == 'none') {
             $rootScope.showQueue();
         } else {
             $rootScope.hideQueue();
@@ -457,6 +458,11 @@
     /* Launch on Startup */
     $scope.loadSettings();
     utils.switchTheme(globals.settings.Theme);
+
+    if(!globals.settings.ShowQueue) {
+        $rootScope.hideQueue();
+    }
+
     if ($scope.loggedIn()) {
         //$scope.ping();
         if (globals.settings.SaveTrackPosition) {

app/index.html

@@ -27,7 +27,7 @@
             <a id="jslogo" title="Jamstash" class="showQueue" href=""></a>
             <a id="sslogo" target="_blank" ng-show="settings.Server" ng-href="{{settings.Server}}" title="{{settings.Server}}"></a>
             <div id="globalactions">
-                <a href="" class="button" id="action_ToggleSideBar" title="Toggle Side Bar"><img src="images/arrow_right_gl_8x8.png" /></a>
+                <a href="" class="button" id="action_ToggleSideBar" ng-click="toggleQueue()" title="Toggle Side Bar"><img src="images/arrow_right_gl_8x8.png" /></a>
             </div>
             <div id="nav">
                 <ul class="tabs">

app/settings/settings-service.js

@@ -58,7 +58,8 @@ angular.module('jamstash.settings', [])
         AutoPlay: false,
         LoopQueue: false,
         Repeat: false,
-        Debug: false
+        Debug: false,
+        ShowQueue: true
     };
     this.SavedCollections = [];
     this.SavedGenres = [];

app/settings/settings.html

@@ -44,6 +44,9 @@
                         <div class="inputwrap"><input type="checkbox" id="ScrollTitle" name="ScrollTitle" value="1" title="Scroll the Title Once" ng-model="settings.ScrollTitle" /></div>
                         <label for="ScrollTitle">Scroll Title</label>
                         <div class="clear"></div>
+                        <div class="inputwrap"><input type="checkbox" id="ShowQueue" name="ShowQueue" value="1" title="Show Queue" ng-model="settings.ShowQueue" /></div>
+                        <label for="ShowQueue">Show Queue</label>
+                        <div class="clear"></div>
                         <label for="DefaultLibraryLayout">Default Library Layout</label>
                         <div class="clear"></div>
                         <select id="DefaultLibraryLayout" name="DefaultLibraryLayout" class="" ng-model="settings.DefaultLibraryLayout.id" ng-options="o.id as o.name for o in Layouts" title="Library Layout"></select>

app/settings/settings.js

@@ -53,6 +53,11 @@
         if ($scope.settings.Theme) {
             utils.switchTheme(globals.settings.Theme);
         }
+        if($scope.settings.ShowQueue) {
+            $rootScope.showQueue();
+        } else {
+            $rootScope.hideQueue();
+        }
         utils.setValue('Settings', $scope.settings, true);
         notifications.updateMessage('Settings Updated!', true);
         $scope.loadSettings();

app/styles/Dark.css

@@ -86,6 +86,7 @@ ul.tablist li {
 {
     background: #292929;
     border: 1px solid #1D1D1D;
+    margin-bottom: -43px;
 }
 #NowPlaying, #ChatMsgs
 {

app/styles/Style.css

@@ -244,6 +244,10 @@ span.apiversion
 	margin-left: 312px;
 	margin-right: 350px;
 }
+.lgcolumn_expanded
+{
+    margin-right: 0 !important;
+}
 .colspacer {
 	height: 100px;
 	width: 100%;

app/subsonic/subsonic.html

@@ -30,7 +30,7 @@
         </div>
         <div id="SubsonicAlbums" class="lgsection" split>
             <!-- Album -->
-            <div id="right-component" class="lgcolumn">
+            <div id="right-component" class="lgcolumn" ng-class="{'lgcolumn_expanded' : !$rootScope.settings.ShowQueue}">
                 <ul class="actionlist">
                     <li>
                         <form class="form">