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,55 +20,63 @@
var popup = {};
/**
* Initializations
* Private Methods
*/
document.addEventListener('DOMContentLoaded', function () {
popup._renderContents = function () {
let version, optionsButtonElement, scriptDirection;
helpers.insertI18nContentIntoDocument(document);
helpers.insertI18nTitlesIntoDocument(document);
version = helpers.formatVersion(chrome.runtime.getManifest().version);
document.getElementById('version-label').innerText = version;
popup._renderNonContextualContents();
scriptDirection = helpers.determineScriptDirection(navigator.language);
optionsButtonElement = document.getElementById('options-button');
if (popup._backgroundPage !== null) {
helpers.insertI18nContentIntoDocument(document);
helpers.insertI18nTitlesIntoDocument(document);
popup._determineTargetTab()
.then(popup._renderContextualContents);
}
};
chrome.storage.local.get('amountInjected', function (items) {
popup._renderNonContextualContents = function () {
let amountInjected = items.amountInjected || 0;
document.getElementById('injection-counter').innerText = amountInjected;
let versionLabelElement, counterElement, testingUtilityLinkElement, optionsButtonElement;
chrome.tabs.query({'active': true, 'currentWindow': true}, function (tabs) {
versionLabelElement = document.getElementById('version-label');
counterElement = document.getElementById('injection-counter');
testingUtilityLinkElement = document.getElementById('testing-utility-link');
optionsButtonElement = document.getElementById('options-button');
chrome.runtime.getBackgroundPage(function (backgroundPage) {
versionLabelElement.innerText = popup._version;
counterElement.innerText = popup._amountInjected;
if (backgroundPage === null) {
return;
}
testingUtilityLinkElement.addEventListener('mouseup', popup._onTestingUtilityLinkClicked);
optionsButtonElement.addEventListener('mouseup', popup._onOptionsButtonClicked);
};
popup.backgroundPage = backgroundPage;
popup._renderContextualContents = function () {
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
let injections, groupedInjections;
browser.tabs.getCurrent().then(function (tab) {
popup._domain = helpers.extractDomainFromUrl(popup._targetTab.url);
browser.tabs.update(tab.id, {
'active': true
});
});
}
popup._requestAnalyzer = popup._backgroundPage.requestAnalyzer;
popup._stateManager = popup._backgroundPage.stateManager;
let injections, injectionOverview, domain;
if (popup._domain !== null) {
injections = backgroundPage.stateManager.tabs[tabs[0].id].injections;
injectionOverview = {};
popup._domain = helpers.normalizeDomain(popup._domain);
popup._renderDomainWhitelistPanel();
}
domain = helpers.extractDomainFromUrl(tabs[0].url);
injections = popup._stateManager.tabs[popup._targetTab.id].injections;
groupedInjections = popup._groupResourceInjections(injections);
if (domain !== null) {
if (Object.keys(groupedInjections).length > 0) {
popup._renderInjectionPanel(groupedInjections);
}
};
popup._renderDomainWhitelistPanel = function () {
let websiteContextElement, protectionToggleElement, domainIndicatorElement;
......@@ -76,91 +84,129 @@ document.addEventListener('DOMContentLoaded', function () {
protectionToggleElement = document.getElementById('protection-toggle-button');
domainIndicatorElement = document.getElementById('domain-indicator');
if (domain.startsWith(Address.WWW_PREFIX)) {
domain = domain.slice(Address.WWW_PREFIX_LENGTH);
}
protectionToggleElement.setAttribute('dir', popup._scriptDirection);
domainIndicatorElement.innerText = popup._domain;
domainIndicatorElement.innerText = domain;
if (popup._requestAnalyzer.whitelistedDomains[popup._domain]) {
if (backgroundPage.requestAnalyzer.whitelistedDomains[domain]) {
let enableProtectionTitle = chrome.i18n.getMessage('enableProtectionTitle');
protectionToggleElement.setAttribute('class', 'button button-toggle');
let enableProtectionTitle = chrome.i18n.getMessage('enableProtectionTitle');
protectionToggleElement.addEventListener('click', popup._enableProtection);
protectionToggleElement.setAttribute('title', enableProtectionTitle);
protectionToggleElement.addEventListener('click', function () {
} else {
let disableProtectionTitle = chrome.i18n.getMessage('disableProtectionTitle');
backgroundPage.stateManager.deleteDomainFromWhitelist(domain).then(function () {
protectionToggleElement.setAttribute('class', 'button button-toggle active');
protectionToggleElement.addEventListener('click', popup._disableProtection);
protectionToggleElement.setAttribute('title', disableProtectionTitle);
}
chrome.tabs.reload(tabs[0].id);
websiteContextElement.setAttribute('class', 'panel');
};
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
popup._renderInjectionPanel = function (groupedInjections) {
return browser.tabs.getCurrent().then(function (tab) {
browser.tabs.remove(tab.id);
});
}
let websiteContextElement, injectionOverviewElement;
return window.close();
});
});
websiteContextElement = document.getElementById('website-context');
injectionOverviewElement = popup._createInjectionOverviewElement(groupedInjections);
} else {
websiteContextElement.append(injectionOverviewElement);
};
protectionToggleElement.setAttribute('class', 'button button-toggle active');
popup._enableProtection = function () {
let disableProtectionTitle = chrome.i18n.getMessage('disableProtectionTitle');
popup._stateManager.deleteDomainFromWhitelist(popup._domain)
.then(popup._onProtectionToggled);
};
protectionToggleElement.setAttribute('title', disableProtectionTitle);
protectionToggleElement.setAttribute('dir', scriptDirection);
popup._disableProtection = function () {
protectionToggleElement.addEventListener('click', function () {
popup._stateManager.addDomainToWhitelist(popup._domain)
.then(popup._onProtectionToggled);
};
backgroundPage.stateManager.addDomainToWhitelist(domain).then(function () {
popup._determineBackgroundPage = function () {
chrome.tabs.reload(tabs[0].id);
return new Promise((resolve) => {
if (backgroundPage.main.operatingSystem === chrome.runtime.PlatformOs.ANDROID) {
chrome.runtime.getBackgroundPage(function (backgroundPage) {
return browser.tabs.getCurrent().then(function (tab) {
browser.tabs.remove(tab.id);
popup._backgroundPage = backgroundPage;
resolve();
});
}
});
};
return window.close();
popup._determineTargetTab = function () {
return new Promise((resolve) => {
chrome.tabs.query({'active': true, 'currentWindow': true}, function (tabs) {
popup._targetTab = tabs[0];
resolve();
});
});
}
websiteContextElement.setAttribute('class', 'panel');
}
};
for (let injection in injections) {
popup._determineAmountInjected = function () {
injection = injections[injection];
return new Promise((resolve) => {
let injectionSource = injection.source;
injectionOverview[injectionSource] = injectionOverview[injectionSource] || [];
chrome.storage.local.get('amountInjected', function (items) {
injectionOverview[injectionSource].push({
'path': injection.path,
'version': injection.version,
'source': injection.source
popup._amountInjected = items.amountInjected || 0;
resolve();
});
});
};
popup._groupResourceInjections = function (injections) {
let groupedInjections = {};
for (let index in injections) {
let {source} = injections[index];
groupedInjections[source] = groupedInjections[source] || [];
groupedInjections[source].push(injections[index]);
}
let listElement = document.createElement('ul');
listElement.setAttribute('class', 'list');
return groupedInjections;
};
popup._createInjectionOverviewElement = function (groupedInjections) {
let injectionOverviewElement = document.createElement('ul');
injectionOverviewElement.setAttribute('class', 'list');
for (let source in groupedInjections) {
let injectionGroupHeaderElement, injectionGroupElement, cdn;
cdn = groupedInjections[source];
injectionGroupHeaderElement = popup._createInjectionGroupHeaderElement(source, cdn);
injectionGroupElement = popup._createInjectionGroupElement(source, cdn);
injectionOverviewElement.appendChild(injectionGroupHeaderElement);
injectionOverviewElement.appendChild(injectionGroupElement);
}
for (let injectionSource in injectionOverview) {
return injectionOverviewElement;
};
let cdn, listItemElement, badgeElement, badgeTextNode, cdnName, cdnNameTextNode, subListElement;
popup._createInjectionGroupHeaderElement = function (source, cdn) {
cdn = injectionOverview[injectionSource];
let injectionGroupHeaderElement, badgeElement, badgeTextNode, cdnNameTextNode;
listItemElement = document.createElement('li');
listItemElement.setAttribute('class', 'list-item');
injectionGroupHeaderElement = document.createElement('li');
injectionGroupHeaderElement.setAttribute('class', 'list-item');
badgeElement = document.createElement('span');
badgeElement.setAttribute('class', 'badge');
......@@ -168,74 +214,90 @@ document.addEventListener('DOMContentLoaded', function () {
badgeTextNode = document.createTextNode(cdn.length);
badgeElement.appendChild(badgeTextNode);
cdnName = helpers.determineCdnName(injectionSource);
cdnNameTextNode = document.createTextNode(helpers.determineCdnName(source));
cdnNameTextNode = document.createTextNode(cdnName);
injectionGroupHeaderElement.appendChild(badgeElement);
injectionGroupHeaderElement.appendChild(cdnNameTextNode);
listItemElement.appendChild(badgeElement);
listItemElement.appendChild(cdnNameTextNode);
return injectionGroupHeaderElement;
};
listElement.appendChild(listItemElement);
popup._createInjectionGroupElement = function (source, cdn) {
subListElement = document.createElement('ul');
subListElement.setAttribute('class', 'sublist');
let injectionGroupElement;
listElement.appendChild(subListElement);
injectionGroupElement = document.createElement('ul');
injectionGroupElement.setAttribute('class', 'sublist');
for (let injection of cdn) {
let subListItemElement, resourcePathDetails, resourceFilename, resourceName,
resourceNameTextNode, sideNoteElement, sideNoteTextNode;
let injectionElement = popup._createInjectionElement(injection);
injectionGroupElement.appendChild(injectionElement);
}
subListItemElement = document.createElement('li');
subListItemElement.setAttribute('class', 'sublist-item');
return injectionGroupElement;
};
resourcePathDetails = injection.path.split('/');
resourceFilename = resourcePathDetails[resourcePathDetails.length - 1];
popup._createInjectionElement = function (injection) {
resourceName = helpers.determineResourceName(resourceFilename);
let injectionElement, filename, name, nameTextNode, noteElement, noteTextNode;
resourceNameTextNode = document.createTextNode(`- ${resourceName}`);
subListItemElement.appendChild(resourceNameTextNode);
injectionElement = document.createElement('li');
injectionElement.setAttribute('class', 'sublist-item');
sideNoteElement = document.createElement('span');
sideNoteElement.setAttribute('class', 'side-note');
filename = helpers.extractFilenameFromPath(injection.path);
name = helpers.determineResourceName(filename);
sideNoteTextNode = document.createTextNode(` v${injection.version}`);
nameTextNode = document.createTextNode(`- ${name}`);
injectionElement.appendChild(nameTextNode);
sideNoteElement.appendChild(sideNoteTextNode);
subListItemElement.appendChild(sideNoteElement);
noteElement = document.createElement('span');
noteElement.setAttribute('class', 'side-note');
subListElement.appendChild(subListItemElement);
}
}
noteTextNode = document.createTextNode(` v${injection.version}`);
if (Object.keys(injectionOverview).length > 0) {
noteElement.appendChild(noteTextNode);
injectionElement.appendChild(noteElement);
let websiteContextElement = document.getElementById('website-context');
websiteContextElement.append(listElement);
}
});
});
});
return injectionElement;
};
chrome.runtime.getPlatformInfo(function (information) {
popup._close = function () {
optionsButtonElement.addEventListener('mouseup', function () {
chrome.runtime.getPlatformInfo(function (information) {
if (information.os === chrome.runtime.PlatformOs.ANDROID) {
return chrome.tabs.create({
'url': chrome.extension.getURL('pages/options/options.html')
chrome.tabs.getCurrent(function (tab) {
chrome.tabs.remove(tab.id);
});
}
chrome.runtime.openOptionsPage();
return window.close();
});
} else {
window.close();
}
});
};
/**
* Event Handlers
*/
document.getElementById('testing-utility-link').addEventListener('mouseup', function (event) {
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) {
......@@ -248,5 +310,24 @@ document.addEventListener('DOMContentLoaded', function () {
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