khairul169/honey
1
0
Fork 0
mirror of https://github.com/khairul169/honey.git synced 2026-10-04 18:03:54 +07:00
Code Issues Actions Packages Projects Releases Wiki Activity

Rebrand Settings to More

Browse Source
This commit is contained in:
Daniel
2023-10-23 23:32:25 +02:00
parent 1938eb100d
commit 315fb5221d
20 changed files with 355 additions and 288 deletions
Download Patch File Download Diff File Expand all files Collapse all files
js/UI/Drawer/Drawer.js
+2 -2
View File
@@ -1,7 +1,7 @@
import App from "../../App";
export default class Drawer {
constructor(name) {
constructor() {
this.app = new App()
this.config = this.app.config
this.init()
@@ -24,4 +24,4 @@ export default class Drawer {
</a>`
}
}
}
}
js/UI/Home/Home.js
+5 -1
View File
@@ -7,11 +7,15 @@ export default class Home {
this.app = new App()
this.config = this.app.config
this.init()
}
init() {
this.initButtons()
this.initHomeUI()
this.initBackButtons()
}
init() {
initButtons() {
let buttons = document.getElementsByClassName("buttons")[0].children
for (let button of buttons) {
let target = button.getAttribute("t")
js/UI/More/More.js
+40
View File
@@ -0,0 +1,40 @@
import App from "../../App";
import Privacy from "./Privacy/Privacy";
import Settings from "./Settings/Settings";
export default class More {
constructor() {
this.app = new App()
this.config = this.app.config
this.privacy = new Privacy()
this.settings = new Settings()
this.init()
}
init() {
this.privacy.init()
this.settings.init()
this.initPager()
}
initPager() {
let switcher = document.getElementById("switch")
let buttons = switcher.children
let subsettings = document.getElementById("subsettings")
for (let i = 0; i < buttons.length; i++) {
let button = buttons[i]
subsettings.children[i].setAttribute("style", `--n: ${i}`)
button.addEventListener("click", () => {
let calculatedHeight = subsettings.children[i].offsetHeight
subsettings.style.height = `${calculatedHeight}px`
subsettings.parentNode.setAttribute("style", `--id: ${i}`)
switcher.setAttribute("style", `--switches: ${buttons.length}`)
})
}
buttons[0].click()
}
}
js/UI/Settings/Settings.js → js/UI/More/Privacy/Privacy.js
+11 -69
View File
@@ -1,74 +1,19 @@
import App from "../../App";
import * as EVENTS from "./events";
import { analyzeService } from "./security";
import * as tiles from "./tiles"
import App from "../../../App";
import { analyzeService } from "./analyzer";
import { privacyBox } from "./tiles";
export default class Settings {
export default class Privacy {
constructor() {
this.app = new App()
this.config = this.app.config
this.init()
}
init() {
this.checkLocalStorage()
this.initSecurityPanel()
this.initSettings()
this.initPager()
this.initPrivacyPanel()
}
initSettings() {
let darkMode = tiles.addOnOffTile(this.config,
"dark_mode", "Dark mode",
"Make the colors more appropriate for low-light environments",
"dark_mode", EVENTS.onThemeChange
)
tiles.addOnOffTile(this.config,
"open_in_new", "Open in new tab",
"Clicking on application will open it in a new browser tab",
"open_new_tab", EVENTS.onNewTabChange
)
tiles.addOnOffTile(this.config,
"blur_on", "Enable blur",
"Improves UI sweetness but may have a huge impact on performance",
"blur", EVENTS.onBlurChange
)
tiles.addOnOffTile(this.config,
"animation", "Animations",
"Show nice and fancy page transitions for improved experience",
"animations", EVENTS.onAnimationChange
)
document.getElementById("theme-switcher").addEventListener("click", () => {
darkMode.click()
})
}
initPager() {
let switcher = document.getElementById("switch")
let buttons = switcher.children
let subsettings = document.getElementById("subsettings")
for (let i = 0; i < buttons.length; i++) {
let button = buttons[i]
subsettings.children[i].setAttribute("style", `--n: ${i}`)
button.addEventListener("click", () => {
let calculatedHeight = subsettings.children[i].offsetHeight
subsettings.style.height = `${calculatedHeight}px`
subsettings.parentNode.setAttribute("style", `--id: ${i}`)
switcher.setAttribute("style", `--switches: ${buttons.length}`)
})
}
buttons[0].click()
}
initSecurityPanel() {
initPrivacyPanel() {
let stats = {
total: 0,
secure: 0,
@@ -83,7 +28,8 @@ export default class Settings {
let secure_pp = 100 * stats.secure / stats.total
let indepencence_pp = 100 * (stats.total - stats.thirdParties) / stats.total
let privacy_score = secure_pp * 0.5 + indepencence_pp * 0.5
let https_importance = this.config.get("https_importance")
let privacy_score = secure_pp * https_importance + indepencence_pp * (1 - https_importance)
let privacy_report;
if (privacy_score == 100) {
@@ -101,7 +47,7 @@ export default class Settings {
document.getElementById("report").innerText = privacy_report
const phrase = " of the listed services are using secure connections"
tiles.privacyBox(secure_pp, "icon-https", [
privacyBox(secure_pp, "icon-https", [
{
"from": 0,
"name": "No encryption",
@@ -129,7 +75,7 @@ export default class Settings {
}
])
tiles.privacyBox(indepencence_pp, "icon-rocket", [
privacyBox(indepencence_pp, "icon-rocket", [
{
"from": 0,
"name": "Not independent",
@@ -153,8 +99,4 @@ export default class Settings {
])
}
checkLocalStorage() {
let warn = document.getElementById("no-cookies").classList
if (this.config.storageAvailable) warn.add("hidden")
}
}
}
js/UI/Settings/security.js → js/UI/More/Privacy/analyzer.js
View File
js/UI/More/Privacy/tiles.js
+27
View File
@@ -0,0 +1,27 @@
export function privacyBox(privacyScore, icon_class, levels) {
let name, desc
levels = levels.reverse()
for (let i in levels) {
let item = levels[i]
if (item.from <= privacyScore) {
name = levels[i].name
desc = levels[i].desc
break
}
}
let item = document.createElement("div")
item.innerHTML = `<i class="${icon_class}"></i>
<div>
<div class="title">${name}</div>
<div class="subtitle">${desc}</div>
</div>`
if (privacyScore < 30) item.classList.add("error")
else if (privacyScore < 90) item.classList.add("warn")
else if (privacyScore < 100) item.classList.add("prewarn")
document.getElementById("report-boxes").appendChild(item)
return item
}
js/UI/More/Settings/Settings.js
+51
View File
@@ -0,0 +1,51 @@
import App from "../../../App";
import { addOnOffTile } from "./tiles";
import * as EVENTS from "./events"
export default class Settings {
constructor() {
this.app = new App()
this.config = this.app.config
}
init() {
this.checkLocalStorage()
this.initSettings()
}
initSettings() {
let darkMode = addOnOffTile(this.config,
"dark_mode", "Dark mode",
"Make the colors more appropriate for low-light environments",
"dark_mode", EVENTS.onThemeChange
)
addOnOffTile(this.config,
"open_in_new", "Open in new tab",
"Clicking on application will open it in a new browser tab",
"open_new_tab", EVENTS.onNewTabChange
)
addOnOffTile(this.config,
"blur_on", "Enable blur",
"Improves UI sweetness but may have a huge impact on performance",
"blur", EVENTS.onBlurChange
)
addOnOffTile(this.config,
"animation", "Animations",
"Show nice and fancy page transitions for improved experience",
"animations", EVENTS.onAnimationChange
)
document.getElementById("theme-switcher").addEventListener("click", () => {
darkMode.click()
})
}
checkLocalStorage() {
let warn = document.getElementById("no-cookies").classList
if (this.config.storageAvailable) warn.add("hidden")
}
}
js/UI/Settings/events.js → js/UI/More/Settings/events.js
View File
js/UI/Settings/tiles.js → js/UI/More/Settings/tiles.js
+3 -29
View File
@@ -14,10 +14,12 @@ export function addOnOffTile(conf, icon, name, desc, key, func) {
if (conf.get(key)) c.add("checked")
else c.remove("checked")
}
let write = () => {
let target_value = !conf.get(key)
conf.set(key, target_value)
}
let f = () => {func(conf)}
item.addEventListener("click", write)
@@ -28,32 +30,4 @@ export function addOnOffTile(conf, icon, name, desc, key, func) {
if (func && conf.changed(key)) f()
document.getElementById("settings").appendChild(item)
return item
}
export function privacyBox(privacyScore, icon_class, levels) {
let name, desc
levels = levels.reverse()
for (let i in levels) {
let item = levels[i]
if (item.from <= privacyScore) {
name = levels[i].name
desc = levels[i].desc
break
}
}
let item = document.createElement("div")
item.innerHTML = `<i class="${icon_class}"></i>
<div>
<div class="title">${name}</div>
<div class="subtitle">${desc}</div>
</div>`
if (privacyScore < 30) item.classList.add("error")
else if (privacyScore < 90) item.classList.add("warn")
else if (privacyScore < 100) item.classList.add("prewarn")
document.getElementById("report-boxes").appendChild(item)
return item
}
}