Microsoft has acquired GitHub. Decentraleyes has left GitHub. Welcome to its new home!

To participate, please register, or sign in with an existing GitLab.com, Bitbucket, or GitHub account.

Past contributions on GitHub? Be sure to reclaim your Comments, Issues, and Pull Requests.

Refactor popup panel logic

parent 3b941ed0
......@@ -20,233 +20,314 @@
var popup = {};
/**
* Initializations
* Private Methods
*/
document.addEventListener('DOMContentLoaded', function () {
popup._renderContents = function () {
helpers.insertI18nContentIntoDocument(document);
helpers.insertI18nTitlesIntoDocument(document);
popup._renderNonContextualContents();
if (popup._backgroundPage !== null) {
popup._determineTargetTab()
.then(popup._renderContextualContents);
}
};
let version, optionsButtonElement, scriptDirection;
popup._renderNonContextualContents = function () {
version = helpers.formatVersion(chrome.runtime.getManifest().version);
document.getElementById('version-label').innerText = version;
let versionLabelElement, counterElement, testingUtilityLinkElement, optionsButtonElement;
scriptDirection = helpers.determineScriptDirection(navigator.language);
versionLabelElement = document.getElementById('version-label');
counterElement = document.getElementById('injection-counter');
testingUtilityLinkElement = document.getElementById('testing-utility-link');
optionsButtonElement = document.getElementById('options-button');
helpers.insertI18nContentIntoDocument(document);
helpers.insertI18nTitlesIntoDocument(document);
versionLabelElement.innerText = popup._version;
counterElement.innerText = popup._amountInjected;
chrome.storage.local.get('amountInjected', function (items) {
testingUtilityLinkElement.addEventListener('mouseup', popup._onTestingUtilityLinkClicked);
optionsButtonElement.addEventListener('mouseup', popup._onOptionsButtonClicked);
};
let amountInjected = items.amountInjected || 0;
document.getElementById('injection-counter').innerText = amountInjected;
popup._renderContextualContents = function () {
chrome.tabs.query({'active': true, 'currentWindow': true}, function (tabs) {
let injections, groupedInjections;
popup._domain = helpers.extractDomainFromUrl(popup._targetTab.url);
popup._requestAnalyzer = popup._backgroundPage.requestAnalyzer;
popup._stateManager = popup._backgroundPage.stateManager;
if (popup._domain !== null) {
popup._domain = helpers.normalizeDomain(popup._domain);
popup._renderDomainWhitelistPanel();
}
chrome.runtime.getBackgroundPage(function (backgroundPage) {
injections = popup._stateManager.tabs[popup._targetTab.id].injections;
groupedInjections = popup._groupResourceInjections(injections);
if (backgroundPage === null) {
return;
}
if (Object.keys(groupedInjections).length > 0) {
popup._renderInjectionPanel(groupedInjections);
}
};
popup.backgroundPage = backgroundPage;
popup._renderDomainWhitelistPanel = function () {
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
let websiteContextElement, protectionToggleElement, domainIndicatorElement;
browser.tabs.getCurrent().then(function (tab) {
websiteContextElement = document.getElementById('website-context');
protectionToggleElement = document.getElementById('protection-toggle-button');
domainIndicatorElement = document.getElementById('domain-indicator');
browser.tabs.update(tab.id, {
'active': true
});
});
}
protectionToggleElement.setAttribute('dir', popup._scriptDirection);
domainIndicatorElement.innerText = popup._domain;
let injections, injectionOverview, domain;
if (popup._requestAnalyzer.whitelistedDomains[popup._domain]) {
injections = backgroundPage.stateManager.tabs[tabs[0].id].injections;
injectionOverview = {};
let enableProtectionTitle = chrome.i18n.getMessage('enableProtectionTitle');
domain = helpers.extractDomainFromUrl(tabs[0].url);
protectionToggleElement.setAttribute('class', 'button button-toggle');
protectionToggleElement.addEventListener('click', popup._enableProtection);
protectionToggleElement.setAttribute('title', enableProtectionTitle);
if (domain !== null) {
} else {
let websiteContextElement, protectionToggleElement, domainIndicatorElement;
let disableProtectionTitle = chrome.i18n.getMessage('disableProtectionTitle');
websiteContextElement = document.getElementById('website-context');
protectionToggleElement = document.getElementById('protection-toggle-button');
domainIndicatorElement = document.getElementById('domain-indicator');
protectionToggleElement.setAttribute('class', 'button button-toggle active');
protectionToggleElement.addEventListener('click', popup._disableProtection);
protectionToggleElement.setAttribute('title', disableProtectionTitle);
}
if (domain.startsWith(Address.WWW_PREFIX)) {
domain = domain.slice(Address.WWW_PREFIX_LENGTH);
}
websiteContextElement.setAttribute('class', 'panel');
};
domainIndicatorElement.innerText = domain;
popup._renderInjectionPanel = function (groupedInjections) {
if (backgroundPage.requestAnalyzer.whitelistedDomains[domain]) {
let websiteContextElement, injectionOverviewElement;
protectionToggleElement.setAttribute('class', 'button button-toggle');
websiteContextElement = document.getElementById('website-context');
injectionOverviewElement = popup._createInjectionOverviewElement(groupedInjections);
let enableProtectionTitle = chrome.i18n.getMessage('enableProtectionTitle');
protectionToggleElement.setAttribute('title', enableProtectionTitle);
websiteContextElement.append(injectionOverviewElement);
};
protectionToggleElement.addEventListener('click', function () {
popup._enableProtection = function () {
backgroundPage.stateManager.deleteDomainFromWhitelist(domain).then(function () {
popup._stateManager.deleteDomainFromWhitelist(popup._domain)
.then(popup._onProtectionToggled);
};
chrome.tabs.reload(tabs[0].id);
popup._disableProtection = function () {
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
popup._stateManager.addDomainToWhitelist(popup._domain)
.then(popup._onProtectionToggled);
};
return browser.tabs.getCurrent().then(function (tab) {
browser.tabs.remove(tab.id);
});
}
popup._determineBackgroundPage = function () {
return window.close();
});
});
return new Promise((resolve) => {
} else {
chrome.runtime.getBackgroundPage(function (backgroundPage) {
protectionToggleElement.setAttribute('class', 'button button-toggle active');
popup._backgroundPage = backgroundPage;
resolve();
});
});
};
let disableProtectionTitle = chrome.i18n.getMessage('disableProtectionTitle');
popup._determineTargetTab = function () {
protectionToggleElement.setAttribute('title', disableProtectionTitle);
protectionToggleElement.setAttribute('dir', scriptDirection);
return new Promise((resolve) => {
protectionToggleElement.addEventListener('click', function () {
chrome.tabs.query({'active': true, 'currentWindow': true}, function (tabs) {
backgroundPage.stateManager.addDomainToWhitelist(domain).then(function () {
popup._targetTab = tabs[0];
resolve();
});
});
};
popup._determineAmountInjected = function () {
chrome.tabs.reload(tabs[0].id);
return new Promise((resolve) => {
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
chrome.storage.local.get('amountInjected', function (items) {
return browser.tabs.getCurrent().then(function (tab) {
browser.tabs.remove(tab.id);
});
}
popup._amountInjected = items.amountInjected || 0;
resolve();
});
});
};
return window.close();
});
});
}
popup._groupResourceInjections = function (injections) {
websiteContextElement.setAttribute('class', 'panel');
}
let groupedInjections = {};
for (let injection in injections) {
for (let index in injections) {
injection = injections[injection];
let {source} = injections[index];
let injectionSource = injection.source;
injectionOverview[injectionSource] = injectionOverview[injectionSource] || [];
groupedInjections[source] = groupedInjections[source] || [];
groupedInjections[source].push(injections[index]);
}
injectionOverview[injectionSource].push({
'path': injection.path,
'version': injection.version,
'source': injection.source
});
}
return groupedInjections;
};
let listElement = document.createElement('ul');
listElement.setAttribute('class', 'list');
popup._createInjectionOverviewElement = function (groupedInjections) {
for (let injectionSource in injectionOverview) {
let injectionOverviewElement = document.createElement('ul');
injectionOverviewElement.setAttribute('class', 'list');
let cdn, listItemElement, badgeElement, badgeTextNode, cdnName, cdnNameTextNode, subListElement;
for (let source in groupedInjections) {
cdn = injectionOverview[injectionSource];
let injectionGroupHeaderElement, injectionGroupElement, cdn;
listItemElement = document.createElement('li');
listItemElement.setAttribute('class', 'list-item');
cdn = groupedInjections[source];
badgeElement = document.createElement('span');
badgeElement.setAttribute('class', 'badge');
injectionGroupHeaderElement = popup._createInjectionGroupHeaderElement(source, cdn);
injectionGroupElement = popup._createInjectionGroupElement(source, cdn);
badgeTextNode = document.createTextNode(cdn.length);
badgeElement.appendChild(badgeTextNode);
injectionOverviewElement.appendChild(injectionGroupHeaderElement);
injectionOverviewElement.appendChild(injectionGroupElement);
}
cdnName = helpers.determineCdnName(injectionSource);
return injectionOverviewElement;
};
cdnNameTextNode = document.createTextNode(cdnName);
popup._createInjectionGroupHeaderElement = function (source, cdn) {
listItemElement.appendChild(badgeElement);
listItemElement.appendChild(cdnNameTextNode);
let injectionGroupHeaderElement, badgeElement, badgeTextNode, cdnNameTextNode;
listElement.appendChild(listItemElement);
injectionGroupHeaderElement = document.createElement('li');
injectionGroupHeaderElement.setAttribute('class', 'list-item');
subListElement = document.createElement('ul');
subListElement.setAttribute('class', 'sublist');
badgeElement = document.createElement('span');
badgeElement.setAttribute('class', 'badge');
listElement.appendChild(subListElement);
badgeTextNode = document.createTextNode(cdn.length);
badgeElement.appendChild(badgeTextNode);
for (let injection of cdn) {
cdnNameTextNode = document.createTextNode(helpers.determineCdnName(source));
let subListItemElement, resourcePathDetails, resourceFilename, resourceName,
resourceNameTextNode, sideNoteElement, sideNoteTextNode;
injectionGroupHeaderElement.appendChild(badgeElement);
injectionGroupHeaderElement.appendChild(cdnNameTextNode);
subListItemElement = document.createElement('li');
subListItemElement.setAttribute('class', 'sublist-item');
return injectionGroupHeaderElement;
};
resourcePathDetails = injection.path.split('/');
resourceFilename = resourcePathDetails[resourcePathDetails.length - 1];
popup._createInjectionGroupElement = function (source, cdn) {
resourceName = helpers.determineResourceName(resourceFilename);
let injectionGroupElement;
resourceNameTextNode = document.createTextNode(`- ${resourceName}`);
subListItemElement.appendChild(resourceNameTextNode);
injectionGroupElement = document.createElement('ul');
injectionGroupElement.setAttribute('class', 'sublist');
sideNoteElement = document.createElement('span');
sideNoteElement.setAttribute('class', 'side-note');
for (let injection of cdn) {
sideNoteTextNode = document.createTextNode(` v${injection.version}`);
let injectionElement = popup._createInjectionElement(injection);
injectionGroupElement.appendChild(injectionElement);
}
sideNoteElement.appendChild(sideNoteTextNode);
subListItemElement.appendChild(sideNoteElement);
return injectionGroupElement;
};
subListElement.appendChild(subListItemElement);
}
}
popup._createInjectionElement = function (injection) {
if (Object.keys(injectionOverview).length > 0) {
let injectionElement, filename, name, nameTextNode, noteElement, noteTextNode;
let websiteContextElement = document.getElementById('website-context');
websiteContextElement.append(listElement);
}
});
});
});
injectionElement = document.createElement('li');
injectionElement.setAttribute('class', 'sublist-item');
chrome.runtime.getPlatformInfo(function (information) {
filename = helpers.extractFilenameFromPath(injection.path);
name = helpers.determineResourceName(filename);
optionsButtonElement.addEventListener('mouseup', function () {
nameTextNode = document.createTextNode(`- ${name}`);
injectionElement.appendChild(nameTextNode);
if (information.os === chrome.runtime.PlatformOs.ANDROID) {
noteElement = document.createElement('span');
noteElement.setAttribute('class', 'side-note');
return chrome.tabs.create({
'url': chrome.extension.getURL('pages/options/options.html')
});
}
noteTextNode = document.createTextNode(` v${injection.version}`);
chrome.runtime.openOptionsPage();
return window.close();
});
});
noteElement.appendChild(noteTextNode);
injectionElement.appendChild(noteElement);
document.getElementById('testing-utility-link').addEventListener('mouseup', function (event) {
return injectionElement;
};
if (event.button === 0 || event.button === 1) {
popup._close = function () {
chrome.tabs.create({
'url': 'https://decentraleyes.org/test',
'active': (event.button === 0)
chrome.runtime.getPlatformInfo(function (information) {
if (information.os === chrome.runtime.PlatformOs.ANDROID) {
chrome.tabs.getCurrent(function (tab) {
chrome.tabs.remove(tab.id);
});
}
if (event.button === 0) {
} else {
window.close();
}
});
});
};
/**
* Event Handlers
*/
popup._onDocumentLoaded = function () {
let manifest, language;
manifest = chrome.runtime.getManifest();
language = navigator.language;
popup._version = helpers.formatVersion(manifest.version);
popup._scriptDirection = helpers.determineScriptDirection(language);
popup._determineBackgroundPage()
.then(popup._determineAmountInjected)
.then(popup._renderContents);
};
popup._onTestingUtilityLinkClicked = function (event) {
if (event.button === 0 || event.button === 1) {
chrome.tabs.create({
'url': 'https://decentraleyes.org/test',
'active': (event.button === 0)
});
}
if (event.button === 0) {
window.close();
}
};
popup._onOptionsButtonClicked = function () {
chrome.runtime.openOptionsPage();
return window.close();
};
popup._onProtectionToggled = function () {
let bypassCache = (typeof browser === 'undefined');
chrome.tabs.reload(popup._targetTab.id, {bypassCache});
popup._close();
};
/**
* Initializations
*/
document.addEventListener('DOMContentLoaded', popup._onDocumentLoaded);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment