Added HistoryState type redirect

6 files changed, 89 insertions, 38 deletions

diff --git a/css/popup.css b/css/popup.css
index 4f85357..c8556d8 100644
--- a/css/popup.css
+++ b/css/popup.css
@@ -48,6 +48,17 @@ label {
     }
 }
 
+button {
+	border: solid 1px #aaa !important;
+	color: #333;
+	height: 20px;
+	border-radius: 3px;
+}
+
+label span {
+	position: relative;
+	top: 1px;
+}
 
 @media (prefers-color-scheme: dark) {
 
@@ -75,6 +86,6 @@ label {
 	button {
 		background-color: rgb(32,33,36) !important;
 		border: solid 1px #777 !important;
-		color: #eee;
+		color: #ddd;
 	  }
   }
diff --git a/js/background.js b/js/background.js
index 30bd6e0..fbf2572 100644
--- a/js/background.js
+++ b/js/background.js
@@ -9,6 +9,11 @@ function log(msg, force) {
 log.enabled = false;
 var enableNotifications=false;
 
+function isDarkMode() {
+	return window.matchMedia('(prefers-color-scheme: dark)').matches;
+}
+var isFirefox = !!navigator.userAgent.match(/Firefox/i);
+
 var storageArea = chrome.storage.local;
 //Redirects partitioned by request type, so we have to run through
 //the minimum number of redirects for each request.
@@ -116,6 +121,7 @@ function monitorChanges(changes, namespace) {
 		if (changes.disabled.newValue == true) {
 			log('Disabling Redirector, removing listener');
 			chrome.webRequest.onBeforeRequest.removeListener(checkRedirects);
+			chrome.webNavigation.onHistoryStateUpdated.removeListener(checkHistoryStateRedirects);
 		} else {
 			log('Enabling Redirector, setting up listener');
 			setUpRedirectListener();
@@ -184,6 +190,7 @@ function createPartitionedRedirects(redirects) {
 function setUpRedirectListener() {
 
 	chrome.webRequest.onBeforeRequest.removeListener(checkRedirects); //Unsubscribe first, in case there are changes...
+	chrome.webNavigation.onHistoryStateUpdated.removeListener(checkHistoryStateRedirects);
 
 	storageArea.get({redirects:[]}, function(obj) {
 		var redirects = obj.redirects;
@@ -197,15 +204,40 @@ function setUpRedirectListener() {
 
 		log('Setting filter for listener: ' + JSON.stringify(filter));
 		chrome.webRequest.onBeforeRequest.addListener(checkRedirects, filter, ["blocking"]);
+
+		if (partitionedRedirects.history) {
+			log('Adding HistoryState Listener');
+
+			let filter = { url : []};
+			for (let r of partitionedRedirects.history) {
+				filter.url.push({urlMatches: r._preparePattern(r.includePattern)});
+			}
+			chrome.webNavigation.onHistoryStateUpdated.addListener(checkHistoryStateRedirects, filter);
+		}
 	});
 }
 
+//Redirect urls on places like Facebook and Twitter who don't do real reloads, only do ajax updates and push a new url to the address bar...
+function checkHistoryStateRedirects(ev) {
+	ev.type = 'history';
+	ev.method = 'GET';
+	let result = checkRedirects(ev);
+	if (result.redirectUrl) {
+		chrome.tabs.update(ev.tabId, {url: result.redirectUrl});
+	}
+}
+
+//Sets on/off badge, and for Chrome updates dark/light mode icon
 function updateIcon() {
 	chrome.storage.local.get({disabled:false}, function(obj) {
-		if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
-			setIcon('icon-dark-theme');
-		} else {
-			setIcon('icon-light-theme');
+
+		//Do this here so even in Chrome we get the icon not too long after an dark/light mode switch...
+		if (!isFirefox) {
+			if (isDarkMode()) {
+				setIcon('icon-dark-theme');
+			} else {
+				setIcon('icon-light-theme');
+			}
 		}
 
 		if (obj.disabled) {
@@ -215,7 +247,11 @@ function updateIcon() {
 				chrome.browserAction.setBadgeTextColor({color: '#fafafa'});
 			}
 		} else {
-			chrome.browserAction.setBadgeText({text: ''});
+			chrome.browserAction.setBadgeText({text: 'on'});
+			chrome.browserAction.setBadgeBackgroundColor({color: '#35b44a'});
+			if (chrome.browserAction.setBadgeTextColor) { //Not supported in Chrome
+				chrome.browserAction.setBadgeTextColor({color: '#fafafa'});
+			}
 		}
 	});	
 }
@@ -376,7 +412,8 @@ function setupInitial() {
 	});
 }
 log('Redirector starting up...');
-	
+
+
 // Below is a feature request by an user who wished to see visual indication for an Redirect rule being applied on URL 
 // https://github.com/einaregilsson/Redirector/issues/72
 // By default, we will have it as false. If user wishes to enable it from settings page, we can make it true until user disables it (or browser is restarted)
@@ -392,24 +429,28 @@ function sendNotifications(redirect, originalUrl, redirectedUrl ){
 	// So let's use useragent. 
 	// Opera UA has both chrome and OPR. So check against that ( Only chrome which supports list) - other browsers to get BASIC type notifications.
 
+	let icon = isDarkMode() ? "images/icon-dark-theme-48.png": "images/icon-light-theme-48.png";
+
 	if(navigator.userAgent.toLowerCase().indexOf("chrome") > -1 && navigator.userAgent.toLowerCase().indexOf("opr")<0){
-		var items = [{title:"Original page: ", message: originalUrl},{title:"Redirected to: ",message:redirectedUrl}];
+		
+		var items = [{title:"Original page: ", message: originalUrl},{title:"Redirected to: ",message: redirectedUrl}];
 		var head = "Redirector - Applied rule : " + redirect.description;
 		chrome.notifications.create({
-			"type": "list",
-			"items": items,
-			"title": head,
-			"message": head,
-			"iconUrl": "images/icon-dark-38.png"
-		  });	}
+			type : "list",
+			items : items,
+			title : head,
+			message : head,
+			iconUrl : icon
+		  });	
+		}
 	else{
 		var message = "Applied rule : " + redirect.description + " and redirected original page " + originalUrl + " to " + redirectedUrl;
 
 		chrome.notifications.create({
-        	"type": "basic",
-        	"title": "Redirector",
-			"message": message,
-			"iconUrl": "images/icon-dark-38.png"
+        	type : "basic",
+        	title : "Redirector",
+			message : message,
+			iconUrl : icon
 		});
 	}
 }
@@ -422,8 +463,4 @@ function handleStartup(){
 	});
 
 	updateIcon(); //To set dark/light icon...
-	let mql = window.matchMedia('(prefers-color-scheme: dark)');
-	mql.addEventListener('change', function(e) {
-		console.log('IT CHANGED ' + e.matches);
-	});
 }
\ No newline at end of file
diff --git a/js/redirect.js b/js/redirect.js
index dfc59aa..23ae409 100644
--- a/js/redirect.js
+++ b/js/redirect.js
@@ -21,6 +21,7 @@ Redirect.requestTypes = {
 	imageset: "Responsive Images in Firefox",
 	object : "Objects (e.g. Flash videos, Java applets)",
 	xmlhttprequest : "XMLHttpRequests (Ajax)",
+	history : "HistoryState",
 	other : "Other"
 };
 
diff --git a/manifest.json b/manifest.json
index 560d4c8..65adf92 100644
--- a/manifest.json
+++ b/manifest.json
@@ -15,6 +15,7 @@
   "permissions": [
     "webRequest",
     "webRequestBlocking",
+    "webNavigation",
     "storage",
     "tabs",
     "http://*/*",
@@ -51,38 +52,38 @@
     "default_popup": "popup.html",
     "theme_icons": [
       {
-        "light": "images/icon-light-theme-16.png",
-        "dark": "images/icon-dark-theme-16.png",
+        "dark": "images/icon-light-theme-16.png",
+        "light": "images/icon-dark-theme-16.png",
         "size": 16
       },
       {
-        "light": "images/icon-light-theme-19.png",
-        "dark": "images/icon-dark-theme-19.png",
+        "dark": "images/icon-light-theme-19.png",
+        "light": "images/icon-dark-theme-19.png",
         "size": 19
       },
       {
-        "light": "images/icon-light-theme-32.png",
-        "dark": "images/icon-dark-theme-32.png",
+        "dark": "images/icon-light-theme-32.png",
+        "light": "images/icon-dark-theme-32.png",
         "size": 32
       },
       {
-        "light": "images/icon-light-theme-38.png",
-        "dark": "images/icon-dark-theme-38.png",
+        "dark": "images/icon-light-theme-38.png",
+        "light": "images/icon-dark-theme-38.png",
         "size": 38
       },
       {
-        "light": "images/icon-light-theme-48.png",
-        "dark": "images/icon-dark-theme-48.png",
+        "dark": "images/icon-light-theme-48.png",
+        "light": "images/icon-dark-theme-48.png",
         "size": 48
       },
       {
-        "light": "images/icon-light-theme-64.png",
-        "dark": "images/icon-dark-theme-64.png",
+        "dark": "images/icon-light-theme-64.png",
+        "light": "images/icon-dark-theme-64.png",
         "size": 64
       },
       {
-        "light": "images/icon-light-theme-128.png",
-        "dark": "images/icon-dark-theme-128.png",
+        "dark": "images/icon-light-theme-128.png",
+        "light": "images/icon-dark-theme-128.png",
         "size": 128
       }
     ]
diff --git a/popup.html b/popup.html
index 1eba021..8feede0 100644
--- a/popup.html
+++ b/popup.html
@@ -10,8 +10,8 @@
 		<div class="disabled"><span data-show="disabled" style="display: none;">Disabled</span></div>
 		<button id="toggle-disabled"><span data-show="disabled" style="display:none">Enable Redirector</span><span data-show="!disabled">Disable Redirector</span></button>
         <button id="open-redirector-settings">Edit Redirects</button>
-		<label><input id="enable-logging" type="checkbox" data-bind="logging" /> Enable logging</label>
-		<label><input id="enable-notifications" type="checkbox" data-bind="enableNotifications" /> Enable notifications</label>
+		<label><input id="enable-logging" type="checkbox" data-bind="logging" /> <span>Enable logging</span></label>
+		<label><input id="enable-notifications" type="checkbox" data-bind="enableNotifications" /> <span>Enable notifications</span></label>
 		<script src="js/stub.js"></script>
 		<script src="js/util.js"></script>
 		<script src="js/popup.js"></script>
diff --git a/redirector.html b/redirector.html
index 46fda66..af11b6b 100644
--- a/redirector.html
+++ b/redirector.html
@@ -111,6 +111,7 @@
 						<label><input type="checkbox" value="imageset"><span>Responsive Images in Firefox</span></label>
 						<label><input type="checkbox" value="object"><span>Objects (e.g. Flash videos, Java applets)</span></label>
 						<label><input type="checkbox" value="xmlhttprequest"><span>XMLHttpRequests (Ajax)</span></label>
+						<label><input type="checkbox" value="history"><span>HistoryState</span></label>
 						<label><input type="checkbox" value="other"><span>Other</span></label>
 					</div>
 				</div>