From e53a3de95dd9b1a92dc370e0e15382da888b77bd Mon Sep 17 00:00:00 2001
From: Richard Whitehouse <github@richardwhiuk.com>
Date: Mon, 31 Jan 2011 16:40:17 +0000
Subject: [PATCH] Added opacity filter for semi transparent inactive panes.
 Added routines to Javascript to ensure this happens on the fly.

---
 theme/hmb.css |  4 ++++
 theme/hmb.js  | 13 ++++++++++++-
 theme/ie.css  |  4 ++++
 3 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/theme/hmb.css b/theme/hmb.css
index bd68cbb..5ad6458 100644
--- a/theme/hmb.css
+++ b/theme/hmb.css
@@ -176,6 +176,10 @@ ul#panes li.pane {
 	overflow: hidden;
 }
 
+ul#panes li.pane-inactive {
+	opacity: 0.3;
+}
+
 ul#panes li.pane-r {
 	background: #4a0d0e;
 	background: rgba(74,13,14,0.75);
diff --git a/theme/hmb.js b/theme/hmb.js
index 6e84710..2d4dfd4 100644
--- a/theme/hmb.js
+++ b/theme/hmb.js
@@ -10,6 +10,14 @@ function update_hmb(){
 	var left = current * 850;
 	$("#paneshow").animate({ left: "-" + left + "px" }, function(){
 
+	for(var p in panemap){
+		if(panemap[p] == current){
+			$("#pane-" + p).animate({ opacity: 1 });
+		} else {
+			$("#pane-" + p).animate({ opacity: 0.3 });
+		}
+	}
+
 	if(current > 0){
 		$("#arrow-l").fadeIn('slow');
 	} else {
@@ -29,7 +37,8 @@ update_hmb();
 
 for(var p in panemap){
 	
-	$(".link_" + p).click({pane: p}, function(ev){ 
+	$(".link_" + p).click({pane: p}, function(ev){
+		$(".pane").animate({ opacity: 0.3 });
 		current = panemap[ev.data.pane];
 		update_hmb();
 		this.blur();
@@ -40,6 +49,7 @@ for(var p in panemap){
 $("#arrow-r").click(function(){
 
 	if((current + 1) < panes){
+		$(".pane").animate({ opacity: 0.3 });
 		$("#arrow-l").hide();
 		$("#arrow-r").fadeOut(function(){
 			++current;
@@ -55,6 +65,7 @@ $("#arrow-r").click(function(){
 $("#arrow-l").click(function(){
 
 	if(current > 0){
+		$(".pane").animate({ opacity: 0.3 });
 		$("#arrow-r").hide();
 		$("#arrow-l").fadeOut(function(){
 			--current;
diff --git a/theme/ie.css b/theme/ie.css
index 378e41e..b2dc74f 100644
--- a/theme/ie.css
+++ b/theme/ie.css
@@ -2,6 +2,10 @@
 
 /** 4a0d0e 0.75 **/
 
+ul#panes li.pane-inactive {
+	filter:alpha(opacity=30)
+}
+
 ul#panes li.pane-r {
 	background: transparent;
 	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#C04a0d0e,endColorstr=#C04a0d0e);
-- 
2.34.1