Merge pull request #4 from WesleyBranton/Version-2.0

Confirmed working.

README.md

@@ -15,3 +15,6 @@ To develop and test the extension, you need to open the "about:debugging" page i
 Further documentation about developing Firefox extensions can be found [here](https://developer.mozilla.org/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension).
 
 ## Release Notes
+### Version 2.0
+* **[NEW]** Added support for outlook.office.com
+* **[FIXED]** Message prefill data is no longer lost at login page

firefox/background.js

@@ -0,0 +1,47 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+// Verify setting validity
+function verify(info) {
+	if (info.mode != 'ask' && info.mode != 'live' && info.mode != 'office') {
+		browser.storage.local.set({mode: 'ask'});
+	}
+}
+
+// Handle tab that will lose parameters
+function handleIncomplete(tabId, changeInfo, tabInfo) {
+	removeHandlers();
+	browser.tabs.update(tabInfo.id,{url:tmpUrl});
+	tmpUrl = null;
+}
+
+// Handle tab that will not lose parameters
+function handleComplete(tabId, changeInfo, tabInfo) {
+	console.log("Running");
+	removeHandlers();
+}
+
+// Remove tab handlers
+function removeHandlers() {
+	browser.tabs.onUpdated.removeListener(handleIncomplete);
+	browser.tabs.onUpdated.removeListener(handleComplete);
+}
+
+// Message handler
+function listenMessage(message) {
+	if (message.code == 'create-handler') {
+		// Create required handlers
+		browser.tabs.onUpdated.addListener(handleIncomplete, filter);
+		tmpUrl = message.msg[0];
+		var redirect = tmpUrl.slice(0,tmpUrl.indexOf("/compose?to="));
+		browser.tabs.onUpdated.addListener(handleComplete, {urls:[redirect + message.msg[1]]});
+	}
+}
+
+let data = browser.storage.local.get();
+data.then(verify);
+var tmpUrl;
+const filter = {urls:["*://outlook.live.com/mail/deeplink/compose",
+	"*://outlook.office.com/mail/deeplink/compose"]};
+chrome.runtime.onMessage.addListener(listenMessage);

firefox/handler/script.js

@@ -0,0 +1,64 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+// Converts Firefox mailto string into standard URL parameters
+function createURL() {
+	var decodedURL, to, formatURL;
+	decodedURL = decodeURIComponent(window.location);
+	decodedURL = decodedURL.slice(decodedURL.indexOf("mailto") + 7);
+	if (decodedURL.indexOf("?") >= 0) {
+		to = decodedURL.slice(0,decodedURL.indexOf("?"));
+		decodedURL = decodedURL.slice(decodedURL.indexOf("?") + 1);
+		formatURL = "?to=" + to + "&" + decodedURL;
+	} else {
+		to = decodedURL;
+		formatURL = "?to=" + to;
+	}
+	return formatURL;
+}
+
+// Load email composition page
+function redirect(mode) {
+	var parameters = createURL();
+	var url = "https://outlook." + mode + ".com/mail/deeplink/compose" + parameters;
+	if (!wait) {
+		if (document.getElementById('doNotAsk').checked) {
+			browser.storage.local.set({'mode': mode});
+		}
+	}
+	chrome.runtime.sendMessage({'code':'create-handler','msg':[url,parameters]});
+	window.location.replace(url);
+}
+
+// Automatically load if user selected "Do not ask again"
+function loaded(info) {
+	if (info.mode == 'live' || info.mode == 'office') {
+		wait = true;
+		redirect(info.mode);
+	} else {
+		wait = false;
+		refreshUI();
+	}
+}
+
+// Refresh UI
+function refreshUI() {
+	if (document.getElementById('loading') && document.getElementById('choose')) {
+		document.getElementById('loading').className = 'hide';
+		document.getElementById('choose').className = '';
+	}
+}
+
+var wait = true;
+let data = browser.storage.local.get();
+data.then(loaded);
+
+// Load button click events
+window.onload = function(){
+	document.getElementById("live").addEventListener("click", function(){redirect('live')});
+	document.getElementById("office").addEventListener("click", function(){redirect('office')});
+	if (!wait) {
+		refreshUI();
+	}
+};

firefox/handler/sendmail.html

@@ -0,0 +1,32 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at https://mozilla.org/MPL/2.0/. -->
+
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Select Outlook.com version</title>
+		<meta charset="utf-8"/>
+		<link rel="icon" type="image/png" href="../icons/icon-96.png">
+		<link rel="stylesheet" href="style.css"/>
+		<script src="script.js"></script>
+	</head>
+	<body>
+		<div class="spacer"></div>
+		<div id="choose" class="hide">
+			<h1>Which version of Outlook.com would you like to use?</h1>
+			<button id="live">Personal</button>
+			<br>
+			<button id="office">Organization</button>
+			<br>
+			<label class="checkbox" for="doNotAsk">Do not ask me again
+				<input type="checkbox" name="doNotAsk" id="doNotAsk">
+				<span class="checkmark"></span>
+			</label>
+		</div>
+		<div id="loading">
+			<h1>Loading...</h1>
+		</div>
+		<div class="spacer"></div>
+	</body>
+</html>

firefox/handler/style.css

@@ -0,0 +1,98 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+/* Body settings */
+body {
+	font-family:sans-serif;
+	margin:0px;
+	padding:0px;
+	text-align:center;
+	display:flex;
+	flex-direction:column;
+	min-height:100vh;
+	color:#1D1D1D;
+}
+
+/* Vertically center menu */
+.spacer {
+	flex:1;
+}
+
+/* Hidden element */
+.hide {
+	display:none;
+}
+
+/* Button template */
+button {
+	display:inline-block;
+	font-size:130%;
+	font-weight:bold;
+	text-decoration:none;
+	border:none;
+	border-radius:100px;
+	box-sizing:border-box;
+	padding:10px 40px;
+	margin:2px 0px;
+	text-transform:uppercase;
+	cursor:pointer;
+	transition:ease all 0.5s;
+	box-shadow:0 2px 4px 2px hsla(0,0%,0%,0.08);
+	color:white;
+	background-color:#0080FF;
+	background-image:linear-gradient(#0080FF,#0066CC);
+}
+
+/* Button hover effect */
+button:hover {
+	filter:brightness(80%);
+}
+
+/* Checkbox container */
+.checkbox {
+	display:inline-block;
+	position:relative;
+	padding-left:35px;
+	margin:10px 0px;
+	cursor:pointer;
+	font-size:22px;
+}
+
+/* Hide default checkbox */
+.checkbox input {
+	position:absolute;
+	opacity:0;
+	height:0;
+	width:0;
+}
+
+/* Custom checkbox */
+.checkmark {
+	position:absolute;
+	top:0;
+	left:0;
+	height:25px;
+	width:25px;
+	background-color:#EEEEEE;
+	border-radius:5px;
+}
+
+/* Checked background */
+.checkbox input:checked ~ .checkmark {
+	background-color: #40BF40;
+}
+
+/* Show the checkmark when checked */
+.checkbox input:checked ~ .checkmark:after {
+	display:block;
+	content:"";
+	position:absolute;
+	left:9px;
+	top:5px;
+	width:5px;
+	height:10px;
+	border:solid white;
+	border-width:0 3px 3px 0;
+	transform:rotate(45deg);
+}

firefox/manifest.json

@@ -1,7 +1,7 @@
 {
 	"manifest_version": 2,
 	"name": "Outlook.com mailto",
-	"version": "1.0",
+	"version": "2.0",
 	"description": "Add Outlook.com as a default email provider for all mailto links.",
 	"author": "Wesley Branton",
 
@@ -16,6 +16,10 @@
 		"64": "icons/icon-64.png",
 		"96": "icons/icon-96.png"
 	},
+
+	"options_ui": {
+		"page": "options/options.html"
+	},
 
 	"browser_specific_settings": {
 		"gecko": {
@@ -27,6 +31,12 @@
 	"protocol_handlers": [{
 		"protocol": "mailto",
 		"name": "Outlook.com",
-		"uriTemplate": "https://outlook.live.com/mail/deeplink/compose?to=%s"
-	}]
+		"uriTemplate": "/handler/sendmail.html?to=%s"
+	}],
+
+	"background": {
+			"scripts": ["background.js"]
+	},
+
+	"permissions": ["storage","tabs"]
 }

firefox/options/options.html

@@ -0,0 +1,26 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at https://mozilla.org/MPL/2.0/. -->
+
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8"/>
+		<link rel="stylesheet" href="style.css"/>
+	</head>
+	<body>
+		<form>
+			<fieldset>
+				<legend>Settings</legend>
+				<label for="mode">Preferred Outlook.com Version: </label>
+				<select name="mode" id="mode">
+					<option value="ask" selected>Always ask me</option>
+					<option value="live">Personal</option>
+					<option value="office">Organization</option>
+				</select>
+				<a href="https://github.com/WesleyBranton/Outlook.com-mailto/wiki/Which-Outlook.com-version-do-I-choose%3F" target="_blank">Learn More</a>
+			</fieldset>
+		</form>
+		<script src="script.js"></script>
+	</body>
+</html>

firefox/options/script.js

@@ -0,0 +1,22 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+// Load settings
+function restore(setting) {
+	if (setting.mode != 'live' && setting.mode != 'office') {
+		settingMode.value = 'ask';
+	} else {
+		settingMode.value = setting.mode;
+	}
+}
+
+// Save settings
+function save() {
+	browser.storage.local.set({mode: settingMode.value});
+}
+
+var settingMode = document.getElementById('mode');
+let data = browser.storage.local.get();
+data.then(restore);
+document.getElementsByTagName("form")[0].addEventListener("change", save);

firefox/options/style.css

@@ -0,0 +1,36 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+/* Font declaration */
+* {
+	font-family: sans-serif;
+}
+
+/* Options section */
+fieldset {
+	border: 2px solid #47AAD5;
+	border-radius: 5px;
+}
+
+/* Options section title */
+legend {
+	padding:5px 10px;
+	font-size:14pt;
+	border:none;
+	margin: 0px 0px 5px 0px;
+	border-radius: 10px;
+	font-size: 20px;
+	color: #FFF;
+	text-decoration: none;
+	transition: all 0.1s;
+	box-sizing:border-box;
+	background-color: #47AAD5;
+	border-bottom: 5px solid #0085A6;
+	text-shadow: 0px -2px #0085A6;
+}
+
+/* Help link */
+a {
+	cursor:help;
+}