process intervals. inlining fields

This commit is contained in:
jude 2022-04-03 21:53:28 +01:00
parent f21d522435
commit d946ef1dca
7 changed files with 124 additions and 89 deletions

View File

@ -27,5 +27,5 @@ CREATE TABLE reminder_template (
PRIMARY KEY (id),
FOREIGN KEY (`guild_id`) REFERENCES channels (`id`) ON DELETE CASCADE,
FOREIGN KEY (`guild_id`) REFERENCES channels (`id`) ON DELETE CASCADE
);

View File

@ -17,7 +17,11 @@ pub async fn listener(
poise::Event::CacheReady { .. } => {
info!("Cache Ready! Preparing extra processes");
if !data.is_loop_running.load(Ordering::Relaxed) {
if data
.is_loop_running
.compare_exchange(false, true, Ordering::Relaxed, Ordering::Relaxed)
.is_ok()
{
let kill_tx = data.broadcast.clone();
let kill_recv = data.broadcast.subscribe();
@ -49,8 +53,6 @@ pub async fn listener(
} else {
warn!("Not running web")
}
data.is_loop_running.swap(true, Ordering::Relaxed);
}
}
poise::Event::ChannelDelete { channel } => {

View File

@ -206,6 +206,18 @@ div.dashboard-frame {
margin-bottom: 0 !important;
}
.embed-field-box[data-inlined="0"] .inline-btn > i {
transform: rotate(90deg);
}
.embed-field-box[data-inlined="0"] {
min-width: 100%;
}
.embed-field-box[data-inlined="1"] {
min-width: auto;
}
.menu a {
color: #fff;
}

View File

@ -1,4 +1,23 @@
function update_input(element) {
function get_interval(element) {
let months = element.querySelector('input[name="interval_months"]').value;
let days = element.querySelector('input[name="interval_days"]').value;
let hours = element.querySelector('input[name="interval_hours"]').value;
let minutes = element.querySelector('input[name="interval_minutes"]').value;
let seconds = element.querySelector('input[name="interval_seconds"]').value;
console.log(minutes);
return {
months: parseInt(months) || null,
seconds:
(parseInt(days) || 0) * 86400 +
(parseInt(hours) || 0) * 3600 +
(parseInt(minutes) || 0) * 60 +
(parseInt(seconds) || 0) || null,
};
}
function update_interval(element) {
let months = element.querySelector('input[name="interval_months"]');
let days = element.querySelector('input[name="interval_days"]');
let hours = element.querySelector('input[name="interval_hours"]');
@ -39,7 +58,7 @@ let $intervalGroup = document.querySelector(".interval-group");
document.querySelector(".interval-group").addEventListener(
"blur",
(ev) => {
if (ev.target.nodeName !== "BUTTON") update_input($intervalGroup);
if (ev.target.nodeName !== "BUTTON") update_interval($intervalGroup);
},
true
);
@ -55,7 +74,7 @@ document.addEventListener("remindersLoaded", (event) => {
let $intervalGroup = reminder.node.querySelector(".interval-group");
$intervalGroup.addEventListener("blur", (ev) => {
if (ev.target.nodeName !== "BUTTON") update_input($intervalGroup);
if (ev.target.nodeName !== "BUTTON") update_interval($intervalGroup);
});
$intervalGroup.querySelector("button.clear").addEventListener("click", () => {

View File

@ -161,6 +161,8 @@ function render_reminder(reminder, frame) {
}
}
if (reminder["interval_seconds"] !== null) update_interval(frame);
let $enableBtn = frame.querySelector(".disable-enable");
$enableBtn.dataset.action = reminder["enabled"] ? "disable" : "enable";
@ -252,12 +254,7 @@ document.addEventListener("remindersLoaded", (event) => {
"fas fa-spinner fa-spin",
];
let seconds =
parseInt(node.querySelector('input[name="interval_seconds"]').value) ||
null;
let months =
parseInt(node.querySelector('input[name="interval_months"]').value) ||
null;
let interval = get_interval(node);
let rgb_color = window.getComputedStyle(
node.querySelector("div.discord-embed")
@ -302,8 +299,8 @@ document.addEventListener("remindersLoaded", (event) => {
embed_title: node.querySelector('textarea[name="embed_title"]').value,
embed_fields: fields,
expires: null,
interval_seconds: seconds,
interval_months: months,
interval_seconds: interval.seconds,
interval_months: interval.months,
name: node.querySelector('input[name="name"]').value,
pin: node.querySelector('input[name="pin"]').checked,
tts: node.querySelector('input[name="tts"]').checked,
@ -406,28 +403,7 @@ document.addEventListener("DOMContentLoaded", () => {
if (data.error) {
show_error(data.error);
} else {
document.querySelectorAll("a.switch-pane").forEach((element) => {
element.textContent = element.textContent.replace(
"%username%",
data.name
);
element.addEventListener("click", (e) => {
e.preventDefault();
switch_pane(element.dataset["pane"]);
element.classList.add("is-active");
document.querySelectorAll("p.pageTitle").forEach((el) => {
el.textContent = "Your Reminders";
});
});
});
if (data.timezone !== null) {
botTimezone = data.timezone;
}
if (data.timezone !== null) botTimezone = data.timezone;
update_times();
}
@ -512,13 +488,7 @@ let $createBtn = $createReminder.querySelector("button#createReminder");
$createBtn.addEventListener("click", async () => {
$createBtn.querySelector("span.icon > i").classList = ["fas fa-spinner fa-spin"];
// create reminder object
let seconds =
parseInt($createReminder.querySelector('input[name="interval_seconds"]').value) ||
null;
let months =
parseInt($createReminder.querySelector('input[name="interval_months"]').value) ||
null;
let interval = get_interval($createReminder);
let rgb_color = window.getComputedStyle(
$createReminder.querySelector("div.discord-embed")
@ -536,6 +506,17 @@ $createBtn.addEventListener("click", async () => {
return;
}
let fields = [
...$createReminder.querySelectorAll(
"div.embed-multifield-box div.embed-field-box"
),
].map((el) => {
return {
title: el.querySelector("textarea#embedFieldTitle").value,
value: el.querySelector("textarea#embedFieldValue").value,
};
});
let attachment = null;
let attachment_name = null;
@ -575,11 +556,11 @@ $createBtn.addEventListener("click", async () => {
$createReminder.querySelector("img.embed_thumbnail_url").src
),
embed_title: $createReminder.querySelector("textarea#embedTitle").value,
embed_fields: [],
embed_fields: fields,
enabled: true,
expires: null,
interval_seconds: seconds,
interval_months: months,
interval_seconds: interval.seconds,
interval_months: interval.months,
name: $createReminder.querySelector('input[name="name"]').value,
pin: $createReminder.querySelector('input[name="pin"]').checked,
restartable: false,
@ -701,54 +682,81 @@ document.addEventListener("remindersLoaded", () => {
window.getComputedStyle($discordFrame).borderLeftColor;
});
});
document.querySelectorAll(".embed-field-box button.inline-btn").forEach((el) => {
el.addEventListener("click", (ev) => {
let inlined = ev.target.closest(".embed-field-box").dataset["inlined"];
ev.target.closest(".embed-field-box").dataset["inlined"] =
inlined === "1" ? "0" : "1";
});
});
});
function check_embed_fields() {
document.querySelectorAll(".discord-field-title").forEach((element) => {
document.querySelectorAll(".embed-field-box").forEach((element) => {
const $template = document.querySelector("template#embedFieldTemplate");
const $complement = element.parentElement.querySelector(".discord-field-value");
const $titleInput = element.querySelector(".discord-field-title");
const $valueInput = element.querySelector(".discord-field-value");
// when the user clicks out of the field title and if the field title/value are empty, remove the field
element.addEventListener("blur", () => {
$titleInput.addEventListener("blur", () => {
if (
element.value === "" &&
$complement.value === "" &&
element.parentElement.nextElementSibling !== null
$titleInput.value === "" &&
$valueInput.value === "" &&
element.nextElementSibling !== null
) {
element.parentElement.remove();
element.remove();
}
});
$complement.addEventListener("blur", () => {
$valueInput.addEventListener("blur", () => {
if (
element.value === "" &&
$complement.value === "" &&
element.parentElement.nextElementSibling !== null
$titleInput.value === "" &&
$valueInput.value === "" &&
element.nextElementSibling !== null
) {
element.parentElement.remove();
element.remove();
}
});
// when the user inputs into the end field, create a new field after it
element.addEventListener("input", () => {
$titleInput.addEventListener("input", () => {
if (
element.value !== "" &&
$complement.value !== "" &&
element.parentElement.nextElementSibling === null
$titleInput.value !== "" &&
$valueInput.value !== "" &&
element.nextElementSibling === null
) {
const $clone = $template.content.cloneNode(true);
element.parentElement.parentElement.append($clone);
$clone
.querySelector(".embed-field-box button.inline-btn")
.addEventListener("click", (ev) => {
let inlined =
ev.target.closest(".embed-field-box").dataset["inlined"];
ev.target.closest(".embed-field-box").dataset["inlined"] =
inlined == "1" ? "0" : "1";
});
element.parentElement.append($clone);
}
});
$complement.addEventListener("input", () => {
$valueInput.addEventListener("input", () => {
if (
element.value !== "" &&
$complement.value !== "" &&
element.parentElement.nextElementSibling === null
$titleInput.value !== "" &&
$valueInput.value !== "" &&
element.nextElementSibling === null
) {
const $clone = $template.content.cloneNode(true);
element.parentElement.parentElement.append($clone);
$clone
.querySelector(".embed-field-box button.inline-btn")
.addEventListener("click", (ev) => {
let inlined =
ev.target.closest(".embed-field-box").dataset["inlined"];
ev.target.closest(".embed-field-box").dataset["inlined"] =
inlined == "1" ? "0" : "1";
});
element.parentElement.append($clone);
}
});
});

View File

@ -176,16 +176,6 @@
</g>
</svg>
<aside class="menu" style="display: flex; flex-direction: column; flex-grow: 1;">
<p class="menu-label">
Personal
</p>
<ul class="menu-list">
<li>
<a class="switch-pane" data-pane="personal">
<span class="icon"><i class="fas fa-map-pin"></i></span> @%username%
</a>
</li>
</ul>
<p class="menu-label">
Servers
</p>
@ -290,11 +280,14 @@
</div>
<template id="embedFieldTemplate">
<div class="embed-field-box">
<div data-inlined="1" class="embed-field-box">
<label class="is-sr-only" for="embedFieldTitle">Field Title</label>
<div style="display: flex;">
<textarea class="discord-field-title field-input message-input autoresize"
placeholder="Field Title..." rows="1"
maxlength="256" id="embedFieldTitle" name="embed_field_title[]"></textarea>
<button class="button is-small inline-btn" style="height: 100%; padding: 5px;"><i class="fas fa-arrows-h"></i></button>
</div>
<label class="is-sr-only" for="embedFieldValue">Field Value</label>
<textarea

View File

@ -58,13 +58,14 @@
<br>
<div class="embed-multifield-box">
<div class="embed-field-box">
<div data-inlined="1" class="embed-field-box">
<label class="is-sr-only" for="embedFieldTitle">Field Title</label>
<textarea
class="discord-field-title field-input message-input autoresize "
<div style="display: flex;">
<textarea class="discord-field-title field-input message-input autoresize"
placeholder="Field Title..." rows="1"
maxlength="256" id="embedFieldTitle"
name="embed_field_title[]"></textarea>
maxlength="256" id="embedFieldTitle" name="embed_field_title[]"></textarea>
<button class="button is-small inline-btn" style="height: 100%; padding: 5px;"><i class="fas fa-arrows-h"></i></button>
</div>
<label class="is-sr-only" for="embedFieldValue">Field Value</label>
<textarea