Skip to content
This repository has been archived by the owner on Nov 6, 2023. It is now read-only.

New UX for HTTPS Everywhere: For Release #17854

Merged
merged 23 commits into from
May 2, 2019
Merged

New UX for HTTPS Everywhere: For Release #17854

Show file tree
Hide file tree
Changes from 22 commits
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
daa7c2a
Add sites visited list
zoracon Dec 12, 2018
28cacaa
Add comment about sites upgraded placement
zoracon Dec 13, 2018
1f05c77
Add "Sites Upgraded" to storage
zoracon Jan 5, 2019
bb866d8
Add HTML Elements
zoracon Jan 5, 2019
98bc70d
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Feb 23, 2019
8058293
Layout new css file
zoracon Feb 23, 2019
670a0b6
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Feb 27, 2019
f3cd27c
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Apr 1, 2019
d7bf3f5
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Apr 3, 2019
a16287d
Basis for new UX
zoracon Apr 7, 2019
dc17966
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Apr 10, 2019
675e248
Add more to UI
zoracon Apr 10, 2019
b3dc7bc
Add in new icons and shift counter
zoracon Apr 30, 2019
a067639
Clean up
zoracon Apr 30, 2019
85ad240
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon Apr 30, 2019
23d9e20
Amend failing tests and apply review feedback
zoracon May 1, 2019
506df8a
Amend test
zoracon May 1, 2019
dfb76d5
Amend test selectors and typos in CSS
zoracon May 1, 2019
b8e87b3
Patch test
zoracon May 1, 2019
9b62b18
Amend method of grabbing elements for test
zoracon May 1, 2019
fd16d24
Merge branch 'master' of github.com:EFForg/https-everywhere into new-…
zoracon May 1, 2019
62e7c1b
Fixes from feedback
zoracon May 2, 2019
ea83301
Add in translations strings
zoracon May 2, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 1 addition & 23 deletions chromium/background-scripts/background.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,26 +33,22 @@ async function initializeAllRules() {
* Load preferences. Structure is:
* {
* httpNowhere: Boolean,
* showCounter: Boolean,
* isExtensionEnabled: Boolean
* }
*/
var httpNowhereOn = false;
var showCounter = true;
var isExtensionEnabled = true;
let disabledList = new Set();

function initializeStoredGlobals() {
return new Promise(resolve => {
store.get({
httpNowhere: false,
showCounter: true,
globalEnabled: true,
enableMixedRulesets: false,
disabledList: [],
disabledList: []
}, function(item) {
httpNowhereOn = item.httpNowhere;
showCounter = item.showCounter;
isExtensionEnabled = item.globalEnabled;
for (let disabledSite of item.disabledList) {
disabledList.add(disabledSite);
Expand Down Expand Up @@ -92,10 +88,6 @@ chrome.storage.onChanged.addListener(async function(changes, areaName) {
httpNowhereOn = changes.httpNowhere.newValue;
updateState();
}
if ('showCounter' in changes) {
showCounter = changes.showCounter.newValue;
updateState();
}
if ('globalEnabled' in changes) {
isExtensionEnabled = changes.globalEnabled.newValue;
updateState();
Expand Down Expand Up @@ -160,7 +152,6 @@ function updateState () {
if (!tabs || tabs.length === 0) {
return;
}
const tabId = tabs[0].id;
const tabUrl = new URL(tabs[0].url);

if (disabledList.has(tabUrl.host) || iconState == "disabled") {
Expand All @@ -172,26 +163,13 @@ function updateState () {
});
}
} else {

if ('setIcon' in chrome.browserAction) {
chrome.browserAction.setIcon({
path: {
38: 'images/icons/icon-' + iconState + '-38.png'
}
});
}

const activeCount = appliedRulesets.getActiveRulesetCount(tabId);

if ('setBadgeBackgroundColor' in chrome.browserAction) {
chrome.browserAction.setBadgeBackgroundColor({ color: '#666666', tabId });
}

const showBadge = activeCount > 0 && isExtensionEnabled && showCounter;

if ('setBadgeText' in chrome.browserAction) {
chrome.browserAction.setBadgeText({ text: showBadge ? String(activeCount) : '', tabId });
}
}
});
}
Expand Down
Binary file added chromium/images/HTTPS-Everywhere-Logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added chromium/images/icons/SettingsIcon.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified chromium/images/icons/icon-active-128.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified chromium/images/icons/icon-active-38.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified chromium/images/icons/icon-active-48.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified chromium/images/icons/icon-blocking-38.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified chromium/images/icons/icon-disabled-38.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
136 changes: 79 additions & 57 deletions chromium/pages/popup/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,78 +11,100 @@
</head>
<body>
<header>
<h1 data-i18n="about_ext_name"></h1>
<div class="logo-container">
<img src="../../images/HTTPS-Everywhere-Logo.png" alt="HTTPS Everywhere logo">
</div>

<small>
<span data-i18n="about_version">Version</span>: <span id="current-version"></span>
<br>
<span id="rulesets-versions"></span>
</small>
</header>

<section id="disableButton" class="options" style="visibility: hidden;">
<div class="onoffswitch">
<input id="onoffswitch" type="checkbox" checked><label data-i18n="menu_globalEnable" for="onoffswitch"></label>
<section id="disableButton" class="options settings_block" style="visibility: hidden;">
<div class="onoffswitch switch" aria-label="Toggle on or off">
<h1 id="onoffswitch_label" data-i18n="menu_globalEnable"></h1>
<span class="slider round"></span>
<input aria-hidden="true" id="onoffswitch" type="checkbox" checked> <label id="onoffswitch__label" for="onoffswitch">
</label>
</div>
</section>

<section id="HttpNowhere" class="options" style="visibility: hidden;">
<input id="http-nowhere-checkbox" type="checkbox"><label data-i18n="menu_encryptAllSitesEligible" for="http-nowhere-checkbox"></label>
<section id="HttpNowhere" class="options settings_block" style="visibility: hidden;">
<h1 id="HttpNowhere__header" data-i18n="menu_encryptAllSitesEligible"></h1>
<input aria-hidden="true" id="http-nowhere-checkbox" type="checkbox"><label id="http-nowhere-checkbox_label" aria-label="Toggle on or off" for="http-nowhere-checkbox"></label>
<h2 id="HttpNowhere__explained" data-i18n="menu_httpNoWhereExplained"></h2>
<span id="HttpNowhere__see_more" class="see_more__arrow down" aria-label="Listen or See more explanation"></span>
<span id="HttpNowhere__see_more--prompt" class="see_more__prompt" data-i18n="menu_seeMore"></span>
<div class="see_more__content hide">
<p class="see_more--clarified" data-i18n="menu_httpNoWhereMore"></p>
</div>
</section>

<div id="RuleManagement">
<section id="disableEnableSection">
<a href="javascript:void 0" id="disable-on-this-site" data-i18n="chrome_disable_on_this_site"></a>
<a href="javascript:void 0" id="enable-on-this-site" data-i18n="chrome_enable_on_this_site"></a>
<section id="RuleManagement" class="settings_block">
<section id="settingsForThisSite">
<h1 data-i18n="chrome_settings_for_this_site_header"></h1>
<img class="settingsForThisSite__gear-icon" src="../../images/icons/SettingsIcon.png" alt="gear icon" aria-hidden="true" >
<h2 data-i18n="chrome_settings_for_this_site_subheader"></h2>
</section>

<section id="addRuleSection">
<a href="javascript:void 0" id="add-rule-link" data-i18n="chrome_add_rule"></a>
<div id="add-new-rule-div" style="display: none">
<h3 data-i18n="about_add_new_rule"></h3>
<p data-i18n="chrome_always_https_for_host"></p>
<label for="new-rule-host" data-i18n="chrome_host"></label><br>
<input size="50" id="new-rule-host" type="text" disabled><br>
<div id="new-rule-regular-text">
<a href="javascript:void 0" id="new-rule-show-advanced-link" data-i18n="chrome_show_advanced"></a><br>
</div>
<div id="new-rule-advanced" style="display: none">
<a href="javascript:void 0" id="new-rule-hide-advanced-link" data-i18n="chrome_hide_advanced"></a><br>
<br>
<label for="new-rule-name" data-i18n="chrome_rule_name"></label><br>
<input size="50" id="new-rule-name" type="text"><br>
<label for="new-rule-regex" data-i18n="chrome_regex"></label><br>
<input size="50" id="new-rule-regex" type="text"><br>
<label for="new-rule-redirect" data-i18n="chrome_redirect_to"></label><br>
<input size="50" id="new-rule-redirect" type="text"><br>
<span id="RuleManagement__see_more" class="see_more__arrow down" aria-label="Listen or See more explanation"></span>
<span id="RuleManagement__see_more--prompt" class="see_more__prompt" data-i18n="menu_seeMore"></span>
<div class="see_more__content hide">
<p class="see_more--clarified" data-i18n="chrome_settings_for_this_site_explained"></p>

<section id="disableEnableSection">
<a href="javascript:void 0" id="disable-on-this-site" class="button" data-i18n="chrome_disable_on_this_site"></a>
<a href="javascript:void 0" id="enable-on-this-site" class="button" data-i18n="chrome_enable_on_this_site"></a>
</section>

<section id="addRuleSection">
<a href="javascript:void 0" id="add-rule-link" class="button" data-i18n="chrome_add_rule"></a>
<div id="add-new-rule-div" style="display: none">
<h3 data-i18n="about_add_new_rule"></h3>
<p data-i18n="chrome_always_https_for_host"></p>
<label for="new-rule-host" data-i18n="chrome_host" class="label_nontoggle"></label>
<input size="50" id="new-rule-host" type="text" disabled><br>
<div id="new-rule-regular-text">
<a href="javascript:void 0" id="new-rule-show-advanced-link" class="button" data-i18n="chrome_show_advanced"></a><br>
</div>
<div id="new-rule-advanced" style="display: none">
<a href="javascript:void 0" id="new-rule-hide-advanced-link" class="button" data-i18n="chrome_hide_advanced"></a><br>
<label for="new-rule-name" data-i18n="chrome_rule_name" class="label_nontoggle"></label>
<input size="50" id="new-rule-name" type="text">
<label for="new-rule-regex" data-i18n="chrome_regex" class="label_nontoggle"></label>
<input size="50" id="new-rule-regex" type="text">
<label for="new-rule-redirect" data-i18n="chrome_redirect_to" class="label_nontoggle"></label>
<input size="50" id="new-rule-redirect" type="text">
</div>
<button id="add-new-rule-button" class="button" data-i18n="chrome_add_new_rule"></button>
<button id="cancel-new-rule" class="button" data-i18n="chrome_status_cancel_button"></button>
</div>
<button id="add-new-rule-button" data-i18n="chrome_add_new_rule"></button><br>
<button id="cancel-new-rule" data-i18n="chrome_status_cancel_button"></button>
</div>
</section>
</section>

<section id="StableRules" class="rules">
<h3 data-i18n="chrome_stable_rules"></h3>
<p class="description" data-i18n="chrome_stable_rules_description"></p>
</section>
<section id="StableRules" class="rules">
<h3 data-i18n="chrome_stable_rules"></h3>
<span id="RuleManagement--counter"></span>
<h2 class="description" data-i18n="chrome_stable_rules_description"></h2>
</section>

<section id="UnstableRules" class="rules">
<h3 data-i18n="chrome_experimental_rules"></h3>
<p class="description" data-i18n="chrome_experimental_rules_description"></p>
</section>
<section id="UnstableRules" class="rules">
<h3 data-i18n="chrome_experimental_rules"></h3>
<h2 class="description" data-i18n="chrome_experimental_rules_description"></h2>
</section>

<section id="resetButton" class="options">
<a href="javascript:void 0" id="reset-to-defaults" data-i18n="prefs_reset_defaults"></a>
</section>
</div>
<section id="resetButton" class="options">
<a href="javascript:void 0" id="reset-to-defaults" class="button" data-i18n="prefs_reset_defaults"></a>
</section>
</div>

</section>

<footer>
<a id="viewAllRules" href="https://atlas.eff.org/index.html" target="_blank" data-i18n="menu_viewAllRules"></a><br>
<br>
<a id="aboutTitle" href="https://www.eff.org/https-everywhere" target="_blank" data-i18n="about_title"></a><br>
<br>
<a id="donateEFF" href="https://supporters.eff.org/donate/support-https-everywhere" target="_blank" data-i18n="menu_donate_eff_imperative"></a>
<p>
<small>
<span data-i18n="about_version">Version</span>: <span id="current-version"></span>
<span id="rulesets-versions">
</span>
</small>
</p>
<a class="button" id="viewAllRules" href="https://atlas.eff.org/index.html" target="_blank" data-i18n="menu_viewAllRules"></a>
<a class="button" id="aboutTitle" href="https://www.eff.org/https-everywhere" target="_blank" data-i18n="about_title"></a>
<a class="button" id="donateEFF" href="https://supporters.eff.org/donate/support-https-everywhere" target="_blank" data-i18n="menu_donate_eff_imperative"></a>
</footer>

</body>
Expand Down
Loading