rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

start mozilla vpn integration

Browse source
This commit is contained in:
luke crouch 2021-02-18 09:07:07 -06:00
parent ff3c31637c
commit 5b8c361c83
9 changed files with 153 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
package.json
View file

@ -2,7 +2,7 @@
"name": "testpilot-containers",
"title": "Multi-Account Containers",
"description": "Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
"version": "8.0.0",
"version": "9.0.0",
"author": "Andrea Marchesini, Luke Crouch and Jonathan Kingston",
"bugs": {
"url": "https://github.com/mozilla/multi-account-containers/issues"
@ -25,7 +25,7 @@
"stylelint": "^13.5.0",
"stylelint-config-standard": "^20.0.0",
"stylelint-order": "^4.0.0",
"web-ext": "^5.4.1",
"web-ext": "^5.5.0",
"webextensions-jsdom": "^1.2.1"
},
"homepage": "https://github.com/mozilla/multi-account-containers#readme",

15
src/css/popup.css
View file

@ -839,6 +839,21 @@ hr {
padding-inline-start: 17px;
}
.mozilla-proxy-btn {
background-color: black;
background-image: url("/img/mozillavpn.png");
background-repeat: no-repeat;
background-size: 2em 2em;
border: 0;
border-radius: 2px;
color: white;
cursor: pointer;
height: 30px;
inline-size: 100%;
line-height: 30px;
text-align: center;
}
.delete-btn {
background-color: rgba(12, 12, 13, 0.1);
border: 0;

BIN
src/img/mozillavpn.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 5 KiB

43
src/js/background/backgroundLogic.js
View file

@ -22,12 +22,51 @@ const backgroundLogic = {
},
async getExtensionInfo() {
const manifestPath = browser.extension.getURL("manifest.json");
const manifestPath = browser.runtime.getURL("manifest.json");
const response = await fetch(manifestPath);
const extensionInfo = await response.json();
return extensionInfo;
},
async getMullvadInfo() {
const amIMullvadPath = "https://am.i.mullvad.net/json";
// TODO: Add some sort of error catching
const mullvadFetchData = await fetch(amIMullvadPath)
.then((response) => response.json())
.then(data => {
return data;
});
return await mullvadFetchData;
},
async getMullvadServers() {
const port = browser.runtime.connectNative("mozillavpnnp");
port.onMessage.addListener(response => {
console.log("Received message: " + JSON.stringify(response));
});
port.postMessage({t: "servers"});
console.log("getMullvadServers");
const mullvadServersPath = "https://stage-vpn.guardian.nonprod.cloudops.mozgcp.net:443/api/v1/vpn/servers";
console.log(`mullvadServersPath: ${mullvadServersPath}`);
const response = await fetch(mullvadServersPath, {
"credentials": "omit",
"headers": {
"Accept": "application/json",
"Accept-Encoding": "gzip, deflate, br",
"Accept-Language": "en-US,en;q=0.5",
"Host": "stage-vpn.guardian.nonprod.cloudops.mozgcp.net",
},
"method": "GET",
"mode": "cors"
});
console.log(`response: ${response}`);
return await response.json();
},
getUserContextIdFromCookieStoreId(cookieStoreId) {
if (!cookieStoreId) {
return false;
@ -376,4 +415,4 @@ const backgroundLogic = {
};
backgroundLogic.init();
backgroundLogic.init();

6
src/js/background/messageHandler.js
View file

@ -106,6 +106,12 @@ const messageHandler = {
return assignManager._setOrRemoveAssignment(tab.id, m.url, m.newUserContextId, m.value);
});
break;
case "getMullvadInfo":
response = await backgroundLogic.getMullvadInfo();
break;
case "getMullvadServers":
response = await backgroundLogic.getMullvadServers();
break;
}
return response;
});

66
src/js/popup.js
View file

@ -29,6 +29,7 @@ const ALWAYS_OPEN_IN_PICKER = "always-open-in";
const P_CONTAINER_INFO = "containerInfo";
const P_CONTAINER_EDIT = "containerEdit";
const P_CONTAINER_DELETE = "containerDelete";
const P_CONTAINER_MOZ_VPN_PROXY = "containerMozVpnProxy";
const P_CONTAINERS_ACHIEVEMENT = "containersAchievement";
const P_CONTAINER_ASSIGNMENTS = "containerAssignments";
@ -41,7 +42,7 @@ function addRemoveSiteIsolation() {
}
async function getExtensionInfo() {
const manifestPath = browser.extension.getURL("manifest.json");
const manifestPath = browser.runtime.getURL("manifest.json");
const response = await fetch(manifestPath);
const extensionInfo = await response.json();
return extensionInfo;
@ -265,9 +266,6 @@ const Logic = {
const panelElement = document.querySelector(this.getPanelSelector(panelItem));
if (!panelElement.classList.contains("hide")) {
panelElement.classList.add("hide");
if ("unregister" in panelItem) {
panelItem.unregister();
}
}
});
const panelEl = document.querySelector(this.getPanelSelector(this._panels[panel]));
@ -665,9 +663,6 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
},
unregister() {
},
// This method is called when the panel is shown.
async prepare() {
const fragment = document.createDocumentFragment();
@ -1463,6 +1458,12 @@ Logic.registerPanel(P_CONTAINER_EDIT, {
Utils.addEnterHandler(deleteButton, () => {
Logic.showPanel(P_CONTAINER_DELETE, identity);
});
const mozillaVpnButton = document.getElementById("mozilla-proxy-button");
Utils.addEnterHandler(mozillaVpnButton, () => {
Logic.showPanel(P_CONTAINER_MOZ_VPN_PROXY, identity);
});
return Promise.resolve(null);
},
@ -1517,6 +1518,57 @@ Logic.registerPanel(P_CONTAINER_DELETE, {
},
});
// P_CONTAINER_MOZ_VPN_PROXY: Choose a Mozilla VPN Proxy node
// ----------------------------------------------------------------------------
Logic.registerPanel(P_CONTAINER_MOZ_VPN_PROXY, {
panelSelector: "#moz-vpn-proxy-panel",
// This method is called when the object is registered.
initialize() {
Utils.addEnterHandler(document.querySelector("#choose-moz-vpn-proxy-cancel-link"), () => {
Logic.showPreviousPanel();
});
Utils.addEnterHandler(document.querySelector("#close-moz-vpn-proxy-panel"), () => {
Logic.showPreviousPanel();
});
Utils.addEnterHandler(document.querySelector("#choose-moz-vpn-proxy-ok-link"), async () => {
try {
alert("assign the proxy to the container here!");
Logic.showPanel(P_CONTAINER_INFO, Logic.currentIdentity());
} catch (e) {
Logic.showPanel(P_CONTAINER_INFO, Logic.currentIdentity());
}
});
},
// This method is called when the panel is shown.
async prepare() {
const serversListEl = document.getElementById("choose-moz-vpn-proxy-server-list");
const promoEl = document.getElementById("choose-moz-vpn-proxy-promo");
const mullvadInfo = await browser.runtime.sendMessage({
method: "getMullvadInfo"
});
console.log(`mullvadInfo: ${mullvadInfo}`);
console.log(`mullvadInfo.mullvad_exit_ip: ${mullvadInfo.mullvad_exit_ip}`);
if (mullvadInfo.mullvad_exit_ip) {
const mullvadServers = await browser.runtime.sendMessage({
method: "getMullvadServers"
});
const serversUl = document.createElement("ul");
for (const country of mullvadServers.countries) {
const serverLi = document.createElement("li");
serverLi.innerHtml = Utils.escaped`${country.name}`;
serversUl.appendChild(serverLi);
}
serversListEl.appendChild(serversUl);
promoEl.classList.add("hide");
serversListEl.classList.remove("hide");
return Promise.resolve(null);
}
}
});
// P_CONTAINERS_ACHIEVEMENT: Page for achievement.
// ----------------------------------------------------------------------------

2
src/js/proxified-containers.js
View file

@ -111,7 +111,7 @@ proxifiedContainers = {
//Parses a proxy description string of the format type://host[:port] or type://username:password@host[:port] (port is optional)
parseProxy(proxy_str) {
const proxyRegexp = /(?<type>(https?)|(socks4?)):\/\/(\b(?<username>\w+):(?<password>\w+)@)?(?<host>((?:\d{1,3}\.){3}\d{1,3}\b)|(\b(\w+)(\.(\w+))+))(:(?<port>\d+))?/;
const proxyRegexp = /(?<type>(https?)|(socks4?)):\/\/(\b(?<username>\w+):(?<password>\w+)@)?(?<host>((?:\d{1,3}\.){3}\d{1,3}\b)|(\b([\w.-]+)(\.([\w.-]+))+))(:(?<port>\d+))?/;
if (proxyRegexp.test(proxy_str) !== true) {
return false;
}

9
src/manifest.json
View file

@ -1,7 +1,7 @@
{
"manifest_version": 2,
"name": "Firefox Multi-Account Containers",
"version": "8.0.0",
"version": "9.0.0",
"incognito": "not_allowed",
"description": "Multi-Account Containers helps you keep all the parts of your online life contained in different tabs. Custom labels and color-coded tabs help keep different activities — like online shopping, travel planning, or checking work email — separate.",
"icons": {
@ -10,7 +10,7 @@
},
"applications": {
"gecko": {
"id": "@testpilot-containers",
"id": "vpn@mozilla.org",
"strict_min_version": "67.0"
}
},
@ -24,11 +24,14 @@
"history",
"idle",
"management",
"nativeMessaging",
"storage",
"tabs",
"webRequestBlocking",
"webRequest",
"proxy"
"proxy",
"https://stage-vpn.guardian.nonprod.cloudops.mozgcp.net:443/*"
],
"optional_permissions": [
"bookmarks"

23
src/popup.html
View file

@ -301,6 +301,7 @@
</fieldset>
<fieldset>
<legend>Proxy (Optional)</legend>
<a class="mozilla-proxy-btn" id="mozilla-proxy-button">Use Mozilla VPN</a>
<input type="text" name="container-proxy" id="edit-container-panel-proxy" maxlength="50" placeholder="type://host:port"/>
</fieldset>
</form>
@ -360,6 +361,28 @@
</div>
</div>
<div class="panel moz-vpn-proxy-panel hide" id="moz-vpn-proxy-panel">
<h3 class="title" id="moz-vpn-proxy-title">
Mozilla VPN Proxies
</h3>
<button class="btn-return arrow-left" id="close-moz-vpn-proxy-panel"></button>
<hr>
<div class="scrollable panel-content choose-moz-vpn-proxy">
<div id="choose-moz-vpn-proxy-server-list" class="hide">
<h4 class="choose-moz-vpn-proxy-title">Select a proxy server</h4>
</div>
<div id="choose-moz-vpn-proxy-promo">
<h4>Mozilla VPN</h4>
<p>You aren't connected to Mozilla VPN.</p>
<p>Connect to <a href="https://vpn.mozilla.org">Mozilla VPN</a> to use its proxy.</p>
</div>
</div>
<div class="panel-footer">
<a href="#" class="button expanded secondary footer-button cancel-button" id="choose-moz-vpn-proxy-cancel-link">Cancel</a>
<a href="#" class="button expanded primary footer-button" id="choose-moz-vpn-proxy-ok-link">OK</a>
</div>
</div>
<script src="js/utils.js"></script>
<script src="js/proxified-containers.js"></script>
<script src="js/popup.js"></script>