* Updated CSS to improve compatibiliy and make appearance more consistant (Thx Spocky)

* Fixed some issues with the Amazon Album art gathering created when I re-wrote it

4 files changed, 129 insertions, 80 deletions

diff --git a/templates/default.css b/templates/default.css
index d267cc0d..e084e2ca 100644
--- a/templates/default.css
+++ b/templates/default.css
@@ -165,9 +165,6 @@ textarea {
 	font-size: 11px;
 	cursor: pointer;
 }
-/* These three lines make a menu vertical */
- #sidebar li { float: none; }
- #sidebar li ul { margin: -1.5em 0 0 9em; }
 	
 /* ////////////////////////////////////////////////////////////////*/	
 /* De aqui pa'bajo, ros esta creando una hoja de estilos unica para todo Ampache  */
@@ -258,21 +255,25 @@ div#Header{
  * Make padding apply to the li, not just an a.  Moving padding: to li throws off the dropdown menu alignment.
  */
 
-div#sidebar{
+
+#sidebar{
 	clear:both;
 	position:absolute;
 	left:5px;
 	top:87px;
 }
 
+#sidebar select	{
+	width: 95%; 
+}
+
 #sidebar h3 {
-	border:0px; 
+	border:0; 
 	width: 120px; 
 	height: 28px; 
-	margin:0px;
-	padding:0px; 
-	background: transparent url("../themes/classic/images/sidebar_top.jpg") no-repeat left; 
-
+	margin:0;
+	padding:0; 
+	background: transparent url(../themes/classic/images/sidebar_top.jpg) no-repeat left; 
 }
 	
 #sidebar h3 span {
@@ -280,59 +281,99 @@ div#sidebar{
 }
 
 #sidebar ul {
-	margin: 0px;
 	list-style: none;
 	font-family:Arial, Helvetica, Sans-Serif;
-	font-size:10px;
-	padding: 0px;
-	line-height: 1.0;
+	font-size: 10px;
+	margin: 0;
+	padding: 0;
+	line-height: 1em;
+}
+   
+#sidebar ul.subnavside {
+    display: none;
+    position: absolute;
+    width: 9em;
+    top: -1px;
+    left: 11.5em;
+    font-size: 1em;
+    z-index: 1;		
 }
 
 #sidebar li {
+    float: left;
+    clear: both;
+    display: inline;	/* IE6 Patch */
+    position: relative;
+    width: 13em;
+    width: /**/11.5em; /* Only IE5.5 can't see this */
     margin: 0;
-    display: block;
     border-bottom: 1px solid #8B8B8B;
     border-left: 1px solid #8B8B8B;
     border-right: 4px solid #B4B4B4;
     border-top: 1px solid #8B8B8B;
-    /* float: left; /* use for horizontal menu; comment out otherwise */
-    padding: 5px 0px 5px 10px;
-    width: 10.5em;
-    background-color:#FFFFFF;
+    background:#fff;
 }
 
 #sidebar ul.subnavside li { 
     border-right: 1px solid #B4B4B4;
 }
 
-#sidebar a, .navbutton {
-    display: block;  /*Not sure why this is neccesary, but it is for IE*/
+#sidebar a, #sidebar .navbutton {
+    display: block;
+    position: relative;
     text-decoration: none;
+    padding: .5em 0 .5em 1em;
 }
 
-#sidebar li:hover, #sidebar li.sfhover {
-	color:#000000;
-	background-color:#DDDDDD;
+#sidebar li:hover ul.subnavside, #sidebar li.sfhover ul.subnavside {
+    display:block;
 }
 
-#sidebar li.hover:active {
-	background-color:#CCCCCC;
-	z-index:30;
-}
-   
-#sidebar li ul {
-    float: left;
-    position: absolute;
-    width: 9em;
-	margin: -1.5em 0 0 10.5em; /* for vertical menu; comment out otherwise */
-/*	margin: 0.5em 0 0 -1.1em;  /* for horizontal menu;  comment out otherwise */
-    left: -999em;  /* this -999em puts the submenu item way off to the left until it's called back by a hover (below) */
-	z-index:30;
+#sidebar li:hover, #sidebar li.sfhover,  #sidebar li.activetopmenu {
+    color:#000;
+    background-color:#ddd;
 }
 
-#sidebar li:hover ul, #sidebar li.sfhover ul {
-	left: auto;  /* this calls the submenu back when the parent li is hovered. */
-}
+#sidebar li.hover:active {
+    background-color:#ccc;
+    z-index:30;
+}
+
+/* For horizontal menu */
+.horizontal_menu #content {margin:3em 0 0 2em;}
+.horizontal_menu #sidebar { width: auto; top: 85px;}
+.horizontal_menu #sidebar h3 { display: none; }
+.horizontal_menu #sidebar li { clear: none; border:1px solid #8b8b8b}
+.horizontal_menu #sidebar ul.subnavside  { left: 0; top: 2em; }
+
+
+/* Menu Elements Display (icons, visibility...) */
+#sidebar_home a 	{ }
+#sidebar_admin a 	{ }
+#sidebar_prefs a 	{ }
+#sidebar_browse a 	{ }
+#sidebar_plists a 	{ }
+#sidebar_stats a 	{ }
+#sidebar_search a 	{ }
+#sidebar #sidebar_subsearch  	{ }
+#sidebar_random a 	{ }
+#sidebar_form  		{ }
+#sidebar_localplay a 	{ }
+#sidebar_localplay_ctrl	{ }
+#sidebar_logout a 	{ }
+
+#sidebar_admin_users a		{ }
+#sidebar_admin_mail_users a	{ }
+#sidebar_admin_catalog a	{ }
+#sidebar_admin_config a 	{ }
+#sidebar_admin_access_list a	{ }
+
+#sidebar_browse_albums a	{ }
+#sidebar_browse_artists a	{ }
+#sidebar_browse_genre a		{ }
+#sidebar_browse_song_title a	{ }
+#sidebar_browse_lists a		{ }
+
 
 /* Styles for Now Playing */
 #nowplaying{
@@ -594,6 +635,7 @@ li.current-rating{
 .np_row {
 	padding-top: 3px;
 	padding-bottom: 3px;
+	display: block;
 }
 .np_cell {
 	margin: 10px;
@@ -666,4 +708,3 @@ td.user_offline {
 td.user_disabled {
 	background-color: gray;
 }
-
diff --git a/templates/header.inc b/templates/header.inc
index cc184748..a2e53e05 100644
--- a/templates/header.inc
+++ b/templates/header.inc
@@ -46,7 +46,13 @@ if (conf('use_rss')) { ?>
 <body>
 <script src="<?php echo $web_path; ?>/lib/javascript-base.js" language="javascript" type="text/javascript"></script>
 <script src="<?php echo $web_path; ?>/modules/kajax/ajax.js" language="javascript" type="text/javascript"></script>
-<div id="maincontainer">
+<div id="maincontainer" <?php 
+	if ($GLOBALS['theme']['orientation'] == 'horizontal') { 
+		echo " class=\"horizontal_menu\" ";
+	}else{
+		echo " class=\"vertical_menu\" ";
+	}?>>
+		
 	<div id="topbar"><!-- This is the topbar row -->
 		<div id="topbarleft">
 		<a href="http://www.ampache.org">
diff --git a/templates/sidebar.inc.php b/templates/sidebar.inc.php
index 553514b5..06962c10 100644
--- a/templates/sidebar.inc.php
+++ b/templates/sidebar.inc.php
@@ -22,20 +22,20 @@
 /**
  * This is kind of the wrong place to do this, but let's define the different submenu's that could possibly be 
  * displayed on this page, this calls the show_submenu($items); function which takes an array of items
- * that have ['title'] ['url'] and ['active'] url assumes no conf('web_path')
+ * that have ['title'] ['url'] ['active'] and ['cssclass'] url assumes no conf('web_path')
  */
 
-$admin_items[] = array('title'=>_('Users'),'url'=>'admin/users.php','active'=>$location['page']);
-$admin_items[] = array('title'=>_('Mail Users'),'url'=>'admin/mail.php','active'=>$location['page']);
-$admin_items[] = array('title'=>_('Catalog'),'url'=>'admin/index.php','active'=>$location['page']);
-$admin_items[] = array('title'=>_('Config'),'url'=>'admin/preferences.php','active'=>$location['page']);
-$admin_items[] = array('title'=>_('Access List'),'url'=>'admin/access.php','active'=>$location['page']);
+$admin_items[] = array('title'=>_('Users'),'url'=>'admin/users.php','active'=>$location['page'], 'cssclass'=>'sidebar_admin_users');
+$admin_items[] = array('title'=>_('Mail Users'),'url'=>'admin/mail.php','active'=>$location['page'], 'cssclass'=>'sidebar_admin_mail_users');
+$admin_items[] = array('title'=>_('Catalog'),'url'=>'admin/index.php','active'=>$location['page'], 'cssclass'=>'sidebar_admin_catalog');
+$admin_items[] = array('title'=>_('Config'),'url'=>'admin/preferences.php','active'=>$location['page'], 'cssclass'=>'sidebar_admin_config');
+$admin_items[] = array('title'=>_('Access List'),'url'=>'admin/access.php','active'=>$location['page'], 'cssclass'=>'sidebar_admin_access_list');
 
-$browse_items[] = array('title'=>_("Albums"),'url'=>'albums.php','active'=>$location['page']);
-$browse_items[] = array('title'=>_("Artists"),'url'=>'artists.php','active'=>$location['page']);
-$browse_items[] = array('title'=>_("Genre"),'url'=>'browse.php?action=genre','active'=>$location['page']);
-$browse_items[] = array('title'=>_('Song Title'),'url'=>'browse.php?action=song_title','active'=>$location['page']);
-$browse_items[] = array('title'=>_("Lists"),'url'=>'browse.php','active'=>$location['page']);
+$browse_items[] = array('title'=>_("Albums"),'url'=>'albums.php','active'=>$location['page'], 'cssclass'=>'sidebar_browse_albums');
+$browse_items[] = array('title'=>_("Artists"),'url'=>'artists.php','active'=>$location['page'], 'cssclass'=>'sidebar_browse_artists');
+$browse_items[] = array('title'=>_("Genre"),'url'=>'browse.php?action=genre','active'=>$location['page'], 'cssclass'=>'sidebar_browse_genre');
+$browse_items[] = array('title'=>_('Song Title'),'url'=>'browse.php?action=song_title','active'=>$location['page'], 'cssclass'=>'sidebar_browse_song_title');
+$browse_items[] = array('title'=>_("Lists"),'url'=>'browse.php','active'=>$location['page'], 'cssclass'=>'sidebar_browse_lists');
 //$browse_items[] = array('title'=>'File','url'=>'files.php','active'=>''); <!--pb1dft: this can be cleaned up -->
 
 $web_path = conf('web_path');
@@ -43,21 +43,21 @@ $web_path = conf('web_path');
 ?>
 <h3>&nbsp;</h3>
 <ul id="navlist">
-	<li<?php
+	<li id="sidebar_home"<?php
                 if ($location['page'] == "index.php"){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/index.php"><?php echo _('Home'); ?></a>
 	</li>
 <?php if ($GLOBALS['user']->has_access(100)) { ?>
-	<li<?php
+	<li id="sidebar_admin"<?php
                 if ($location['page'] == 'admin/index.php' ||
                     $location['page'] == 'admin/users.php' ||
                     $location['page'] == 'admin/mail.php' ||
                     $location['page'] == 'admin/catalog.php' ||
                     $location['page'] == 'admin/preferences.php' ||
                     $location['page'] == 'admin/access.php' ){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/admin/index.php"><?php echo _('Admin'); ?></a>
 	<?php
@@ -74,17 +74,17 @@ $web_path = conf('web_path');
 } // end if access 
 	?>
 	
-	<li<?php
+	<li id="sidebar_prefs"<?php
                 if ($location['page'] == "preferences.php" ){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/preferences.php"><?php echo _('Preferences'); ?></a>
 	</li>
-	<li<?php
+	<li id="sidebar_browse"<?php
                 if ($location['page'] == "browse.php" ||
                     $location['page'] == "artists.php" ||
                     $location['page'] == "albums.php" ){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/browse.php"><?php echo _('Browse'); ?></a> 
 		<?php 
@@ -99,26 +99,26 @@ $web_path = conf('web_path');
 			}
 		}
 		?>
-	<li<?php
+	<li id="sidebar_plists"<?php
                 if ($location['page'] == "playlist.php"){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/playlist.php"><?php echo _('Playlists'); ?></a>
 	</li>
-	<li<?php
+	<li id="sidebar_stats"<?php
                 if ($location['page'] == "stats.php"){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/stats.php"><?php echo _('Statistics'); ?></a>
 	</li>
-	<li<?php
+	<li id="sidebar_search"<?php
                 if ($location['page'] == "search.php"){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/search.php"><?php echo _('Search'); ?></a>
 	</li>
 <?php if ($GLOBALS['theme']['orientation'] != 'horizontal') { ?>
-	<li>
+	<li id="sidebar_subsearch">
 		<form name="sub_search" method="post" action="<?php echo $web_path; ?>/search.php" enctype="multipart/form-data" style="Display:inline">
 		<input type="text" name="search_string" value="" size="5" />
 		<input class="smallbutton" type="submit" value="<?php echo _('Search'); ?>" /> 
@@ -128,16 +128,16 @@ $web_path = conf('web_path');
 		</form>
 	</li>
 <?php } // end if ($GLOBALS['theme']['orientation'] != 'horizontal')?>
-	<li<?php
+	<li id="sidebar_random"<?php
                 if ($location['page'] == "randomplay.php"){
-                    echo " id=\"activetopmenu\" ";
+                    echo " class=\"activetopmenu\" ";
                     }?>>
 		<a href="<?php echo $web_path; ?>/randomplay.php"><?php echo _('Random'); ?></a>
 	</li>
 <?php if ($GLOBALS['theme']['orientation'] != 'horizontal') { ?> 
 	<li id="sidebar_form">
 		<form name="sub_random" method="post" enctype="multipart/form-data" action="<?php echo $web_path; ?>/song.php?action=random&amp;method=stream" style="Display:inline">
-		<select name="random" style="width:8.7em;">
+		<select name="random" >
 			<option value="1">1</option>
 			<option value="5" selected="selected">5</option>
 			<option value="10">10</option>
@@ -149,9 +149,9 @@ $web_path = conf('web_path');
 			<option value="1000">1000</option>
 			<option value="-1"><?php echo _('All'); ?></option>
 		</select>
-		<?php show_genre_pulldown('genre','','','13','width:8.7em;'); ?>
+		<?php show_genre_pulldown('genre','','','13',''); ?>
 					<br />  
-		<select name="random_type" style="width:8.7em;">
+		<select name="random_type" >
 			<option value="Songs"><?php echo _('Songs'); ?></option>
 			<option value="length"><?php echo _('Minutes'); ?></option>
 			<option value="full_artist"><?php echo _('Artists'); ?></option>
@@ -159,18 +159,18 @@ $web_path = conf('web_path');
 			<option value="unplayed"><?php echo _('Less Played'); ?></option>
 		</select>
 		<br /> 
-		<?php show_catalog_pulldown('catalog','width:8.7em;'); ?>
+		<?php show_catalog_pulldown('catalog',''); ?>
 		<br />
 		<input class="smallbutton" type="submit" value="<?php echo _('Enqueue'); ?>" />
 		</form>
 	</li>
 <?php } // end if ($GLOBALS['theme']['orientation'] != 'horizontal') ?> 
 <?php if ($GLOBALS['user']->prefs['localplay_level'] > 0) { ?>
-	<li>
+	<li id="sidebar_localplay">
 		<a href="<?php echo $web_path; ?>/localplay.php"><?php echo _('Localplay'); ?></a>
 	</li>
 <?php if ($GLOBALS['theme']['orientation'] != 'horizontal') { ?>
-	<li>
+	<li id="sidebar_localplay_ctrl">
 		<?php require_once(conf('prefix') . '/templates/show_localplay_control.inc.php'); ?>
 	</li>
 <?php } // if horizontal orientation ?>
@@ -188,6 +188,6 @@ $web_path = conf('web_path');
 	</li>
 <?php } // if democratic play ?>
 <?php if (conf('use_auth')) { ?>
-	<li><a href="<?php echo $web_path; ?>/logout.php"><?php echo _('Logout'); ?></a></li>
+	<li id="sidebar_logout"><a href="<?php echo $web_path; ?>/logout.php"><?php echo _('Logout'); ?></a></li>
 <?php } // end (conf('use_auth'))?>
 </ul>
diff --git a/templates/subnavbar.inc.php b/templates/subnavbar.inc.php
index 552f17c2..d1ef38f1 100644
--- a/templates/subnavbar.inc.php
+++ b/templates/subnavbar.inc.php
@@ -22,7 +22,7 @@
 
 /**
  * This file expect an array of 'items' which have ['0']['url'] ['0']['title']
- * and a ['0']['active'] == true/false this is called from show_submenu($items);
+ * ['0']['active'] == true/false and ['0']['cssclass'] this is called from show_submenu($items);
  */
 
 ?>
@@ -30,8 +30,10 @@
 <?php 
 	foreach ($items as $item) { 
 		if ($item['url'] == $item['active']) { 
-			$li_id 	= "id=\"activesubmenu\"";
-		} ?>
-		<li <?php echo $li_id; ?>><a href="<?php echo conf('web_path') . "/" .  $item['url']; ?>"><?php echo $item['title']; ?></a></li>
+			$li_class = "class=\"activesubmenu\"";
+		} 
+		$li_id = "id=\"" . $item['cssclass'] . "\"";
+		?>
+		<li <?php echo $li_class; echo $li_id; ?>><a href="<?php echo conf('web_path') . "/" .  $item['url']; ?>"><?php echo $item['title']; ?></a></li>
 	<?php unset($li_id); } // END foreach ($items as $item) ?>
 </ul>