Skip to content

Commit

Permalink
added options page to remove whitelisted domains and revoke temporary…
Browse files Browse the repository at this point in the history
… permissions
  • Loading branch information
AykutCevik committed Apr 9, 2017
1 parent 83dfa39 commit 15ec31f
Show file tree
Hide file tree
Showing 8 changed files with 254 additions and 15 deletions.
32 changes: 32 additions & 0 deletions _locales/en/messages.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,5 +22,37 @@
"textNoBlockedDomains": {
"message": "No domains blocked.",
"description": "If no request has been blocked this message should be shown in popup."
},
"textSettingsTitle": {
"message": "Settings",
"description": "Title and heading for the settings page."
},
"textSettingsWhiteListTitle": {
"message": "Whitelist",
"description": "Title for the whitelist card on options page."
},
"textSettingsWhiteListDescription": {
"message": "Below is a list of your allowed domains. Check them and press the button to remove them.",
"description": "Description for the whitelist card on options page."
},
"buttonRemoveFromWhitelist": {
"message": "Remove from whitelist",
"description": "Button to remove whitelisted domains on options page."
},
"textRemovedFromWhitelist": {
"message": "Domains removed from whitelist.",
"description": "Snackbar info when domains has been removed from whitelist."
},
"textNoWhitelistedDomains": {
"message": "No whitelisted domains.",
"description": "Text shown in options page when no domain is whitelisted."
},
"buttonRevokeAllTemporary": {
"message": "Revoke all temporarily allowed",
"description": "Button text to revoke all temporarily allowed domains"
},
"textRevokedFromTemp": {
"message": "Revoked all temporarily allowed domains.",
"description": "Snackbar info when domains has been revoked from temporary list."
}
}
18 changes: 18 additions & 0 deletions css/options.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
.mdl-card__title {
color: #fff;
background: url('../img/icon_128.png') bottom 30% right 10% no-repeat #353f40;
}

.whitelist-card {
width: 700px;
margin: 20px auto;
}

.mdl-layout__header, .mdl-mega-footer{
background: #353f40;
}

.options-no-whitelist {
margin-top: 60px;
font-weight: bolder;
}
68 changes: 67 additions & 1 deletion html/options.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,75 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<title>IDN Safe</title>
<script type="text/javascript" src="../js/constants.js"></script>
<script type="text/javascript" src="../js/options.js"></script>
<script type="text/javascript" src="../js/punycode.js"></script>
<link rel="stylesheet" href="../css/material.min.css">
<script src="../js/material.min.js"></script>
<link rel="stylesheet" href="../css/material_fonts.css">
<link rel="stylesheet" href="../css/options.css">
</head>
<body>
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer mdl-layout--fixed-header">
<header class="mdl-layout__header">
<div class="mdl-layout__header-row">
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title" id="textSettingsTitle">IDN Safe</span>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="https://aykutcevik.com/#page-contact" target="_blank"><i class="material-icons">mail</i> Contact</a>
<a class="mdl-navigation__link" href="https://github.com/AykutCevik/IDN-Safe" target="_blank"><i class="material-icons">code</i> GitHub</a>
<a class="mdl-navigation__link" href="https://twitter.com/aykut_cevik" target="_blank"><i class="material-icons">link</i> Twitter</a>
</nav>
</div>
<main class="mdl-layout__content">
<div class="page-content">

<div class="whitelist-card mdl-card mdl-shadow--2dp">
<div class="mdl-card__title mdl-card--expand">
<h2 class="mdl-card__title-text" id="textTitleWhitelist">Whitelist</h2>
</div>
<div class="mdl-card__supporting-text">
<span id="textWhitelistList"></span>

<div id="no_whitelisted_domains" class="options-no-whitelist"></div>
<ul class="mdl-list" id="whitelist_list"></ul>
</div>
<div class="mdl-card__actions mdl-card--border">
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" id="buttonRemoveFromWhitelist">Remove</a>
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" id="buttonRevokeAllTemp">Revoke all</a>
</div>
</div>
<div id="options-snackbar" class="mdl-js-snackbar mdl-snackbar">
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
</div>
</main>
<footer class="mdl-mini-footer">
<div class="mdl-mini-footer__right-section">
<div class="mdl-logo" id="textVersionInfo">IDN Safe v.</div>
<ul class="mdl-mini-footer__link-list">
<li><a href="http://idnsafe.com" target="_blank">Help</a></li>
</ul>
</div>
</footer>
</div>

<script type="text/html" id="template_list_item">
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<span class="mdl-list__item-primary-content"><label for="__LIST_ID__">__DOMAIN_TEXT__</label></span>
</span>
<span class="mdl-list__item-secondary-action">
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="__LIST_ID__">
<input type="checkbox" name="domaincheckbox" id="__LIST_ID__" data-domain="__DOMAIN__" class="mdl-checkbox__input"/>
</label>
</span>
</li>
</script>

</body>
</html>
4 changes: 2 additions & 2 deletions html/popup.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<title>IDN Safe</title>
<script type="text/javascript" src="../js/constants.js"></script>
<script type="text/javascript" src="../js/punycode.js"></script>
<script type="text/javascript" src="../js/popup.js"></script>
Expand Down Expand Up @@ -36,7 +36,7 @@ <h2 class="mdl-card__title-text" id="popupTitle">extensionName</h2>
<script type="text/html" id="template_list_item">
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<span class="mdl-list__item-primary-content">__DOMAIN_TEXT__</span>
<span class="mdl-list__item-primary-content"><label for="__LIST_ID__">__DOMAIN_TEXT__</label></span>
</span>
<span class="mdl-list__item-secondary-action">
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect" for="__LIST_ID__">
Expand Down
39 changes: 35 additions & 4 deletions js/background.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,13 @@ chrome.extension.onRequest.addListener(function (request, sender, sendResponse)
});
sendResponse(null);
break;
case REQ_REMOVE_FROM_WHITELIST:
deWhitelistDomains(request.list, sendResponse);
break;
case REQ_REVOKE_FROM_TEMP_LIST:
revokeTemporarilyAllowed();
sendResponse(null);
break;
}
});

Expand Down Expand Up @@ -58,6 +65,32 @@ chrome.webRequest.onBeforeRequest.addListener(function (data) {
["blocking"]
);

function revokeTemporarilyAllowed() {
allowedDomains.length = 0;
loadWhitelist();
}

function deWhitelistDomains(domains, successHandler) {
chrome.storage.local.get('whiteListedDomains', function (object) {

const whitelistedDomains = [];

if (object.whiteListedDomains) {
object.whiteListedDomains.forEach(function (domain) {
if (domains.indexOf(domain) === -1) {
whitelistedDomains.push(domain);
}

var index = allowedDomains.indexOf(domain);
if (index !== -1) {
allowedDomains.splice(index);
}
});
}
chrome.storage.local.set({whiteListedDomains: whitelistedDomains}, successHandler);
});
}

function whitelistDomains(domains) {
chrome.storage.local.get('whiteListedDomains', function (object) {

Expand All @@ -74,8 +107,6 @@ function whitelistDomains(domains) {

chrome.storage.local.set({whiteListedDomains: whitelistedDomains});
});


}

function updateTabIcon(tabId) {
Expand All @@ -101,7 +132,7 @@ function extractDomainFromURL(url) { // credit: NotScript
return url;
}

function init() {
function loadWhitelist() {
chrome.storage.local.get('whiteListedDomains', function (object) {
if (object.whiteListedDomains.length > 0) {
object.whiteListedDomains.forEach(function (domain) {
Expand All @@ -111,4 +142,4 @@ function init() {
});
}

init();
loadWhitelist();
4 changes: 3 additions & 1 deletion js/constants.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
const REQ_MAIN_FRAME = 'main_frame';
const REQ_BLOCKED_URLS = 'blocked_urls';
const REQ_ALLOW_TEMPORARILY = 'temporarily_allow_domains';
const REQ_ALLOW_ALWAYS = 'whitelist_domains';
const REQ_ALLOW_ALWAYS = 'whitelist_domains';
const REQ_REMOVE_FROM_WHITELIST = 'remove_whitelisted_domains';
const REQ_REVOKE_FROM_TEMP_LIST = 'revoke_temp_domains';
86 changes: 86 additions & 0 deletions js/options.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
function setChildTextNode(elementId, text) {
document.getElementById(elementId).innerText = text;
}

function init() {
document.title = chrome.i18n.getMessage("extensionName") + ' - ' + chrome.i18n.getMessage("textSettingsTitle");
setChildTextNode('textSettingsTitle', chrome.i18n.getMessage("textSettingsTitle"));
setChildTextNode('textTitleWhitelist', chrome.i18n.getMessage("textSettingsWhiteListTitle"));
setChildTextNode('textWhitelistList', chrome.i18n.getMessage("textSettingsWhiteListDescription"));
setChildTextNode('buttonRemoveFromWhitelist', chrome.i18n.getMessage("buttonRemoveFromWhitelist"));
setChildTextNode('buttonRevokeAllTemp', chrome.i18n.getMessage("buttonRevokeAllTemporary"));
setChildTextNode('textVersionInfo', chrome.i18n.getMessage("extensionName") + ' ' + chrome.app.getDetails().version);

document.getElementById('buttonRemoveFromWhitelist').onclick = removeFromWhitelist;
document.getElementById('buttonRevokeAllTemp').onclick = revokeAllTemporarilyAllowed;
loadDomainList();
}

function revokeAllTemporarilyAllowed() {
chrome.extension.sendRequest({type: REQ_REVOKE_FROM_TEMP_LIST}, function (response) {
var data = {message: chrome.i18n.getMessage("textRevokedFromTemp")};
document.getElementById('options-snackbar').MaterialSnackbar.showSnackbar(data);
});
}

function removeFromWhitelist() {
var domains = getSelectedDomains();
if (domains.length > 0) {
chrome.extension.sendRequest({type: REQ_REMOVE_FROM_WHITELIST, list: domains}, function (response) {
var data = {message: chrome.i18n.getMessage("textRemovedFromWhitelist")};
document.getElementById('options-snackbar').MaterialSnackbar.showSnackbar(data);
loadDomainList();
});
}
}

function getSelectedDomains() {
var checkedBoxes = document.querySelectorAll('input[data-domain]:checked');

var domains = [];
checkedBoxes.forEach(function (elm) {
var domain = elm.getAttribute('data-domain');
domains.push(domain);
});
return domains;
}

function loadDomainList() {
chrome.storage.local.get('whiteListedDomains', function (object) {
var domains = object.whiteListedDomains;
displayWhitelistedDomains(domains);
});
}

function displayWhitelistedDomains(domains) {

document.getElementById('whitelist_list').innerHTML = '';
document.getElementById('no_whitelisted_domains').innerText = '';

if (!domains || domains.length === 0) {
setChildTextNode('no_whitelisted_domains', chrome.i18n.getMessage("textNoWhitelistedDomains"));
} else {
var container = document.getElementById('whitelist_list');
var htmlTmpl = document.getElementById('template_list_item').innerHTML;
domains.forEach(function (domain) {
var punycodeDomain = punycode.toUnicode(domain);
var itemHtml = htmlTmpl.replace(/__DOMAIN_TEXT__/g, punycodeDomain);
var itemHtml = itemHtml.replace(/__DOMAIN__/g, domain);
var itemHtml = itemHtml.replace(/__LIST_ID__/g, hash(domain));
container.innerHTML += itemHtml;
});
}
}

function hash(str) { // fast workaround
var hash = 0;
if (str.length === 0) return hash;
for (i = 0; i < str.length; i++) {
char = str.charCodeAt(i);
hash = ((hash << 5) - hash) + char;
hash = hash & hash; // Convert to 32bit integer
}
return hash;
}

document.addEventListener('DOMContentLoaded', init);
18 changes: 11 additions & 7 deletions js/popup.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,16 +25,20 @@ function reloadCurrentTab() {

function allowSelectedTemporarily() {
var domains = getSelectedDomains();
chrome.extension.sendRequest({type: REQ_ALLOW_TEMPORARILY, list: domains}, function (response) {
reloadCurrentTab();
});
if (domains.length > 0) {
chrome.extension.sendRequest({type: REQ_ALLOW_TEMPORARILY, list: domains}, function (response) {
reloadCurrentTab();
});
}
}

function allowSelectedAlways() {
var domains = getSelectedDomains();
chrome.extension.sendRequest({type: REQ_ALLOW_ALWAYS, list: domains}, function (response) {
reloadCurrentTab();
});
if (domains.length > 0) {
chrome.extension.sendRequest({type: REQ_ALLOW_ALWAYS, list: domains}, function (response) {
reloadCurrentTab();
});
}
}

function initUI() {
Expand Down Expand Up @@ -82,7 +86,7 @@ function getBlockUrls() {

function hash(str) { // fast workaround
var hash = 0;
if (str.length == 0) return hash;
if (str.length === 0) return hash;
for (i = 0; i < str.length; i++) {
char = str.charCodeAt(i);
hash = ((hash << 5) - hash) + char;
Expand Down

0 comments on commit 15ec31f

Please sign in to comment.