Added plus button next to public instances

This commit is contained in:
ManeraKai 2023-01-21 19:03:21 +03:00
parent 57e32c8d7a
commit e460261c67
No known key found for this signature in database
GPG Key ID: 5ABC31FFD562E337
3 changed files with 128 additions and 93 deletions

View File

@ -18,6 +18,16 @@ config = await utils.getConfig()
options = await utils.getOptions() options = await utils.getOptions()
function changeFrontendsSettings(service) { function changeFrontendsSettings(service) {
const opacityDiv = document.getElementById(`${service}-opacity`)
if (document.getElementById(`${service}-enabled`).checked) {
opacityDiv.style.pointerEvents = 'auto'
opacityDiv.style.opacity = 1
opacityDiv.style.userSelect = 'auto'
} else {
opacityDiv.style.pointerEvents = 'none'
opacityDiv.style.opacity = 0.4
opacityDiv.style.userSelect = 'none'
}
for (const frontend in config.services[service].frontends) { for (const frontend in config.services[service].frontends) {
if (config.services[service].frontends[frontend].instanceList) { if (config.services[service].frontends[frontend].instanceList) {
const frontendDiv = document.getElementById(frontend) const frontendDiv = document.getElementById(frontend)
@ -32,7 +42,7 @@ function changeFrontendsSettings(service) {
} }
} }
function loadPage(path) { async function loadPage(path) {
for (const section of document.getElementById("pages").getElementsByTagName("section")) section.style.display = "none" for (const section of document.getElementById("pages").getElementsByTagName("section")) section.style.display = "none"
document.getElementById(`${path}_page`).style.display = "block" document.getElementById(`${path}_page`).style.display = "block"
@ -50,6 +60,7 @@ function loadPage(path) {
const service = path; const service = path;
divs[service] = {} divs[service] = {}
options = await utils.getOptions()
for (const option in config.services[service].options) { for (const option in config.services[service].options) {
divs[service][option] = document.getElementById(`${service}-${option}`) divs[service][option] = document.getElementById(`${service}-${option}`)
if (typeof config.services[service].options[option] == "boolean") divs[service][option].checked = options[service][option] if (typeof config.services[service].options[option] == "boolean") divs[service][option].checked = options[service][option]
@ -73,9 +84,8 @@ function loadPage(path) {
frontend_name_element.href = Object.values(config.services[service].frontends)[0].url frontend_name_element.href = Object.values(config.services[service].frontends)[0].url
} }
if (Object.keys(config.services[service].frontends).length > 1) { changeFrontendsSettings(service)
changeFrontendsSettings(service)
}
for (const frontend in config.services[service].frontends) { for (const frontend in config.services[service].frontends) {
if (config.services[service].frontends[frontend].instanceList) { if (config.services[service].frontends[frontend].instanceList) {
@ -95,38 +105,39 @@ function loadPage(path) {
} }
} }
async function calcCustomInstances(frontend) {
let options = await utils.getOptions()
let customInstances = options[frontend]
document.getElementById(frontend).getElementsByClassName("custom-checklist")[0].innerHTML = customInstances
.map(
x => `
<div>
${x}
<button class="add clear-${x}">
<svg xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
</svg>
</button>
</div>
<hr>`
)
.join("\n")
for (const item of customInstances) {
document.getElementById(frontend).getElementsByClassName(`clear-${item}`)[0].addEventListener("click", async () => {
const index = customInstances.indexOf(item)
if (index > -1) customInstances.splice(index, 1)
options = await utils.getOptions()
options[frontend] = customInstances
browser.storage.local.set({ options }, () => calcCustomInstances(frontend))
})
}
}
async function processCustomInstances(frontend, document) { async function processCustomInstances(frontend, document) {
let options = await utils.getOptions() let options = await utils.getOptions()
let customInstances = options[frontend] let customInstances = options[frontend]
function calcCustomInstances() { calcCustomInstances(frontend)
document.getElementById(frontend).getElementsByClassName("custom-checklist")[0].innerHTML = customInstances
.map(
x => `
<div>
${x}
<button class="add clear-${x}">
<svg xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" />
</svg>
</button>
</div>
<hr>`
)
.join("\n")
customInstances = options[frontend]
for (const item of customInstances) {
document.getElementById(frontend).getElementsByClassName(`clear-${item}`)[0].addEventListener("click", async () => {
let index = customInstances.indexOf(item)
if (index > -1) customInstances.splice(index, 1)
options = await utils.getOptions()
options[frontend] = customInstances
browser.storage.local.set({ options }, () => calcCustomInstances())
})
}
}
calcCustomInstances()
document.getElementById(frontend).getElementsByClassName("custom-instance-form")[0].addEventListener("submit", async event => { document.getElementById(frontend).getElementsByClassName("custom-instance-form")[0].addEventListener("submit", async event => {
event.preventDefault() event.preventDefault()
let frontendCustomInstanceInput = document.getElementById(frontend).getElementsByClassName("custom-instance")[0] let frontendCustomInstanceInput = document.getElementById(frontend).getElementsByClassName("custom-instance")[0]
@ -144,7 +155,7 @@ async function processCustomInstances(frontend, document) {
options[frontend] = customInstances options[frontend] = customInstances
browser.storage.local.set({ options }, () => { browser.storage.local.set({ options }, () => {
frontendCustomInstanceInput.value = "" frontendCustomInstanceInput.value = ""
calcCustomInstances() calcCustomInstances(frontend)
}) })
} }
} }
@ -155,29 +166,56 @@ function createList(frontend, networks, document, redirects, blacklist) {
for (const network in networks) { for (const network in networks) {
if (redirects[frontend]) { if (redirects[frontend]) {
if (redirects[frontend][network].length > 0) { if (redirects[frontend][network].length > 0) {
document.getElementById(frontend).getElementsByClassName(network)[0].getElementsByClassName("checklist")[0].innerHTML = [ document.getElementById(frontend)
`<div class="some-block option-block"> .getElementsByClassName(network)[0]
.getElementsByClassName("checklist")[0]
.innerHTML = [
`<div class="some-block option-block">
<h4>${utils.camelCase(network)}</h4> <h4>${utils.camelCase(network)}</h4>
</div>`, </div>`,
...redirects[frontend][network] ...redirects[frontend][network]
.sort((a, b) => .sort((a, b) =>
(blacklist.cloudflare.includes(a) && !blacklist.cloudflare.includes(b)) (blacklist.cloudflare.includes(a) && !blacklist.cloudflare.includes(b))
) )
.map(x => { .map(x => {
const cloudflare = blacklist.cloudflare.includes(x) ? const cloudflare = blacklist.cloudflare.includes(x) ?
` <a target="_blank" href="https://libredirect.github.io/docs.html#instances"> ` <a target="_blank" href="https://libredirect.github.io/docs.html#instances">
<span style="color:red;">cloudflare</span> <span style="color:red;">cloudflare</span>
</a>` : "" </a>` : ""
const warnings = [cloudflare].join(" ") const warnings = [cloudflare].join(" ")
return `<div> return `<div>
<x> <x>
<a href="${x}" target="_blank">${x}</a>${warnings} <a href="${x}" target="_blank">${x}</a>${warnings}
</x> </x>
<button class="add add-${x}">
<svg xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
</svg>
</button>
</div>` </div>`
}), }),
'<br>' '<br>'
].join("\n<hr>\n") ].join("\n<hr>\n")
for (const x of redirects[frontend][network]) {
document.getElementById(frontend)
.getElementsByClassName(network)[0]
.getElementsByClassName("checklist")[0]
.getElementsByClassName(`add-${x}`)[0]
.addEventListener("click", async () => {
let options = await utils.getOptions()
let customInstances = options[frontend]
if (!customInstances.includes(x)) {
customInstances.push(x)
options = await utils.getOptions()
options[frontend] = customInstances
browser.storage.local.set({ options }, () => {
calcCustomInstances(frontend)
})
}
})
}
} }
} else { } else {
document.getElementById(frontend).getElementsByClassName(network)[0].getElementsByClassName("checklist")[0].innerHTML = document.getElementById(frontend).getElementsByClassName(network)[0].getElementsByClassName("checklist")[0].innerHTML =

View File

@ -2,11 +2,8 @@
window.browser = window.browser || window.chrome window.browser = window.browser || window.chrome
import utils from "../../../assets/javascripts/utils.js" import utils from "../../../assets/javascripts/utils.js"
import generalHelper from "../../../assets/javascripts/general.js"
import servicesHelper from "../../../assets/javascripts/services.js" import servicesHelper from "../../../assets/javascripts/services.js"
async function setOption(option, type, event) { async function setOption(option, type, event) {
let options = await utils.getOptions() let options = await utils.getOptions()
if (type == "select") { if (type == "select") {
@ -70,10 +67,8 @@ function importError() {
const resetSettings = document.getElementById("reset-settings") const resetSettings = document.getElementById("reset-settings")
resetSettings.addEventListener("click", async () => { resetSettings.addEventListener("click", async () => {
resetSettings.innerHTML = "..." resetSettings.innerHTML = "..."
browser.storage.local.clear(async () => { await servicesHelper.initDefaults()
await servicesHelper.initDefaults() location.reload()
location.reload()
})
}) })
let themeElement = document.getElementById("theme") let themeElement = document.getElementById("theme")

View File

@ -8,51 +8,53 @@ each val, service in services
div(class="some-block option-block") div(class="some-block option-block")
h4(data-localise="__MSG_enable__") Enable h4(data-localise="__MSG_enable__") Enable
input(id=service+"-enabled" type="checkbox") input(id=`${service}-enabled` type="checkbox")
div(class="some-block option-block") div(id=service+"-opacity")
h4(data-localise="__MSG_show_in_popup__") Show in Popup
input(id=service type="checkbox")
if Object.keys(services[service].frontends).length> 1
div(class="some-block option-block") div(class="some-block option-block")
h4 h4(data-localise="__MSG_show_in_popup__") Show in Popup
a(class="frontend_name" target="_blank" data-localise="__MSG_frontend__") Frontend input(id=service type="checkbox")
select(id=service+"-frontend")
each val, frontend in services[service].frontends
option(value=frontend)=services[service].frontends[frontend].name
else
div(class="some-block option-block")
h4
a(class="frontend_name" target="_blank" data-localise="__MSG_frontend__") Frontend
if services[service].embeddable if Object.keys(services[service].frontends).length> 1
div(class="some-block option-block") div(class="some-block option-block")
h4(data-localise="__MSG_redirectType__") Redirect Type h4
select(id=service+"-redirectType") a(class="frontend_name" target="_blank" data-localise="__MSG_frontend__") Frontend
option(value="both" data-localise="__MSG_both__") both select(id=service+"-frontend")
option(value="sub_frame" data-localise="__MSG_onlyEmbedded__") Only Embedded each val, frontend in services[service].frontends
option(value="main_frame" data-localise="__MSG_onlyNotEmbedded__") Only Not Embedded option(value=frontend)=services[service].frontends[frontend].name
else
div(class="some-block option-block")
h4
a(class="frontend_name" target="_blank" data-localise="__MSG_frontend__") Frontend
hr if services[service].embeddable
div(class="some-block option-block")
h4(data-localise="__MSG_redirectType__") Redirect Type
select(id=service+"-redirectType")
option(value="both" data-localise="__MSG_both__") both
option(value="sub_frame" data-localise="__MSG_onlyEmbedded__") Only Embedded
option(value="main_frame" data-localise="__MSG_onlyNotEmbedded__") Only Not Embedded
each val, frontend in services[service].frontends hr
if services[service].frontends[frontend].instanceList
div(id=frontend)
div(class="some-block option-block")
h4(data-localise="__MSG_instances__") Add your favorite instances
form(class="custom-instance-form") each val, frontend in services[service].frontends
if services[service].frontends[frontend].instanceList
div(id=frontend)
div(class="some-block option-block") div(class="some-block option-block")
input(class="custom-instance" placeholder=`http://${frontend}.com` type="url" ) h4(data-localise="__MSG_instances__") Add your favorite instances
button(class="add add-instance" type="submit")
svg(xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor")
path(d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z")
div(class="checklist custom-checklist") form(class="custom-instance-form")
div(class="some-block option-block")
input(class="custom-instance" placeholder=`http://${frontend}.com` type="url" )
button(class="add add-instance" type="submit")
svg(xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor")
path(d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z")
each val, network in networks div(class="checklist custom-checklist")
div(class=network)
div(class="checklist") each val, network in networks
if (network == 'clearnet') div(class=network)
div(class="some-block option-block") Loading... div(class="checklist")
if (network == 'clearnet')
div(class="some-block option-block") Loading...