github/MIND
1
1
Fork 0
mirror of https://github.com/Casvt/MIND.git synced 2026-04-03 03:00:22 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fixes issue #4

Browse Source
This commit is contained in:
CasVT
2023-01-19 15:50:26 +01:00
parent bbf4c6a389
commit 55afdadc77
10 changed files with 367 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
frontend/static/css/add_edit.css
View File

@@ -12,7 +12,8 @@
.form-container > form input,
.form-container > form select,
.form-container > form textarea {
.form-container > form textarea,
.form-container > form button {
padding: 1rem;
}
@@ -27,11 +28,69 @@
}
.sub-inputs > input,
.sub-inputs > select {
.sub-inputs > select,
.sub-inputs > button {
width: calc(50% - (var(--gap) / 2));
}
.options > button {
.sub-inputs > button {
display: flex;
justify-content: center;
align-items: center;
gap: .75rem;
border: 2px solid var(--color-gray);
font-size: 1.1rem;
}
.sub-inputs > button > svg {
width: 1rem;
height: 1rem;
}
.sub-inputs > button[data-selected="false"] > svg {
opacity: 0;
}
.repeat-bar,
.repeat-edit-bar {
display: flex;
justify-content: space-between;
align-items: center;
overflow-x: auto;
border: 2px solid var(--color-gray);
border-radius: 4px;
}
.repeat-bar > *,
.repeat-edit-bar > * {
border: 0;
box-shadow: none;
}
.repeat-bar > p,
.repeat-edit-bar > p {
min-width: 7rem;
padding: 1rem;
padding-right: .25rem;
}
.repeat-bar > input[type="number"],
.repeat-edit-bar > input[type="number"] {
min-width: 5rem;
padding-left: .25rem;
}
.repeat-bar > select,
.repeat-edit-bar > select {
min-width: 8rem;
}
div.options > button {
width: 6rem;
border: 2px solid var(--color-gray);

34
frontend/static/js/add.js
View File

@@ -5,6 +5,15 @@ const inputs = {
'text': document.getElementById('text-input')
};
const type_buttons = {
'normal-button': document.getElementById('normal-button'),
'repeat-button': document.getElementById('repeat-button'),
'repeat-bar': document.querySelector('.repeat-bar'),
'repeat-interval': document.getElementById('repeat-interval'),
'repeat-quantity': document.getElementById('repeat-quantity')
};
function addReminder() {
const data = {
'title': inputs.title.value,
@@ -12,6 +21,11 @@ function addReminder() {
'notification_service': inputs.notification_service.value,
'text': inputs.text.value
};
if (type_buttons['repeat-button'].dataset.selected === 'true') {
data['repeat_quantity'] = type_buttons['repeat-quantity'].value;
data['repeat_interval'] = type_buttons['repeat-interval'].value
};
fetch(`/api/reminders?api_key=${api_key}`, {
'method': 'POST',
'headers': {'Content-Type': 'application/json'},
@@ -50,11 +64,31 @@ function closeAdd() {
inputs.title.value = '';
inputs.time.value = '';
inputs.notification_service.value = document.querySelector('#notification-service-input option[selected]').value;
toggleNormal();
inputs.text.value = '';
}, 500);
};
function toggleNormal() {
type_buttons['normal-button'].dataset.selected = 'true';
type_buttons['repeat-button'].dataset.selected = 'false';
type_buttons['repeat-bar'].classList.add('hidden');
type_buttons['repeat-interval'].removeAttribute('required');
type_buttons['repeat-interval'].value = '';
};
function toggleRepeated() {
type_buttons['normal-button'].dataset.selected = 'false';
type_buttons['repeat-button'].dataset.selected = 'true';
type_buttons['repeat-bar'].classList.remove('hidden');
type_buttons['repeat-interval'].setAttribute('required', '');
};
// code run on load
document.getElementById('add-form').setAttribute('action', 'javascript:addReminder();');
document.getElementById('normal-button').addEventListener('click', e => toggleNormal());
document.getElementById('repeat-button').addEventListener('click', e => toggleRepeated());
document.getElementById('close-add').addEventListener('click', e => closeAdd());

48
frontend/static/js/edit.js
View File

@@ -5,14 +5,30 @@ const edit_inputs = {
'text': document.getElementById('text-edit-input')
};
const edit_type_buttons = {
'normal-edit-button': document.getElementById('normal-edit-button'),
'repeat-edit-button': document.getElementById('repeat-edit-button'),
'repeat-edit-bar': document.querySelector('.repeat-edit-bar'),
'repeat-edit-interval': document.getElementById('repeat-edit-interval'),
'repeat-edit-quantity': document.getElementById('repeat-edit-quantity')
};
function editReminder() {
const id = document.getElementById('edit-form').dataset.id;
const data = {
'title': edit_inputs.title.value,
'time': new Date(edit_inputs.time.value).getTime() / 1000,
'notification_service': edit_inputs.notification_service.value,
'text': edit_inputs.text.value
'text': edit_inputs.text.value,
'repeat_quantity': null,
'repeat_interval': null
};
if (edit_type_buttons['repeat-edit-button'].dataset.selected === 'true') {
data['repeat_quantity'] = edit_type_buttons['repeat-edit-quantity'].value;
data['repeat_interval'] = edit_type_buttons['repeat-edit-interval'].value;
};
fetch(`/api/reminders/${id}?api_key=${api_key}`, {
'method': 'PUT',
'headers': {'Content-Type': 'application/json'},
@@ -50,11 +66,22 @@ function showEdit(id) {
})
.then(json => {
edit_inputs.title.value = json.result.title;
edit_inputs.time.value = new Date(
(json.result.time + new Date(json.result.time * 1000).getTimezoneOffset() * -60) * 1000
).toISOString().slice(0, 16);
edit_inputs.notification_service.value = json.result.notification_service;
if (json.result['repeat_interval'] === null) {
toggleEditNormal();
} else {
toggleEditRepeated();
edit_type_buttons['repeat-edit-interval'].value = json.result['repeat_interval'];
edit_type_buttons['repeat-edit-quantity'].value = json.result['repeat_quantity'];
};
edit_inputs.text.value = json.result.text !== null ? json.result.text : '';
showWindow('edit');
})
.catch(e => {
@@ -68,7 +95,26 @@ function showEdit(id) {
});
};
function toggleEditNormal() {
edit_type_buttons['normal-edit-button'].dataset.selected = 'true';
edit_type_buttons['repeat-edit-button'].dataset.selected = 'false';
edit_type_buttons['repeat-edit-bar'].classList.add('hidden');
edit_type_buttons['repeat-edit-interval'].removeAttribute('required');
edit_type_buttons['repeat-edit-interval'].value = '';
};
function toggleEditRepeated() {
edit_type_buttons['normal-edit-button'].dataset.selected = 'false';
edit_type_buttons['repeat-edit-button'].dataset.selected = 'true';
edit_type_buttons['repeat-edit-bar'].classList.remove('hidden');
edit_type_buttons['repeat-edit-interval'].setAttribute('required', '');
};
// code run on load
document.getElementById('edit-form').setAttribute('action', 'javascript:editReminder();');
document.getElementById('normal-edit-button').addEventListener('click', e => toggleEditNormal());
document.getElementById('repeat-edit-button').addEventListener('click', e => toggleEditRepeated());
document.getElementById('close-edit').addEventListener('click', e => hideWindow());

12
frontend/static/js/reminders.js
View File

@@ -14,6 +14,16 @@ function fillTable(result) {
const time = document.createElement('p');
var d = new Date(reminder.time * 1000);
var formatted_date = d.toLocaleString('en-CA').slice(0,10) + ' ' + d.toTimeString().slice(0,5);
if (reminder.repeat_interval !== null) {
if (reminder.repeat_interval === 1) {
var quantity = reminder.repeat_quantity.endsWith('s') ? reminder.repeat_quantity.slice(0, -1) : reminder.repeat_quantity;
var interval_text = ` (each ${quantity})`;
} else {
var quantity = reminder.repeat_quantity.endsWith('s') ? reminder.repeat_quantity : reminder.repeat_quantity + 's';
var interval_text = ` (every ${reminder.repeat_interval} ${quantity})`;
};
formatted_date += interval_text;
};
time.innerText = formatted_date;
entry.appendChild(time);
@@ -119,7 +129,7 @@ function deleteReminder(id) {
// code run on load
fillList();
// setInterval(fillList, 60000);
setInterval(fillList, 60000);
document.getElementById('search-form').setAttribute('action', 'javascript:search();');
document.getElementById('clear-button').addEventListener('click', e => clearSearch());