Commit 7ede0c2a authored by ransome1's avatar ransome1
Browse files

Enhanced behavior when sleek is in tray

parent d0e536d2
{
"name": "sleek",
"productName": "sleek",
"version": "1.2.0-rc.2",
"version": "1.2.0-rc.3",
"description": "todo.txt manager for Linux, Windows and MacOS, free and open-source (FOSS)",
"synopsis": "todo.txt manager for Linux, Windows and MacOS, free and open-source (FOSS)",
"category": "ProjectManagement",
......
......@@ -17,13 +17,13 @@ body select {
background: transparent;
color: white;
}
body a:hover, body a:active, body a:focus {
body a, body a:hover, body a:active, body a:focus {
color: #3273dc;
}
body .button {
background-color: transparent;
}
body .button:focus:not(:active), body .button.is-focused:not(:active), body .button:active, body .button.is-active, body input[type=number], body .button:focus, body .button.is-focused, body .select select, body .textarea, body .input, body .select select:focus, body .textarea:focus, body .input:focus, body .select select.is-focused, body .is-focused.textarea, body .is-focused.input, body .select select:active, body .textarea:active, body .input:active, body .select select.is-active, body .is-active.textarea, body .is-active.input {
body button, body .button:focus:not(:active), body .button.is-focused:not(:active), body .button:active, body .button.is-active, body input[type=number], body .button:focus, body .button.is-focused, body .select select, body .textarea, body .input, body .select select:focus, body .textarea:focus, body .input:focus, body .select select.is-focused, body .is-focused.textarea, body .is-focused.input, body .select select:active, body .textarea:active, body .input:active, body .select select.is-active, body .is-active.textarea, body .is-active.input {
background: #2d2d2d;
border: none;
color: white;
......@@ -46,8 +46,8 @@ body input[type=range]:focus {
background: #f0f0f0;
}
body button:focus-visible {
color: #f0f0f0;
background: #2d2d2d;
color: white;
background: #3273dc;
}
body table {
width: 100%;
......@@ -601,8 +601,8 @@ a:focus {
button {
font-size: 1em;
color: white;
background-color: #3273dc;
color: #3273dc;
background-color: white;
border: none;
border-radius: 0.65em;
outline: none;
......@@ -616,7 +616,7 @@ button i {
button:focus-visible {
color: white;
background-color: #5a5a5a;
background-color: #3273dc;
}
button:focus-visible i {
color: inherit;
......@@ -703,7 +703,7 @@ strong {
color: white;
}
#datePickerInput {
#datePickerInput, #thresholdPickerInput {
cursor: pointer;
}
......@@ -11929,6 +11929,10 @@ input.is-medium.input {
width: 85%;
max-width: 900px;
}
.modal button {
color: white;
background-color: #3273dc;
}
.modal.content {
z-index: 60;
......@@ -11990,12 +11994,8 @@ input.is-medium.input {
.modal.content .modal-card-body ul li a {
text-decoration: underline;
}
.modal.content .modal-card-body table tr th,
.modal.content .modal-card-body table tr td {
padding: 0;
}
.modal.content .modal-card-body table.settings tr td {
padding-top: 1em;
.modal.content .modal-card-body table.settings tr th, .modal.content .modal-card-body table.settings tr td {
padding: 0.25em 0;
}
.modal.content .modal-card-body table.settings tr td .alert {
position: absolute;
......@@ -12084,10 +12084,6 @@ input.is-medium.input {
line-height: 2.5em;
float: left;
margin: 0.5em 0.5em 0.5em 0;
/*input:focus-visible,
select:focus-visible {
background-color: $light-grey;
}*/
}
#modalForm .field input,
#modalForm .field select {
......@@ -12104,6 +12100,9 @@ input.is-medium.input {
display: none;
margin: 1em 0 0 0;
}
#modalForm .message.is-active {
display: block;
}
#modalForm #autoCompleteContainer {
position: fixed;
display: none;
......@@ -12125,9 +12124,6 @@ input.is-medium.input {
overflow-y: scroll;
margin: 0;
}
#modalForm #autoCompleteContainer section button {
margin: 0 0.5rem 0.5rem 0;
}
#modalForm #autoCompleteContainer section::-webkit-scrollbar {
background-color: transparent;
width: 0.8em;
......
This diff is collapsed.
"use strict";
import { userData, translations } from "../render.js";
import { _paq } from "./matomo.mjs";
import { resizeInput } from "./form.mjs";
import { formatDate } from "./helper.mjs";
import { items, currentTodo, editTodo } from "./todos.mjs";
import { RecExtension, SugarDueExtension, ThresholdExtension } from "./todotxtExtensions.mjs";
import "../../node_modules/jstodotxt/jsTodoExtensions.js";
import "../../node_modules/jstodotxt/jsTodoTxt.js";
import Datepicker from "../../node_modules/vanillajs-datepicker/js/Datepicker.js";
import de from "../../node_modules/vanillajs-datepicker/js/i18n/locales/de.js";
import it from "../../node_modules/vanillajs-datepicker/js/i18n/locales/it.js";
import es from "../../node_modules/vanillajs-datepicker/js/i18n/locales/es.js";
import fr from "../../node_modules/vanillajs-datepicker/js/i18n/locales/fr.js";
const autoCompleteContainer = document.getElementById("autoCompleteContainer");
const datePickerThresholdInput = document.getElementById("thresholdPickerInput");
const datePickerContainer = document.querySelector(".datepicker.datepicker-dropdown");
datePickerThresholdInput.onfocus = function () {
datePickerThreshold.show();
autoCompleteContainer.classList.remove("is-active");
resizeInput(datePickerThresholdInput);
};
datePickerThresholdInput.addEventListener("changeDate", function (e) {
// we only update the object if there is a date selected. In case of a refresh it would throw an error otherwise
if(document.getElementById("modalForm").classList.contains("is-active")) {
// generate the object on what is written into input, so we don't overwrite previous inputs of user
let todo = new TodoTxtItem(document.getElementById("modalFormInput").value, [ new SugarDueExtension(), new HiddenExtension(), new RecExtension(), new ThresholdExtension() ]);
if(datePickerThreshold.getDate()) {
todo.t = datePickerThreshold.getDate();
todo.tString = formatDate(datePickerThreshold.getDate());
} else {
// in case delete button is pushed
todo.t = undefined;
todo.tString = undefined;
}
// if suggestion box was open, it needs to be closed
autoCompleteContainer.classList.remove("is-active");
autoCompleteContainer.blur();
// if a due date is set, the recurrence picker will be shown);
document.getElementById("modalFormInput").value = todo.toString();
document.getElementById("modalFormInput").focus();
resizeInput(datePickerThresholdInput);
datePickerThreshold.hide();
// trigger matomo event
if(userData.matomoEvents) _paq.push(["trackEvent", "Form", "Datepicker used to add date to input"]);
} else {
// get position of current todo in array
const index = items.objects.map(function(item) {return item.toString(); }).indexOf(currentTodo.toString());
// change the date
if(datePickerThreshold.getDate()) {
currentTodo.t = datePickerThreshold.getDate();
currentTodo.tString = formatDate(datePickerThreshold.getDate());
} else {
// in case delete button is pushed
currentTodo.t = undefined;
currentTodo.tString = undefined;
}
// finally pass new todo on for changing
editTodo(index, currentTodo);
// trigger matomo event
if(userData.matomoEvents) _paq.push(["trackEvent", "Todo-Table", "Datepicker used to change a date"]);
}
document.querySelector(".datepicker.datepicker-dropdown").classList.remove("visible");
});
datePickerThresholdInput.placeholder = translations.formSelectThreshold;
Object.assign(Datepicker.locales, de, it, es, fr);
const datePickerThreshold = new Datepicker(datePickerThresholdInput, {
autohide: true,
language: userData.language,
format: "yyyy-mm-dd",
clearBtn: true,
calendarWeeks: true,
weekStart: 1,
beforeShowDay: function(date) {
let today = new Date();
if (date.getDate() == today.getDate() &&
date.getMonth() == today.getMonth() &&
date.getFullYear() == today.getFullYear()) {
return { classes: 'today'};
}
}
});
// document.querySelector(".datepicker .clear-btn").onclick = function() {
// let todo = new TodoTxtItem(document.getElementById("modalFormInput").value, [ new SugarDueExtension(), new HiddenExtension(), new RecExtension(), new ThresholdExtension() ]);
// todo.due = undefined;
// todo.dueString = undefined;
// document.getElementById("modalFormInput").value = todo.toString();
// resizeInput(datePickerThresholdInput);
// datePickerThreshold.hide();
// }
export { datePickerThresholdInput, datePickerThreshold };
......@@ -499,73 +499,70 @@ function configureWindowEvents() {
}
function setupTray() {
mainWindow
.on("minimize",function(event){
.on("close", function (event) {
event.preventDefault();
if(app.isQuiting) return false;
mainWindow.hide();
app.dock.hide();
})
.on("close", function (event) {
if(!app.isQuiting){
event.preventDefault();
mainWindow.hide();
}
return false;
.on("show", function () {
app.dock.show();
})
.setSkipTaskbar(true);
const trayIcon = (appData.os === "windows") ? path.join(appData.path, "../assets/icons/tray/tray.ico") : path.join(appData.path, "../assets/icons/tray/tray.png");
tray = new Tray(trayIcon);
let trayFiles = new Array;
// build file selection
if(userData.data.files && userData.data.files.length > 1) {
userData.data.files.forEach((file) => {
const menuItem = {
label: file[1],
type: "radio",
checked: false,
tray.on("click", function() {
let trayFiles = new Array;
// build file selection
if(userData.data.files && userData.data.files.length > 1) {
userData.data.files.forEach((file) => {
const menuItem = {
label: file[1],
type: "radio",
checked: false,
click: function() {
startFileWatcher(file[1]);
mainWindow.show();
mainWindow.setSkipTaskbar(true);
}
}
if(file[0]) menuItem.checked = true;
trayFiles.push(menuItem)
});
trayFiles.push({ type: "separator" });
}
const contextMenu = [
{
label: translations.windowButtonOpenFile,
click: function() {
startFileWatcher(file[1]);
mainWindow.show();
mainWindow.setSkipTaskbar(true);
}
}
if(file[0]) menuItem.checked = true;
trayFiles.push(menuItem)
});
trayFiles.push(
},
{
label: translations.addTodo,
click: function() {
mainWindow.show();
mainWindow.webContents.send("triggerFunction", "showForm")
}
},
{ type: "separator" },
);
}
const contextMenu = [
{
label: translations.windowButtonOpenFile,
click: function() {
mainWindow.show();
}
},
{
label: translations.addTodo,
click: function() {
mainWindow.show();
mainWindow.webContents.send("triggerFunction", "showForm")
}
},
{ type: "separator" },
{
label: translations.close,
click: function() {
app.exit();
{
label: translations.close,
click: function() {
app.exit();
}
}
}
]
let menu = (trayFiles.length > 0) ? Menu.buildFromTemplate(trayFiles.concat(contextMenu)) : Menu.buildFromTemplate(contextMenu)
tray.setContextMenu(menu)
tray.setToolTip("sleek")
tray.on("click", function() {
// don't do this on MacOS
//if(appData.os === "mac") return false;
mainWindow.show();
]
let menu = (trayFiles.length > 0) ? Menu.buildFromTemplate(trayFiles.concat(contextMenu)) : Menu.buildFromTemplate(contextMenu)
this.setContextMenu(menu)
this.setToolTip("sleek")
mainWindow.show()
});
}
......@@ -652,7 +649,7 @@ async function createWindow() {
label: "Quit",
accelerator: "CmdOrCtrl+Q",
click: function() {
app.quit();
app.exit();
}
}]
}
......@@ -837,7 +834,7 @@ if(!process.mas && (!app.requestSingleInstanceLock() && process.env.SLEEK_MULTIP
app.on("ready", () => {
// in tray mode, dock icon is hidden
if(userData.data.tray) app.dock.hide()
//if(userData.data.tray) app.dock.hide()
// setup autoupdater for AppImage build
if(appData.channel === "AppImage" && userData.data.autoUpdate) autoUpdaterAppImage.checkForUpdatesAndNotify()
......
......@@ -18,7 +18,7 @@
color: white;
}
a:hover, a:active, a:focus {
a, a:hover, a:active, a:focus {
color: $has-text-link;
}
......@@ -26,7 +26,7 @@
background-color: transparent;
}
.button:focus:not(:active), .button.is-focused:not(:active), .button:active, .button.is-active, input[type=number], .button:focus, .button.is-focused, .select select, .textarea, .input, .select select:focus, .textarea:focus, .input:focus, .select select.is-focused, .is-focused.textarea, .is-focused.input, .select select:active, .textarea:active, .input:active, .select select.is-active, .is-active.textarea, .is-active.input {
button, .button:focus:not(:active), .button.is-focused:not(:active), .button:active, .button.is-active, input[type=number], .button:focus, .button.is-focused, .select select, .textarea, .input, .select select:focus, .textarea:focus, .input:focus, .select select.is-focused, .is-focused.textarea, .is-focused.input, .select select:active, .textarea:active, .input:active, .select select.is-active, .is-active.textarea, .is-active.input {
background: $darker-grey;
border: none;
color: white;
......@@ -50,8 +50,8 @@
background: $almost-white;
}
button:focus-visible {
color: $almost-white;
background: $darker-grey;
color: white;
background: $has-text-link;
}
table {
width: 100%;
......
......@@ -22,6 +22,10 @@
width: 85%;
max-width: 900px;
}
button {
color: white;
background-color: $has-text-link;
}
}
.modal.content {
z-index: 60;
......@@ -81,14 +85,12 @@
ul li a {
text-decoration: underline;
}
table tr th,
table tr td {
padding: 0;
}
table.settings {
tr {
th, td {
padding: 0.25em 0;
}
td {
padding-top: 1em;
.alert {
position: absolute;
top: 1em;
......@@ -190,10 +192,6 @@
select {
background-color: transparent;
}
/*input:focus-visible,
select:focus-visible {
background-color: $light-grey;
}*/
#datePickerResult {
color: $darker-grey;
}
......@@ -206,6 +204,9 @@
display: none;
margin: 1em 0 0 0;
}
.message.is-active {
display: block;
}
#autoCompleteContainer {
position: fixed;
display: none;
......@@ -225,9 +226,6 @@
max-height: 25em;
overflow-y: scroll;
margin: 0;
button {
margin: 0 .5rem .5rem 0;
}
}
section::-webkit-scrollbar {
background-color: transparent;
......
......@@ -92,8 +92,8 @@ a:focus {
button {
font-size: 1em;
color: white;
background-color: $has-text-link;
color: $has-text-link;
background-color: white;
border: none;
border-radius: $radius;
outline: none;
......@@ -106,7 +106,7 @@ button {
}
button:focus-visible {
color: white;
background-color: $dark-grey;
background-color: $has-text-link;
i {
color: inherit;
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment