parent
2acef931eb
commit
46a5310aed
|
@ -17,7 +17,10 @@ function onStartup(){
|
|||
chrome.storage.sync.get(['betterSourceURL'], function(result) {
|
||||
console.log('Value currently is ' + (result.betterSourceURL || DEFAULT_LIST_URL));
|
||||
|
||||
fetch((result.betterSourceURL || DEFAULT_LIST_URL))
|
||||
var listUrl = result.betterSourceURL || DEFAULT_LIST_URL
|
||||
// Uncomment this when testing list changes locally
|
||||
// listUrl = "/defaultlist.json"
|
||||
fetch(listUrl)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
console.log("Got data: ", data);
|
||||
|
@ -30,9 +33,9 @@ function onStartup(){
|
|||
}
|
||||
|
||||
function getMatch(url){
|
||||
var match = BETTER_ALTERNATIVES.find(pattern => url.match(new RegExp(pattern[0])));
|
||||
if(match)
|
||||
return match[1];
|
||||
var match = BETTER_ALTERNATIVES.find(pattern => url.match(new RegExp(pattern.urlPattern)));
|
||||
if(match && match.alternatives)
|
||||
return match.alternatives;
|
||||
else return null;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
// document.body.style.border = "15px solid red";
|
||||
|
||||
/*
|
||||
/*
|
||||
|
||||
IN PROGRESS:
|
||||
IN PROGRESS:
|
||||
|
||||
- List of alternatives should be loaded from a user-specified external source. Can be modified via options.html/options.js
|
||||
|
||||
|
@ -15,41 +15,66 @@ TODO
|
|||
- Test and fix for Chrome, Brave & Firefox
|
||||
|
||||
*/
|
||||
const fillTemplate = function(templateString, templateVars){
|
||||
return new Function("return `"+templateString +"`;").call(templateVars);
|
||||
}
|
||||
|
||||
function showBetter(alternative) {
|
||||
if(!alternative) return;
|
||||
let betterdiv = document.createElement("div");
|
||||
betterdiv.style.backgroundColor = "#ffcc49";
|
||||
betterdiv.style.color = "red";
|
||||
betterdiv.style.position = "fixed";
|
||||
betterdiv.style.bottom = "10px";
|
||||
betterdiv.style.right = "10px";
|
||||
betterdiv.style.width = "300px";
|
||||
betterdiv.style.boxShadow = "0px 10px 30px #222222";
|
||||
betterdiv.style.padding = "12px";
|
||||
betterdiv.style.height = "200px";
|
||||
betterdiv.style.textAlign = "center";
|
||||
betterdiv.style.fontSize = "20px";
|
||||
const altTemplate = "\
|
||||
<a href='${this.url}' \
|
||||
style='display: block; border: 2px solid #222222; border-radius: 4px; margin-top: 12px; color:#222222; padding: 8px;'> \
|
||||
<p style='margin: 0; font-size: 14px; font-weight: bold;'>${this.name} →</p> \
|
||||
<p style='margin: 0; font-size: 12px;'>${this.desc}</p> \
|
||||
</a>"
|
||||
|
||||
function createNonRecommendedAlts(alternatives) {
|
||||
let nonRecommendedAlts = document.createElement("div");
|
||||
nonRecommendedAlts.setAttribute("style", "text-align: left;");
|
||||
nonRecommendedAlts.innerHTML = "<p style='font-size: 12px; text-align: center; margin-bottom: 4px;'>MORE ALTERNATIVES</p>";
|
||||
alternatives.map(alternative => {
|
||||
nonRecommendedAlts.innerHTML += fillTemplate(altTemplate, alternative);
|
||||
})
|
||||
return nonRecommendedAlts;
|
||||
}
|
||||
|
||||
function createRecommendedAlt(alternative) {
|
||||
let recommendedAlt = document.crateElement("div");
|
||||
|
||||
let betterBrandText = document.createElement("h1");
|
||||
betterBrandText.innerHTML = "Better"
|
||||
betterBrandText.setAttribute("style", "font-size: 32px; color: #222222; font-weight: bold; margin: 12px;")
|
||||
betterBrandText.innerHTML = "Better";
|
||||
betterBrandText.setAttribute("style", "font-size: 32px; color: #222222; font-weight: bold; margin: 12px;");
|
||||
|
||||
let alternativeText = document.createElement("p");
|
||||
alternativeText.innerHTML = alternative
|
||||
alternativeText.setAttribute("style", "font-size: 20px; color: #222222; font-weight: bold; margin-top: 24px;")
|
||||
alternativeText.innerHTML = recommendedAlternative.desc;
|
||||
alternativeText.setAttribute("style", "font-size: 20px; color: #222222; font-weight: bold; margin-top: 24px;");
|
||||
|
||||
let alternativeCTA = document.createElement("a")
|
||||
alternativeCTA.innerHTML = "Check it out →"
|
||||
alternativeCTA.setAttribute("style", "display: inline-block; padding: 12px 24px; background-color: #222222; color: #ffffff; border-radius: 4px;")
|
||||
let alternativeCTA = document.createElement("a");
|
||||
alternativeCTA.innerHTML = recommendedAlternative.name + " →";
|
||||
alternativeCTA.setAttribute("href", recommendedAlternative.url);
|
||||
alternativeCTA.setAttribute("style", "display: inline-block; padding: 12px 24px; background-color: #222222; color: #ffffff; border-radius: 4px;");
|
||||
|
||||
let dismissButton = document.createElement("button")
|
||||
dismissButton.innerHTML = "✗ Dismiss suggestion for this URL"
|
||||
dismissButton.setAttribute("style", "display: block; font-size: 14px; margin: 16px auto;")
|
||||
recommendedAlt.appendChild(betterBrandText);
|
||||
recommendedAlt.appendChild(alternativeText);
|
||||
recommendedAlt.appendChild(alternativeCTA);
|
||||
return recommendedAlt;
|
||||
}
|
||||
|
||||
betterdiv.appendChild(betterBrandText);
|
||||
betterdiv.appendChild(alternativeText);
|
||||
betterdiv.appendChild(alternativeCTA);
|
||||
function showBetter(alternatives) {
|
||||
if(!alternatives) return;
|
||||
|
||||
let betterdiv = document.createElement("div");
|
||||
betterdiv.setAttribute("style",
|
||||
"background-color: #ffcc49; position: fixed; bottom: 10px; right: 10px; width: 300px; \
|
||||
box-shadow: 0px 10px 30px #222222; padding: 12px; text-align: center; font-size: 20px;")
|
||||
|
||||
betterdiv.appendChild(createRecommendedAlt(alternatives[0]));
|
||||
|
||||
if(alternatives.length > 1) {
|
||||
betterdiv.appendChild(createNonRecommendedAlts(alternatives.slice(1)));
|
||||
}
|
||||
|
||||
let dismissButton = document.createElement("button");
|
||||
dismissButton.innerHTML = "✗ Dismiss suggestion for this URL";
|
||||
dismissButton.setAttribute("style", "display: block; font-size: 14px; margin: 16px auto;");
|
||||
betterdiv.appendChild(dismissButton);
|
||||
document.body.appendChild(betterdiv);
|
||||
}
|
||||
|
|
|
@ -1,3 +1,27 @@
|
|||
[
|
||||
[ "https?:\/\/(www.)?google.com\/chrome" , "A better alternative is <a href='https://mozilla.com' target='_blank'>Mozilla</a>."]
|
||||
{
|
||||
"urlPattern": "https?:\/\/(www.)?google.com\/chrome",
|
||||
"alternatives": [
|
||||
{
|
||||
"url": "https://mozilla.com",
|
||||
"name": "Mozilla Firefox",
|
||||
"desc": "Firefox is open source, backed by the Mozilla Foundation"
|
||||
},
|
||||
{
|
||||
"url": "https://brave.org",
|
||||
"name": "Brave Browser",
|
||||
"desc": "Brave is open source, new-generation browser."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"urlPattern": "https?:\/\/(www.)?slack.com",
|
||||
"alternatives": [
|
||||
{
|
||||
"url": "https://matrix.org",
|
||||
"name": "Matrix / Element",
|
||||
"desc": "An open network for secure, decentralized communication"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
|
@ -17,5 +17,8 @@
|
|||
"options_ui": {
|
||||
"page": "options.html",
|
||||
"open_in_tab": false
|
||||
}
|
||||
},
|
||||
"web_accessible_resources": [
|
||||
"defaultlist.json"
|
||||
]
|
||||
}
|
Loading…
Reference in New Issue