Add link opening differentiation and copying

diff --git a/app/settings.html b/app/settings.html
index 87e783a7c9a10d3a1a31deaddefad1a87e8ffe89..39e032da8c6773aa0b8cc20a050c1a3fc28c4552 100644 (file)
--- a/app/settings.html
+++ b/app/settings.html
@@ -36,6 +36,12 @@
           <label class="red"><input type="radio" class="themes_select" name="theme" value="red"></label>
           <label class="purple"><input type="radio" class="themes_select" name="theme" value="purple"></label>
         </div>
+        <div class="form">
+          <div>
+            <p>search engine</p>
+            <input type="text" id="searchEngine">
+          </div>
+        </div>
         <h3>sync server</h3>
         <div class="form">
           <div>

diff --git a/app/settings.js b/app/settings.js
index cca8ac45a33ff87115034e5e121cf66f6ed1429f..a78974414ed1e2049ca23747cafbc013a96e46e6 100644 (file)
--- a/app/settings.js
+++ b/app/settings.js
@@ -6,6 +6,7 @@ var archived = [];
 var theme = {
   colorScheme: "default",
   css: "",
+  searchEngine: "https://duckduckgo.com/?ia=web&q=",
   showCompleted: false
 };
 var server = {
@@ -30,6 +31,15 @@ if (localStorage.getItem("theme")) {
   theme = JSON.parse(localStorage.getItem("theme"));
 }
 
+const searchEngineElement = document.getElementById("searchEngine");
+searchEngineElement.value = theme.searchEngine;
+
+searchEngineElement.addEventListener("input", (event) => {
+
+  theme.searchEngine = event.target.value;
+  backupData();
+});
+
 const serverAddressElement = document.getElementById("serverAddress");
 
 if (localStorage.getItem("server")) {

diff --git a/app/todos.js b/app/todos.js
index 047dadbdf3339ad55b812db48f88b15ae718020e..7ba3a55a1197c570fe29fe55bcc3279f97ed5cd8 100644 (file)
--- a/app/todos.js
+++ b/app/todos.js
@@ -6,6 +6,7 @@ var archived = [];
 var theme = {
   colorScheme: "default",
   css: "",
+  searchEngine: "https://duckduckgo.com/?ia=web&q=",
   showCompleted: false
 };
 
@@ -104,7 +105,8 @@ const todoElement = (item, index, isCompleted = false) => {
       <div class="data">
         <textarea id="todo-${targetText}-${index}-description">${item.description}</textarea>
         <div>
-          ${(item.description.match(/^https?:\/\/.*...*$/g)) ? "<a href='" + item.description + "' target='_blank' class='embedded'>open</a>" : ""}
+          <a href='${(item.description.match(/^https?:\/\/.*...*$/g)) ? item.description : theme.searchEngine + item.description}' target='_blank' class='embedded'>open</a>
+          <p id="todo-${targetText}-${index}-copy">copy</p>
           <p id="todo-${targetText}-${index}-${(page == 'home') ? 'archive' : 'restore'}">${(page == 'home') ? 'archive' : 'restore'}</p>
           <p id="todo-${targetText}-${index}-delete">delete</p>
         </div>
@@ -147,6 +149,8 @@ const applyListeners = () => {
       backupData();
     });
 
+    copyHelper(`todo-archived-${i}-copy`);
+
     document.getElementById(`todo-archived-${i}-restore`).addEventListener("click", (event) => {
 
       todos.uncompleted = [
@@ -192,6 +196,8 @@ const applyListeners = () => {
       backupData();
     });
 
+    copyHelper(`todo-uncompleted-${i}-copy`);
+    
     document.getElementById(`todo-uncompleted-${i}-archive`).addEventListener("click", (event) => {
 
       archived = [
@@ -233,6 +239,8 @@ const applyListeners = () => {
       hydrateTodos();
       backupData();
     });
+
+    copyHelper(`todo-completed-${i}-copy`);
     
     document.getElementById(`todo-completed-${i}-archive`).addEventListener("click", (event) => {
 
@@ -255,6 +263,37 @@ const applyListeners = () => {
   }
 }
 
+const copyHelper = (target) => {
+
+  document.getElementById(target).addEventListener("click", (event) => {
+
+    const targetKeys = target.split("-");
+
+    var targetItem;
+
+    switch (targetKeys[1]) {
+      case "uncompleted":
+        targetText = todos.uncompleted[targetKeys[2]];
+        break;
+      case "completed":
+        targetText = todos.completed[targetKeys[2]];
+        break;
+      case "archived":
+        targetText = archived[targetKeys[2]];
+        break;
+      default:
+        break;
+    }
+
+    navigator.clipboard.writeText(targetText.description);
+
+    event.target.innerHTML = "copied!";
+    setTimeout(() => {
+      event.target.innerHTML = "copy";
+    }, 1000);
+  });
+}
+
 const hydrateArchived = () => {
 
   if (archived.length > 0) archivedElement.innerHTML = archived