display greeting text somewhat better

scripts/getPreferences.js

@@ -40,8 +40,10 @@ localStorage.getItem("text-startpage:enableGreeting")
 let greetingText = "";
 localStorage.getItem("text-startpage:greetingText")
     ? (greetingText = localStorage.getItem("text-startpage:greetingText"))
-    : (greetingText = "Hello");
-let greetingName = localStorage.getItem("text-startpage:greetingName");
+    : (greetingText = null);
+let greetingName = localStorage.getItem("text-startpage:greetingName")
+    ? localStorage.getItem("text-startpage:greetingName")
+    : null;
 
 //clock
 let enableClock = localStorage.getItem("text-startpage:enableClock");

scripts/greetings.js

@@ -1,21 +1,25 @@
-let greetingsShown = false
+let greetingsShown = false;
 setTimeout(() => {
-    if(enableGreeting == "true" && greetingText && greetingName) {
-        document.getElementById("greetings-text").innerText = `${greetingText}, ${greetingName}.`
-        greetingsShown = true
+    if (enableGreeting == "true" && (greetingText || greetingName)) {
+        document.getElementById("greetings-text").innerText = `${
+            greetingText ? greetingText : ""
+        } ${greetingText && greetingName ? ", " : ""} ${
+            greetingName ? greetingName : ""
+        }.`;
+        greetingsShown = true;
     } else {
-        greetingsShown = false
+        greetingsShown = false;
     }
 }, 10);
 
 setTimeout(() => {
-    if(enableClock == "true") {
-        document.getElementById("clock-container").style.top = 0
+    if (enableClock == "true") {
+        document.getElementById("clock-container").style.top = 0;
     }
 }, 10);
 
 setTimeout(() => {
-    if(greetingsShown == true || enableClock == "true") {
-        document.getElementById("greetings-container").style.top = "2.5vh"
+    if (greetingsShown == true || enableClock == "true") {
+        document.getElementById("greetings-container").style.top = "2.5vh";
     }
-}, 20);
+}, 20);

scripts/preferences/greetingSettings.js

@@ -1,49 +1,70 @@
-const enableGreetingCheckbox = document.getElementById("enable-greeting")
-const greetingTextInput = document.getElementById("greeting-text")
-const greetingNameInput = document.getElementById("greeting-name")
-const greetingPreview = document.getElementById("greeting-preview")
+const enableGreetingCheckbox = document.getElementById("enable-greeting");
+const greetingTextInput = document.getElementById("greeting-text");
+const greetingNameInput = document.getElementById("greeting-name");
+const greetingPreview = document.getElementById("greeting-preview");
 
-let enableGreeting = localStorage.getItem("text-startpage:enableGreeting")
-let greetingText = localStorage.getItem("text-startpage:greetingText")
-let greetingName = localStorage.getItem("text-startpage:greetingName")
+let enableGreeting = localStorage.getItem("text-startpage:enableGreeting");
+let greetingText = localStorage.getItem("text-startpage:greetingText");
+let greetingName = localStorage.getItem("text-startpage:greetingName");
 
-if(!enableGreeting) enableGreeting = false
-enableGreetingCheckbox.checked = JSON.parse(enableGreeting)
-greetingTextInput.value = greetingText
-greetingNameInput.value = greetingName
+if (!enableGreeting) enableGreeting = false;
+enableGreetingCheckbox.checked = JSON.parse(enableGreeting);
+greetingTextInput.value = greetingText;
+greetingNameInput.value = greetingName;
 
-if(enableGreeting == "true") {
-    greetingPreview.innerHTML = `Greeting Preview: '${greetingTextInput.value}, ${greetingNameInput.value}.'`
+if (enableGreeting == "true") {
+    greetingPreview.innerHTML = `Greeting Preview: '${
+        greetingText ? greetingText : ""
+    } ${greetingText && greetingName ? ", " : ""} ${
+        greetingName ? greetingName : ""
+    }.'`;
 }
 
 document.addEventListener("keyup", () => {
-    if(enableGreeting == "true" || enableGreeting == true) {
-        greetingPreview.innerHTML = `Greeting Preview: '${greetingTextInput.value}, ${greetingNameInput.value}.'`
+    if (enableGreeting == "true" || enableGreeting == true) {
+        greetingPreview.innerHTML = `Greeting Preview: '${
+            greetingText ? greetingText : ""
+        } ${greetingText && greetingName ? ", " : ""} ${
+            greetingName ? greetingName : ""
+        }.'`;
     }
-})
+});
 
 enableGreetingCheckbox.addEventListener("change", () => {
-    localStorage.setItem("text-startpage:enableGreeting", enableGreetingCheckbox.checked)
-    enableGreeting = enableGreetingCheckbox.checked
-    if(!enableGreeting) {
-        greetingNameInput.value = ""
-        greetingTextInput.value = ""
-        localStorage.setItem("text-startpage:greetingText", "")
-        localStorage.setItem("text-startpage:greetingName", "")
-        greetingName = ""
-        greetingText = ""
+    localStorage.setItem(
+        "text-startpage:enableGreeting",
+        enableGreetingCheckbox.checked
+    );
+    enableGreeting = enableGreetingCheckbox.checked;
+    if (!enableGreeting) {
+        greetingNameInput.value = "";
+        greetingTextInput.value = "";
+        localStorage.setItem("text-startpage:greetingText", "");
+        localStorage.setItem("text-startpage:greetingName", "");
+        greetingName = "";
+        greetingText = "";
     }
-    if(enableGreeting == "true" || enableGreeting == true) {
-        greetingPreview.innerHTML = `Greeting Preview: '${greetingTextInput.value}, ${greetingNameInput.value}.'`
+    if (enableGreeting == "true" || enableGreeting == true) {
+        greetingPreview.innerHTML = `Greeting Preview: '${
+            greetingText ? greetingText : ""
+        } ${greetingText && greetingName ? ", " : ""} ${
+            greetingName ? greetingName : ""
+        }.'`;
     } else {
-        greetingPreview.innerHTML = ""
+        greetingPreview.innerHTML = "";
     }
-})
+});
 
 greetingTextInput.addEventListener("change", () => {
-    localStorage.setItem("text-startpage:greetingText", greetingTextInput.value)
-})
+    localStorage.setItem(
+        "text-startpage:greetingText",
+        greetingTextInput.value
+    );
+});
 
 greetingNameInput.addEventListener("change", () => {
-    localStorage.setItem("text-startpage:greetingName", greetingNameInput.value)
-})
+    localStorage.setItem(
+        "text-startpage:greetingName",
+        greetingNameInput.value
+    );
+});