Track and show window focus

classic.css

@@ -219,6 +219,13 @@ button.selected {
 	color: white;
 	font-family: 'Segoe UI', sans-serif;
 	font-size: 12px;
+	font-weight: bold;
+}
+.window:not(.focused) .window-titlebar {
+	background: darkgray;
+	background: linear-gradient(to right, #808080 0%, #b3b3b3 100%);
+
+	color: #c0c0c0;
 }
 .window-title {
 	padding-left: 2px;

src/$Window.js

@@ -21,7 +21,24 @@ function $Window(options){
 	if($component){
 		$w.addClass("component-window");
 	}
-
+
+	$w.on("focusin iframe-focusin pointerdown", function(e){
+		if (!$w.hasClass("focused")) {
+			$w.triggerHandler("focus");
+		}
+	});
+	$w.on("focus", function(e){
+		if ($w.is(e.target)) {
+			$(".window.focused").triggerHandler("blur");
+			$w.addClass("focused");
+		}
+	});
+	$w.on("blur", function(e){
+		if ($w.is(e.target)) {
+			$w.removeClass("focused");
+		}
+	});
+
 	$w.attr("touch-action", "none");
 
 	$w.$x.on("click", function(){

src/Task.js

@@ -26,7 +26,6 @@ function Task($win){
 	}
 	$win.on("focus", function(e){
 		if ($win.is(e.target)) {
-			$(".task").removeClass("selected");
 			$task.addClass("selected");
 		}
 	})
@@ -35,10 +34,6 @@ function Task($win){
 			$task.removeClass("selected");
 		}
 	})
-	$win.on("focusin iframe-focusin", function(e){
-		$(".task").removeClass("selected");
-		$win.triggerHandler("focus");
-	});
 	$win.on("close", function(){
 		$task.remove();
 	});

src/programs.js

@@ -245,7 +245,6 @@ function openWinamp(file_path){
 		.then(function(){
 			console.log("Webamp rendered");
 			// TODO: handle blurring for taskbar
-			// also for regular windows - maybe I should do that first!
 
 			// TODO: refactor for less hackiness
 			$fake_win_for_winamp_task = $("#webamp");