From 5fb0dbf5d99b8a5af3c78340073265fabd66149c Mon Sep 17 00:00:00 2001
From: Ruud <ruud@crashdummy.nl>
Date: Thu, 31 May 2012 22:09:42 +0200
Subject: [PATCH] Show active page. fix #373

---
 .../static/scripts/block/navigation.js        | 12 +++++++--
 couchpotato/static/scripts/page.js            |  3 ++-
 couchpotato/static/scripts/page/settings.js   |  2 ++
 couchpotato/static/style/main.css             | 27 ++++++++++++-------
 4 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/couchpotato/static/scripts/block/navigation.js b/couchpotato/static/scripts/block/navigation.js
index b6886f8d..85f20c49 100644
--- a/couchpotato/static/scripts/block/navigation.js
+++ b/couchpotato/static/scripts/block/navigation.js
@@ -32,13 +32,21 @@ Block.Navigation = new Class({
 
 	},
 
-	addTab: function(tab){
+	addTab: function(name, tab){
 		var self = this
 
-		return new Element('li.tab_'+(tab.text.toLowerCase() || 'unknown')).adopt(
+		return new Element('li.tab_'+(name || 'unknown')).adopt(
 			new Element('a', tab)
 		).inject(self.nav)
 
+	},
+
+	activate: function(name){
+		var self = this;
+
+		self.nav.getElements('.active').removeClass('active');
+		self.nav.getElements('.tab_'+name).addClass('active');
+
 	}
 
 });
\ No newline at end of file
diff --git a/couchpotato/static/scripts/page.js b/couchpotato/static/scripts/page.js
index 589fa3ed..1af800e8 100644
--- a/couchpotato/static/scripts/page.js
+++ b/couchpotato/static/scripts/page.js
@@ -20,7 +20,7 @@ var PageBase = new Class({
 		// Create tab for page
 		if(self.has_tab){
 			var nav = App.getBlock('navigation');
-			self.tab = nav.addTab({
+			self.tab = nav.addTab(self.name, {
 				'href': App.createUrl(self.name),
 				'title': self.title,
 				'text': self.name.capitalize()
@@ -39,6 +39,7 @@ var PageBase = new Class({
 				self.el.adopt(elements);
 			}
 
+			App.getBlock('navigation').activate(self.name);
 			self.fireEvent('opened');
 		}
 		catch (e){
diff --git a/couchpotato/static/scripts/page/settings.js b/couchpotato/static/scripts/page/settings.js
index 8bf04053..91848556 100644
--- a/couchpotato/static/scripts/page/settings.js
+++ b/couchpotato/static/scripts/page/settings.js
@@ -34,6 +34,8 @@ Page.Settings = new Class({
 		else {
 			self.openTab(action);
 		}
+
+		App.getBlock('navigation').activate(self.name);
 	},
 
 	openTab: function(action){
diff --git a/couchpotato/static/style/main.css b/couchpotato/static/style/main.css
index 884d8724..679748b6 100644
--- a/couchpotato/static/style/main.css
+++ b/couchpotato/static/style/main.css
@@ -203,18 +203,25 @@ body > .spinner, .mask{
 				display: block;
 				margin-top: 5px;
 			}
-
-		.header .navigation li.disabled {
-			color: #e5e5e5;
+		
+		.header .navigation li a:after {
+			content: '';
+			display: inline-block;
+			height: 2px;
+			width: 100%;
+			position: relative;
+			top: -20px;
+			background-color: #46505e;
+			outline: none;
+			box-shadow: inset 0 1px 8px rgba(0,0,0,0.05), 0 1px 0px rgba(255,255,255,0.15);
+			transition: all .4s cubic-bezier(0.9,0,0.1,1);
 		}
+		
+		.header .navigation li:hover a:after { background-color: #047792; }
+		.header .navigation li.active a:after { background-color: #04bce6; }
 
-		.header .navigation li a:link, .header .navigation li a:visited {
-			color: #fff;
-		}
-
-		.header .navigation li a:hover, .header .navigation li a:active {
-			color: #b1d8dc;
-		}
+		.header .navigation li.disabled { color: #e5e5e5; }
+		.header .navigation li a { color: #fff; }
 
 		.header .navigation .backtotop {
 			opacity: 0;