- Web UI: Display selected filter as selected

src/httpconnection.cpp

@@ -110,7 +110,7 @@ QString HttpConnection::translateDocument(QString data) {
     QRegExp regex("_\\(([\\w\\s?!\\.]+)\\)");
     i = regex.indexIn(data, i);
     if(i >= 0) {
-      qDebug("Found translatable string: %s", regex.cap(1).toUtf8().data());
+      //qDebug("Found translatable string: %s", regex.cap(1).toUtf8().data());
       QString word = regex.cap(1);
       QString translation = word;
       int context_index= 0;
@@ -118,7 +118,7 @@ QString HttpConnection::translateDocument(QString data) {
         translation = qApp->translate(contexts[context_index].c_str(), word.toLocal8Bit().data(), 0, QCoreApplication::UnicodeUTF8, 1);
         ++context_index;
       }while(translation == word && context_index < 7);
-      qDebug("Translation is %s", translation.toUtf8().data());
+      //qDebug("Translation is %s", translation.toUtf8().data());
       data = data.replace(i, regex.matchedLength(), translation);
       i += translation.length();
       found = true;

src/webui/css/style.css

@@ -130,7 +130,12 @@ hr {
 	list-style-type: none;
 }
 
+#Filters ul li {
+	margin-left: -16px;
+}
+
 #Filters ul img {
+	padding-left: 4px;
 	padding-right: 2px;
 	margin-top: 2px;
 }
@@ -139,3 +144,7 @@ hr {
 	vertical-align: top;
 }
 
+.selectedFilter {
+	background-color: #354158;
+	color: #000;
+}

src/webui/index.html

@@ -75,11 +75,11 @@
 			<table>
 				<tr><td id="Filters">
 				<ul>
-					<li><a href="#" onclick="setFilter('all');"><img src="images/oxygen/folder.png"/>_(All)</li>
+					<li class="selectedFilter" id="all_filter"><a href="#" onclick="setFilter('all');"><img src="images/oxygen/folder.png"/>_(All)</li>
-					<li><a href="#" onclick="setFilter('downloading');"><img src="images/skin/downloading.png"/>_(Downloading)</li>
+					<li id="downloading_filter"><a href="#" onclick="setFilter('downloading');"><img src="images/skin/downloading.png"/>_(Downloading)</li>
-					<li><a href="#" onclick="setFilter('completed');"><img src="images/skin/seeding.png"/>_(Completed)</li>
+					<li id="completed_filter"><a href="#" onclick="setFilter('completed');"><img src="images/skin/seeding.png"/>_(Completed)</li>
-					<li><a href="#" onclick="setFilter('active');"><img src="images/oxygen/draw-triangle2.png"/>_(Active)</li>
+					<li id="active_filter"><a href="#" onclick="setFilter('active');"><img src="images/oxygen/draw-triangle2.png"/>_(Active)</li>
-					<li><a href="#" onclick="setFilter('inactive');"><img src="images/oxygen/draw-rectangle.png"/>_(Inactive)</li>
+					<li id="inactive_filter"><a href="#" onclick="setFilter('inactive');"><img src="images/oxygen/draw-rectangle.png"/>_(Inactive)</li>
 				</ul>
 				</td>
 			<td id="Transfers">

src/webui/scripts/client.js

@@ -129,6 +129,13 @@ window.addEvent('domready', function(){
 // 	ajaxfn.periodical(5000);
 
 	setFilter = function(f) {
+	  // Visually Select the right filter
+	  $("all_filter").removeClass("selectedFilter");
+	  $("downloading_filter").removeClass("selectedFilter");
+	  $("completed_filter").removeClass("selectedFilter");
+	  $("active_filter").removeClass("selectedFilter");
+	  $("inactive_filter").removeClass("selectedFilter");
+	  $(f+"_filter").addClass("selectedFilter");
 	  myTable.setFilter(f);
 	  ajaxfn();
 	}