Read & load external config.json file

.gitignore

@@ -0,0 +1 @@
+config/config.json

config/defaults.json

@@ -0,0 +1,57 @@
+{
+	"ui": {
+		"name": "honey",
+		"desc": "Nice and sweet place for all your self-hosted services.",
+		"icon": "img/icon.png",
+		"wallpaper": "img/background.jpg",
+		"wallpaper_dark": "img/background_dark.jpg",
+		"dark_mode": false,
+		"open_new_tab": false,
+		"hosted_by": "somebody",
+		"enable_security": true
+	},
+	"services": [
+		{
+			"name": "CalDav",
+			"desc": "Simple CalDav server for calendar sync between various devices.",
+			"href": "caldav",
+			"icon": "img/preview/caldav.png"
+		},
+		{
+			"name": "Files",
+			"desc": "Fancy file manager for the web.",
+			"href": "files",
+			"icon": "img/preview/files.png"
+		},
+		{
+			"name": "Gallery",
+			"desc": "Photo & video gallery syncable with multiple Android devices.",
+			"href": "gallery",
+			"icon": "img/preview/gallery.png"
+		},
+		{
+			"name": "Git",
+			"desc": "Self-hosted, painless, secure place for your repositories.",
+			"href": "git",
+			"icon": "img/preview/git.png"
+		},
+		{
+			"name": "E-Mail",
+			"desc": "Feature-rich, decentralized and secure E-Mail server.",
+			"href": "mail",
+			"icon": "img/preview/mail.png"
+		},
+		{
+			"name": "Music",
+			"desc": "Beautiful, moody music streaming app.",
+			"href": "music",
+			"icon": "img/preview/music.png"
+		},
+		{
+			"name": "Notes",
+			"desc": "Sweet & lightweight app for taking notes.",
+			"href": "notes",
+			"icon": "img/preview/notes.png"
+		}
+	]
+}

index.html

@@ -80,8 +80,8 @@
 							<div class="box">
 								<div class="icon" style="--color: 144deg">lock</div>
 								<div>
-									<div class="name">Enryption?</div>
+									<div class="name">Enryption</div>
-									<div class="desc">HTTPS ensures data is transferred securely, that nobody can monitor your traffic.</div>
+									<div class="desc">HTTPS ensures data is transferred securely, so nobody can monitor your traffic.</div>
 								</div>
 							</div>
 							<div class="box">

js/dom.js

@@ -42,14 +42,14 @@ function mk_entry(app) {
 }
 
 function config(key, value) {
-	let def = UI[key];
+	let def = CONFIG["ui"][key];
 	let val = localStorage.getItem(key);
 	if (def == value && !val) return;
 	if (value !== undefined) {
 		localStorage.setItem(key, value);
 		return;
 	}
-	if (!val) val = UI[key].toString();
+	if (!val) val = CONFIG["ui"][key].toString();
 	return val;
 }
 

js/main.js

@@ -1,66 +1,23 @@
-var UI = {
-	"dark_mode": false
-}
-
-var SERVICES = [
-	{
-		"name": "CalDav",
-		"desc": "Simple CalDav server for calendar sync between various devices.",
-		"href": "caldav",
-		"icon": "img/preview/caldav.png"
-	},
-	{
-		"name": "Files",
-		"desc": "Fancy file manager for the web.",
-		"href": "files",
-		"icon": "img/preview/files.png"
-	},
-	{
-		"name": "Gallery",
-		"desc": "Photo & video gallery syncable with multiple Android devices.",
-		"href": "gallery",
-		"icon": "img/preview/gallery.png"
-	},
-	{
-		"name": "Git",
-		"desc": "Self-hosted, painless, secure place for your repositories.",
-		"href": "git",
-		"icon": "img/preview/git.png"
-	},
-	{
-		"name": "E-Mail",
-		"desc": "Feature-rich, decentralized and secure E-Mail server.",
-		"href": "mail",
-		"icon": "img/preview/mail.png"
-	},
-	{
-		"name": "Music",
-		"desc": "Beautiful, moody music streaming app.",
-		"href": "music",
-		"icon": "img/preview/music.png"
-	},
-	{
-		"name": "Notes",
-		"desc": "Sweet & lightweight app for taking notes.",
-		"href": "notes",
-		"icon": "img/preview/notes.png"
-	}
-]
-
 function onload() {
-	for_all("back", (btn) => {
+	let xhr = new XMLHttpRequest();
-		btn.onclick = back;
+	xhr.open("GET", "config/config.json");
-	});
+	xhr.onload = function() {
-	switch_theme(config("dark_mode") == "true");
+		CONFIG = JSON.parse(this.responseText);
-	load_apps();
+		for_all("back", (btn) => {
-	setTimeout(() => {
+			btn.onclick = show;
-		back();
+		});
-		document.body.classList.remove("init");
+		switch_theme(config("dark_mode") == "true");
-	}, 50)
+		load_apps();
+		setTimeout(() => {
+			show();
+			document.body.classList.remove("init");
+		}, 50);
+	};
+	xhr.send();
 }
 
-let CURRENT_VIEW;
 function show(id) {
+	if (typeof(id) != "string") id = "page-home";
 	CURRENT_VIEW = id;
 	for_all("page", (page) => {
 		page.classList.add("hidden");
@@ -72,10 +29,6 @@ function show(id) {
 	else bg.remove("scaled");
 }
 
-function back() {
-	show("page-home");
-}
-
 function switch_theme(value) {
 	let is_dark = get_bool("dark_mode");
 	if (value === undefined) is_dark = !is_dark; 
@@ -100,14 +53,17 @@ function switch_theme(value) {
 
 function load_apps() {
 	let final = "";
-	for (let i = 0; i < SERVICES.length; i++) {
+	for (let i = 0; i < CONFIG["services"].length; i++) {
-		let app = mk_entry(SERVICES[i]);
+		let app = mk_entry(CONFIG["services"][i]);
 		final += app;
 	}
 	get("applist").innerHTML = final;
 }
 
+let S_TAP_LOCK;
 function open_screen(button) {
+	if (S_TAP_LOCK) return;
+	S_TAP_LOCK = true;
 	let parent = button.parentNode;
 	let cursor = parent.getElementsByClassName("bg")[0];
 	let items = parent.getElementsByClassName("entry");
@@ -134,5 +90,6 @@ function open_screen(button) {
 	}, 10);
 	setTimeout(() => {
 		screens.style.height = null;
+		S_TAP_LOCK = false;
 	}, 420);
 }