create reminder route. formatting on frontend

This commit is contained in:
jude
2022-03-05 19:43:02 +00:00
parent 6ae2353c92
commit e2e5b022a0
12 changed files with 564 additions and 53 deletions

View File

@ -12,7 +12,7 @@
<section class="section">
<div class="container">
<h2 class="title">User Data</h2>
<h2 class="title">User data</h2>
<p class="is-size-5 pl-6">
This website uses some necessary cookies and session data to operate. None of this can be disabled, since
it is all necessary for the site to function. <strong>However,</strong> it is worth mentioning that all of
@ -38,7 +38,7 @@
<section class="section">
<div class="container">
<h2 class="title">Session Storage</h2>
<h2 class="title">Session storage</h2>
<p class="is-size-5 pl-6">
Session data are data that is stored just for the active browser session. Session storage is read and
written by our server and cannot be modified on your computer.
@ -51,7 +51,7 @@
<section class="section">
<div class="container">
<h2 class="title">How Can We Trust You?</h2>
<h2 class="title">How can we trust you?</h2>
<p class="is-size-5 pl-6">
Feel free to audit this website. Go to our <a href="https://github.com/reminder-bot">GitHub</a> to get started, or just press <kbd>F12</kbd>
</p>

View File

@ -722,6 +722,27 @@
document.querySelector('div#reminderCreator').classList.toggle('is-hidden');
});
let $showInterval = document.querySelectorAll('a.intervalLabel');
$showInterval.forEach((element) => {
element.addEventListener('click', () => {
element.querySelector('i').classList.toggle('fa-chevron-right');
element.querySelector('i').classList.toggle('fa-chevron-down');
element.nextElementSibling.classList.toggle('is-hidden');
});
});
const fileInput = document.querySelectorAll('input[type=file]');
fileInput.forEach((element) => {
element.addEventListener('change', () => {
if (element.files.length > 0) {
const fileName = element.parentElement.querySelector('.file-label');
fileName.textContent = element.files[0].name;
}
})
});
document.querySelectorAll('.discord-field-title').forEach((element) => {
const $template = document.querySelector('template#embedFieldTemplate');
const $complement = element.parentElement.querySelector('.discord-field-value');

View File

@ -12,8 +12,63 @@
<section class="section">
<div class="container">
<h2 class="title">Privacy Policy</h2>
<h2 class="title">Who we are</h2>
<p class="is-size-5 pl-6">
Reminder Bot is operated solely by Jude Southworth. You can contact me by email at
<a href="mailto:jude@jellywx.com">jude@jellywx.com</a>, or via private/public message on Discord at
<a href="https://discord.jellywx.com">https://discord.jellywx.com</a>.
</p>
</div>
</section>
<section class="section">
<div class="container">
<h2 class="title">What data we collect</h2>
<p class="is-size-5 pl-6">
Reminder Bot stores limited data necessary for the function of the bot. This data
is your <strong>unique user ID</strong>, <strong>timezone</strong>, and <strong>direct message channel</strong>.
<br>
<br>
Timezones are provided by the user or the user's browser.
</p>
</div>
</section>
<section class="section">
<div class="container">
<h2 class="title">Why we collect this data</h2>
<p class="is-size-5 pl-6">
Unique user IDs are stored to <strong>keep track of who sets reminders</strong>. User timezones are
stored to allow users to set reminders in their local timezone. Direct message channels are stored to
allow the setting of reminders for your direct message channel.
</p>
</div>
</section>
<section class="section">
<div class="container">
<h2 class="title">Who your data is shared with</h2>
<p class="is-size-5 pl-6">
Your data may also be guarded by the privacy policies of <strong>MEGA</strong>, our backup provider, and
<strong>Hetzner</strong>, our hosting provider.
</p>
</div>
</section>
<section class="section">
<div class="container">
<h2 class="title">Accessing or removing your data</h2>
<p class="is-size-5 pl-6">
Your timezone can be removed with the command <strong>/timezone UTC</strong>. Other data can be removed
on request. Please contact me.
<br>
<br>
Reminders created in a guild/channel will be removed automatically when the bot is removed from the
guild, the guild is deleted, or channel is deleted. Data is otherwise not removed automatically.
<br>
<br>
Reminders deleted with <strong>/del</strong> or via the dashboard are removed from the live database
instantly, but may persist in backups.
</p>
</div>
</section>

View File

@ -126,45 +126,69 @@
</div>
<div class="field">
<label class="label">Time</label>
<div class="control">
<label class="checkbox">
Enable TTS
<input type="checkbox">
</label>
<input class="input" type="datetime-local" name="time">
</div>
</div>
<div class="field">
<div class="control">
<label class="checkbox">
Pin Reminder
<input type="checkbox">
</label>
<a class="intervalLabel"><label class="label">Interval <i class="fas fa-chevron-down"></i></label></a>
<div class="control intervalSelector">
<div class="columns">
<div class="column">
<input class="input" type="number" name="interval_months" placeholder="Months">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Days">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Hours">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Minutes">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Seconds">
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column has-text-centered">
<div style="display: inline-block;">
<label class="label">Enable TTS <input type="checkbox" name="tts"></label>
</div>
</div>
<div class="column has-text-centered">
<div style="display: inline-block;">
<label class="label">Pin Message <input type="checkbox" name="pin"></label>
</div>
</div>
<div class="column has-text-centered">
<div class="file is-boxed">
<label class="file-label">
<input class="file-input" type="file">
<span class="file-cta">
<span class="file-label">
Add Attachment
</span>
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
</span>
</label>
</div>
</div>
</div>
<a class="set-color">
<p>
Set Embed Color <span class="icon is-small"><i
class="far fa-eye-dropper"></i></span>
</p>
</a>
<a class="level-item file-upload">
<div class="file">
<input class="file-input" type="file" name="attachment">
<p>
Attach File
<span class="icon is-small">
<i class="far fa-file-upload"></i>
</span>
</p>
</div>
</a>
<a class="level-item set-interval">
<p>
Set Interval <span class="icon is-small"><i class="far fa-repeat"></i></span>
Set Embed Color <span class="icon is-small"><i class="far fa-eye-dropper"></i></span>
</p>
</a>
<span style="width: 12px;"></span>
{% if creating %}
<button class="button is-outlined">