sleek can now be minimized to tray bar (WIP), datepicker is included as node...

sleek can now be minimized to tray bar (WIP), datepicker is included as node module, Apple ARM64 support

.gitignore

@@ -20,3 +20,4 @@ assets/icons/bak
 squashfs-root/
 test/
 src/__tests__
+yarn.lock

README.md

@@ -61,7 +61,7 @@ You can download sleek for Windows, MacOS and Linux from
 ### Build sleek from source code
 1. Setup <a href="https://docs.github.com/en/github/getting-started-with-github/set-up-git" target="blank">Git</a>, <a href="https://nodejs.org/" target="blank">node.js</a> and <a href="https://yarnpkg.com/getting-started" target="blank">yarn</a>.
 2. Clone sleek `git clone https://github.com/ransome1/sleek.git` and cd into sleeks directory
-3. Install dependencies `yarn install`
+3. Install dependencies `yarn install --production`
 4. Build sleek `yarn build:windows` or `yarn build:linux` or `yarn build:macos`
 
 ### sleeks Roadmap 2021

assets/icons/tray/tray.svg

+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="1000"
+   height="1000"
+   viewBox="0 0 264.58333 264.58334"
+   version="1.1"
+   id="svg8"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)"
+   sodipodi:docname="20210503_sleek_tray.svg"
+   inkscape:export-filename="/home/ransome/Development/sleek/assets/icons/tray/tray@4x.png"
+   inkscape:export-xdpi="6.1399999"
+   inkscape:export-ydpi="6.1399999">
+  <defs
+     id="defs2">
+    <linearGradient
+       id="linearGradient943"
+       osb:paint="solid">
+      <stop
+         style="stop-color:#075a44;stop-opacity:1;"
+         offset="0"
+         id="stop941" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       id="sleek_gradiant">
+      <stop
+         style="stop-color:#075a44;stop-opacity:1"
+         offset="0"
+         id="stop855" />
+      <stop
+         style="stop-color:#bc30ba;stop-opacity:1"
+         offset="1"
+         id="stop857" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#sleek_gradiant"
+       id="linearGradient863"
+       gradientUnits="userSpaceOnUse"
+       x1="20.609758"
+       y1="-35.978325"
+       x2="-376.78461"
+       y2="-271.12573" />
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#sleek_gradiant"
+       id="linearGradient913"
+       x1="-264.05746"
+       y1="-60.426601"
+       x2="-5.0754561"
+       y2="-201.82214"
+       gradientUnits="userSpaceOnUse" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.69044441"
+     inkscape:cx="473.99304"
+     inkscape:cy="542.20488"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer2"
+     inkscape:document-rotation="0"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1874"
+     inkscape:window-height="1051"
+     inkscape:window-x="46"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:pagecheckerboard="true"
+     showborder="false" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="outer gradiant">
+    <rect
+       style="opacity:1;fill:url(#linearGradient863);fill-opacity:1;stroke:none;stroke-width:0.28639;stroke-opacity:1"
+       id="rect184"
+       width="264.29694"
+       height="264.29694"
+       x="-264.44012"
+       y="-264.44012"
+       inkscape:export-filename="/home/ransome/development/sleek/assets/icons/300x300.png"
+       inkscape:export-xdpi="28.799999"
+       inkscape:export-ydpi="28.799999"
+       transform="scale(-1)"
+       ry="132.14847" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="inner gradiant">
+    <rect
+       style="opacity:0.531869;mix-blend-mode:normal;fill:url(#linearGradient913);fill-opacity:1;stroke:none;stroke-width:0.28639;stroke-opacity:1"
+       id="rect184-3"
+       width="195.59337"
+       height="195.59337"
+       x="-230.18045"
+       y="-231.50604"
+       inkscape:export-filename="/home/ransome/development/sleek/assets/icons/300x300.png"
+       inkscape:export-xdpi="28.799999"
+       inkscape:export-ydpi="28.799999"
+       transform="scale(-1)"
+       ry="97.796684"
+       rx="97.796684" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="sleek (text)"
+     style="display:none"
+     sodipodi:insensitive="true">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:90.07px;line-height:90%;font-family:FreeSans;-inkscape-font-specification:'FreeSans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;letter-spacing:-4.50352px;word-spacing:0px;stroke-width:0.264583"
+       x="130.22496"
+       y="165.18904"
+       id="text1012-5"
+       inkscape:export-filename="/home/ransome/development/sleek/assets/icons/300x300.png"
+       inkscape:export-xdpi="28.799999"
+       inkscape:export-ydpi="28.799999"><tspan
+         x="128.72379"
+         y="165.18904"
+         style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:90.07px;font-family:FreeSans;-inkscape-font-specification:'FreeSans Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;text-align:center;letter-spacing:-3.00234px;text-anchor:middle;fill:#ffffff;stroke-width:0.264583"
+         dx="0 0 0 0 0 0 0 0 0 0 0"
+         dy="0 0 0 0 0 0 0 0 0 0 0"
+         rotate="0 0 0 0 0 0 0 0 0 0 0 0 0 0"
+         sodipodi:role="line"
+         id="tspan1178-6">sleek</tspan></text>
+  </g>
+</svg>

package.json

 {
   "name": "sleek",
   "productName": "sleek",
-  "version": "1.0.3",
+  "version": "1.0.3-3",
   "description": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
   "synopsis": "Todo app based on todo.txt for Linux, Windows and MacOS, free and open-source",
   "category": "ProjectManagement",
@@ -31,7 +31,6 @@
       "!**.md",
       "!**.gitignore",
       "!yarn.lock",
-      "!assets/icons/bak${/*}",
       "!assets/screenshots${/*}",
       "!**/node_modules/*/{CHANGELOG.md,README.md,README,readme.md,readme,test,__tests__,tests,powered-test,example,examples,*.d.ts}",
       "!**/node_modules/.bin",
@@ -52,7 +51,10 @@
       ]
     },
     "mac": {
-      "target": "dmg",
+      "target": {
+        "target": "default",
+        "arch": "universal"
+      },
       "icon": "assets/icons/sleek.icns",
       "category": "public.app-category.productivity"
     },
@@ -112,10 +114,9 @@
   },
   "devDependencies": {
     "chai": "^4.3.4",
-    "electron": "^12.0.4",
+    "electron": "^12.0.6",
     "electron-builder": "^22.10.5",
     "jest": "^26.6.3",
-    "jest-electron": "^0.1.11",
     "mocha": "^8.3.2",
     "node-sass": "^5.0.0",
     "spectron": "^14.0.0"

src/css/style.css

@@ -627,7 +627,7 @@ nav {
 
 .contentContainer {
   width: 100%;
-  height: 100%;
+  height: 90%;
   text-align: center;
   display: none;
   flex-direction: column;
@@ -4432,7 +4432,7 @@ button.dropdown-item {
     .modal-card {
       margin: 0 auto;
       max-height: calc(100vh - 40px);
-      width: 640px; } }
+      width: 800px; } }
 
 .modal-close {
   background: none;

src/index.html

@@ -389,6 +389,26 @@
               </td>
             </tr>
           </table>
+
+
+          <table class="settings">
+            <tr>
+              <th colspan="100%" id="settingsTabSettingsTray"></th>
+            </tr>
+            <tr>
+              <td id="settingsTabSettingsTrayBody"></td>
+              <td>
+                <span class="toggle">
+                  <label class="switch" for="toggleTray">
+                    <input type="checkbox" id="toggleTray" tabindex="0">
+                    <span class="slider round"></span>
+                  </label>
+                </span>
+              </td>
+            </tr>
+          </table>
+
+
           <table class="settings">
             <tr>
               <th colspan="100%" id="settingsTabSettingsLogging"></th>

src/js/modules/datePicker.mjs

@@ -12,7 +12,6 @@ datePickerInput.onfocus = function () {
   resizeInput(datePickerInput);
 };
 datePickerInput.addEventListener("changeDate", function (e, detail) {
-  //let caretPosition = getCaretPosition(modalFormInput);
   // we only update the object if there is a date selected. In case of a refresh it would throw an error otherwise
   if(e.detail.date) {
     // generate the object on what is written into input, so we don't overwrite previous inputs of user

src/js/modules/form.mjs

 "use strict";
 import { showMore, resetModal, handleError, userData, setUserData, translations, resizeInput } from "../../render.js";
 import { generateFilterData } from "./filters.mjs";
-import { items, item } from "./todos.mjs";
+import { items, item, setTodoComplete } from "./todos.mjs";
 import { datePickerInput } from "./datePicker.mjs";
 import * as recurrencePicker from "./recurrencePicker.mjs";
 const modal = document.querySelectorAll('.modal');
@@ -10,12 +10,6 @@ modalForm.addEventListener("submit", function(e) {
   // intercept submit
   if (e.preventDefault) e.preventDefault();
   submitForm().then(response => {
-    // if form returns success we clear the modal
-    resetModal().then(function(result) {
-      console.log(result);
-    }).catch(function(error) {
-      handleError(error);
-    });
     console.log(response);
   }).catch(error => {
     handleError(error);
@@ -39,12 +33,6 @@ modalForm.addEventListener ("keydown", function (e) {
     });
   } else if(e.key==="Enter" && e.ctrlKey) {
     submitForm().then(response => {
-      // if form returns success we clear the modal
-      resetModal().then(function(result) {
-        console.log(result);
-      }).catch(function(error) {
-        handleError(error);
-      });
       console.log(response);
     }).catch(error => {
       handleError(error);
@@ -55,7 +43,7 @@ modalForm.addEventListener ("keydown", function (e) {
     }).catch(function(error) {
       handleError(error);
     });
-    this.classList.remove("is-active");
+    //this.classList.remove("is-active");
   } else if(event.key === "Escape" && autoCompleteContainer.classList.contains("is-active")) {
     autoCompleteContainer.classList.remove("is-active");
   }
@@ -119,6 +107,22 @@ priorityPicker.onfocus = function () {
   // close suggestion box if focus comes to priority picker
   autoCompleteContainer.classList.remove("is-active");
 };
+const btnItemStatus = document.getElementById("btnItemStatus");
+btnItemStatus.onclick = function() {
+  setTodoComplete(this.parentElement.parentElement.parentElement.parentElement.getAttribute("data-item")).then(response => {
+    modalForm.classList.remove("is-active");
+    resetModal().then(function(result) {
+      console.log(result);
+    }).catch(function(error) {
+      handleError(error);
+    });
+    console.log(response);
+    // trigger matomo event
+    if(window.consent) _paq.push(["trackEvent", "Form", "Click on Done/In progress"]);
+  }).catch(error => {
+    handleError(error);
+  });
+}
 function show(todo, templated) {
   try {
     // adjust size of recurrence picker input field
@@ -306,10 +310,10 @@ function toggleInputSize(type) {
       break;
   }
   d.id = "modalFormInput";
+  d.value = modalFormInput.value;
   d.setAttribute("tabindex", 300);
   d.setAttribute("class", "input is-medium");
   d.setAttribute("placeholder", translations.formTodoInputPlaceholder);
-  d.value = modalFormInput.value;
   modalFormInput.replaceWith(d);
   // if input is a textarea, adjust height to content length
   if(modalFormInput.tagName==="TEXTAREA") {
@@ -330,6 +334,12 @@ function submitForm() {
     // check if there is an input in the text field, otherwise indicate it to the user
     // input value and data item are the same, nothing has changed, nothing will be written
     if (modalForm.getAttribute("data-item")===modalForm.elements[0].value) {
+      // close and reset any modal
+      resetModal().then(function(result) {
+        console.log(result);
+      }).catch(function(error) {
+        handleError(error);
+      });
       return Promise.resolve("Info: Nothing has changed, won't write anything.");
     // Edit todo
     } else if(modalForm.getAttribute("data-item")!=null) {
@@ -386,6 +396,12 @@ function submitForm() {
     //write the data to the file
     // a newline character is added to prevent other todo.txt apps to append new todos to the last line
     window.api.send("writeToFile", [items.objects.join("\n").toString() + "\n", userData.file]);
+    // close and reset any modal
+    resetModal().then(function(result) {
+      console.log(result);
+    }).catch(function(error) {
+      handleError(error);
+    });
     // trigger matomo event
     if(window.consent) _paq.push(["trackEvent", "Form", "Submit"]);
     return Promise.resolve("Success: Changes written to file: " + userData.file);

src/js/modules/menu.js

+/*const { Menu } = require("electron");
+const { appData, mainWindow } = require("../../main.js");
+const { setLanguage } = require("./main.js");
+const fs = require("fs");
+let translations;
+setLanguage().then(function(data) {
+  translations = data;
+});
+const menuTemplate = [
+  {
+    label: translations.file,
+    submenu: [
+      {
+        label: translations.openFile,
+        accelerator: "CmdOrCtrl+o",
+        click: function (item, focusedWindow) {
+          openDialog("open");
+        }
+      },
+      {
+        label: translations.createFile,
+        click: function (item, focusedWindow) {
+          openDialog("create");
+        }
+      },
+      appData.os==="mac" ? {
+        role: "quit",
+        label: translations.close
+      } : {
+        role: "close",
+        label: translations.close
+      }
+    ]
+  },
+  {
+    label: translations.edit,
+    submenu: [
+    {
+      label: translations.settings,
+      accelerator: "CmdOrCtrl+,",
+      click: function () {
+        mainWindow.webContents.send("triggerFunction", "showContent", ["modalSettings"]);
+      }
+    },
+    { type: "separator" },
+    { label: translations.cut, accelerator: "CmdOrCtrl+X", selector: "cut:" },
+    { label: translations.copy, accelerator: "CmdOrCtrl+C", selector: "copy:" },
+    { label: translations.paste, accelerator: "CmdOrCtrl+V", selector: "paste:" }
+  ]},
+  {
+    label: translations.todos,
+    submenu: [
+      {
+        label: translations.addTodo,
+        accelerator: "CmdOrCtrl+n",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "showForm")
+        }
+      },
+      {
+        label: translations.find,
+        accelerator: "CmdOrCtrl+f",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.executeJavaScript("todoTableSearch.focus()");
+        }
+      },
+      {
+        label: translations.archive,
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "archiveTodos")
+        }
+      }
+    ]
+  },
+  {
+    label: translations.view,
+    submenu: [
+      {
+        label: translations.toggleFilter,
+        accelerator: "CmdOrCtrl+b",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "showDrawer", ["toggle", "navBtnFilter", "filterDrawer"])
+        }
+      },
+      {
+        label: translations.resetFilters,
+        accelerator: "CmdOrCtrl+l",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "resetFilters")
+        }
+      },
+      {
+        label: translations.toggleCompletedTodos,
+        accelerator: "CmdOrCtrl+h",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "toggleTodos", ["showCompleted"])
+        }
+      },
+      { type: "separator" },
+      {
+        label: translations.toggleDarkMode,
+        accelerator: "CmdOrCtrl+d",
+        click: function (item, focusedWindow) {
+          mainWindow.webContents.send("triggerFunction", "setTheme", [true])
+        }
+      },
+      {
+        role: "reload",
+        label: translations.reload
+      }
+    ]
+  },
+  {
+    label: translations.about,
+    submenu: [
+      {
+        label: translations.help,
+        click: function () {
+          mainWindow.webContents.send("triggerFunction", "showContent", ["modalHelp"])
+        }
+      },
+      {
+        label: translations.sleekOnGithub,
+        click: () => {require("electron").shell.openExternal("https://github.com/ransome1/sleek")}
+      },
+      {
+        role: "toggleDevTools",
+        label: translations.devTools
+      }
+    ]
+  }
+];
+exports.menuTemplate = menuTemplate;*/

src/js/modules/todos.mjs

@@ -594,4 +594,4 @@ function generateHash(str) {
     (((prevHash << 5) - prevHash) + currVal.charCodeAt(0))|0, 0);
 }
 
-export { generateItems, generateGroups, generateTable, items, item, visibleRows };
+export { generateItems, generateGroups, generateTable, items, item, visibleRows, setTodoComplete };

src/locales/de/translation.json

@@ -105,6 +105,8 @@
   "settingsTabAboutExternalLibraries": "Eingesetzte Software, die nicht von mir stammt",
   "settingsTabSettingsArchive": "Aufgaben archivieren",
   "settingsTabSettingsArchiveBody": "Erledigte Aufgaben werden aus der todo.txt-Datei entfernt und in eine done.txt-Datei eingefügt. Diese wird im gleichen Ordner angelegt, falls sie noch nicht existiert.",
+  "settingsTabSettingsTray": "In die Tray-Leiste minimieren",
+  "settingsTabSettingsTrayBody": "In dieser Einstellung wird sleek in die Tray-Leiste minimiert und ist nicht mehr in der Task-Bar sichtbar. <strong>sleek wird sich selbst neustarten. Wenn das nicht passiert, starte das Programm bitte händisch neu.</strong>",
   "archive": "Archivieren",
   "shortcuts": "Shortcuts",
   "function": "Function",