Update custom sites UI (export/import)

Import custom sites only works from add-ons screen (via icon/popup gives CSP-error).
Plus some cosmetic updates in options.
This commit is contained in:
magnolia1234 2020-03-08 19:45:19 +01:00 committed by GitHub
parent 7753911e25
commit 7e28649506
5 changed files with 59 additions and 12 deletions

View file

@ -14,7 +14,7 @@
</style>
</head>
<body>
<h1>Options | <small><span id="version"></span> | <span id="version_new"></span></small></h1>
<h1>Options | <small><span id="version"></span><span id="version_new"></span></small></h1>
<div>
Selected sites will have their cookies cleared and referer set to Google. You should
uncheck sites you have an account with or else you will be logged out at every visit.
@ -27,10 +27,10 @@
<br/>
<div id="status"></div>
<div id="error"></div>
<span style='float:left;padding-bottom:20px'>
<span style='float:left;padding-bottom:50px'>
<button id="save">Save</button>
</span>
<span style='float:right;padding-bottom:20px'>
<span style='float:right;padding-bottom:50px'>
<button id="select-all">Select all</button>
<button id="select-none">Select none</button>
</span>

View file

@ -51,6 +51,9 @@
<div id="error"></div>
<span style='float:left;padding-bottom:20px'>
<button id="save">Save</button>
<button id="export">Export</button>
<button id="import">Import</button>
<input type="file" id="importInput" accept=".txt" style="display:none"/>
</span>
<script src="options_custom.js"></script>
</body>

View file

@ -20,6 +20,46 @@ function save_options() {
});
}
// Export custom sites to file
function export_options() {
browser.storage.sync.get({
sites_custom: {}
}, function (items) {
var result = JSON.stringify(items.sites_custom);
var a = document.createElement("a");
var file = new Blob([result], {type: "text/plain"});
a.href = window.URL.createObjectURL(file);
let date = new Date();
let dateStr = new Date(date.getTime() - (date.getTimezoneOffset() * 60000 )).toISOString().split("T")[0];
a.download = 'bypass_paywalls_clean_custom_' + dateStr + '.txt';
a.click();
});
}
// Import custom sites from file
function import_options(e) {
var files = e.target.files;
var reader = new FileReader();
reader.onload = _imp;
reader.readAsText(files[0]);
}
function _imp() {
let sites_custom = JSON.parse(this.result);
browser.storage.sync.set({
sites_custom: sites_custom
}, function () {
// Update status to let user know custom sites were imported.
var status = document.getElementById('status');
status.textContent = 'Custom sites imported.';
setTimeout(function () {
//status.textContent = '';
importInput.value = '';
renderOptions();
}, 800);
});
}
// Add custom site to browser.storage
function add_options() {
var gh_url = document.getElementById('add_site').value;
@ -62,16 +102,14 @@ function add_options() {
var status = document.getElementById('status');
status.textContent = 'Site added.';
setTimeout(function () {
status.textContent = '';
//status.textContent = '';
renderOptions();
//location.href = 'options.html';
//window.close();
}, 800);
});
});
}
// Delete custom site to browser.storage
// Delete custom site from browser.storage
function delete_options() {
var gh_url = document.getElementById('custom_sites').value;
var selectEl = document.querySelector('#custom_sites select');
@ -94,8 +132,6 @@ function delete_options() {
setTimeout(function () {
status.textContent = '';
renderOptions();
//location.href = 'options.html';
//window.close();
}, 800);
});
});
@ -135,7 +171,10 @@ function renderOptions() {
if (add_checkboxes[key]) {
inputEl.type = 'checkbox';
inputEl.dataset.value = 1;
}
} else if (key === 'title') {
inputEl.placeholder = 'Example';
} else if (key === 'domain')
inputEl.placeholder = 'example.com';
labelEl.appendChild(document.createTextNode(' ' + key));
add_sitesEl.appendChild(labelEl);
}
@ -164,5 +203,8 @@ function renderOptions() {
document.addEventListener('DOMContentLoaded', renderOptions);
document.getElementById('save').addEventListener('click', save_options);
document.getElementById('export').addEventListener('click', export_options);
document.getElementById('import').onclick = function () {importInput.click()}
document.getElementById('importInput').addEventListener("change", import_options, false);
document.getElementById('add').addEventListener('click', add_options);
document.getElementById('delete').addEventListener('click', delete_options);

View file

@ -5,7 +5,9 @@
</head>
<body>
<div style="width:275px;"><strong>Bypass Paywalls Clean <span id="version"></span></strong>
<br><a href="options.html">Options</a> | <a href="https://github.com/magnolia1234/bypass-paywalls-firefox-clean/blob/master/README.md" target=”_blank”>GitHub</a> | <strong><span id="version_new"></span></strong></div>
<br><a href="options.html">Options</a> |
<a href="https://github.com/magnolia1234/bypass-paywalls-chrome-clean/blob/master/README.md" target=”_blank”>GitHub</a>
<span id="version_new"></span></div>
<script src="version.js"></script>
</body>
</html>

View file

@ -9,7 +9,7 @@ fetch(manifest_new)
response.json().then(json => {
var version_new = json['version'];
if (version_new > manifestData.version) {
versionString_new = 'New release v' + version_new.link("https://github.com/magnolia1234/bypass-paywalls-firefox-clean/releases").replace('a href=', 'a target="_blank" href=');
versionString_new = ' | New release v' + version_new.link("https://github.com/magnolia1234/bypass-paywalls-firefox-clean/releases").replace('a href=', 'a target="_blank" href=');
} else {
versionString_new = ''; //'Latest release';
}