create reminders :)

This commit is contained in:
jude
2022-03-19 17:41:34 +00:00
parent e2e5b022a0
commit d0d2d50966
14 changed files with 232 additions and 128 deletions

View File

@ -114,7 +114,7 @@
<br>
Your browser timezone is: <strong><span class="browser-timezone">%browsertimezone%</span></strong> (<span class="browser-time">HH:mm</span>)
<br>
Your bot timezone is: <strong><span class="bot-timezone">%bottimezone</span></strong> (<span class="bot-time">HH:mm</span>)
Your bot timezone is: <strong><span class="bot-timezone">%bottimezone%</span></strong> (<span class="bot-time">HH:mm</span>)
</p>
<br>
<div class="has-text-centered">
@ -414,6 +414,7 @@
// populate channels
newFrame.querySelector('select.channel-selector');
// populate majority of items
for (let prop in reminder) {
if (reminder.hasOwnProperty(prop) && reminder[prop] !== null) {
let $input = newFrame.querySelector(`*[name="${prop}"]`);
@ -427,6 +428,10 @@
}
}
let timeInput = newFrame.querySelector('input[name="time"]');
let localTime = luxon.DateTime.fromISO(reminder["utc_time"]).setZone(timezone);
timeInput.value = localTime.toFormat("yyyy-LL-dd'T'HH:mm:ss");
$reminderBox.appendChild(newFrame);
}
}
@ -668,6 +673,62 @@
});
});
let $createReminder = document.querySelector('#reminderCreator');
$createReminder.querySelector('button#createReminder').addEventListener('click', () => {
// 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 rgb_color = window.getComputedStyle($createReminder.querySelector('div.discord-embed')).borderLeftColor;
let rgb = rgb_color.match(/\d+/g);
let color = colorToInt(parseInt(rgb[0]), parseInt(rgb[1]), parseInt(rgb[2]));
let utc_time = luxon.DateTime.fromISO($createReminder.querySelector('input[name="time"]').value).setZone('UTC');
let reminder = {
avatar: $createReminder.querySelector('img.discord-avatar').src,
channel: $createReminder.querySelector('select.channel-selector').value,
content: $createReminder.querySelector('textarea#messageContent').value,
embed_author_url: $createReminder.querySelector('img.embed_author_url').src,
embed_author: $createReminder.querySelector('textarea#embedAuthor').value,
embed_color: color,
embed_description: $createReminder.querySelector('textarea#embedDescription').value,
embed_footer: $createReminder.querySelector('textarea#embedFooter').value,
embed_footer_url: $createReminder.querySelector('img.embed_footer_url').src,
embed_image_url: $createReminder.querySelector('img.embed_image_url').src,
embed_thumbnail_url: $createReminder.querySelector('img.embed_thumbnail_url').src,
embed_title: $createReminder.querySelector('textarea#embedTitle').value,
enabled: true,
expires: null,
interval_seconds: seconds,
interval_months: months,
name: $createReminder.querySelector('input[name="name"]').value,
pin: $createReminder.querySelector('input[name="pin"]').checked,
restartable: false,
tts: $createReminder.querySelector('input[name="tts"]').checked,
username: $createReminder.querySelector('input#reminderUsername').value,
utc_time: utc_time.toFormat("yyyy-LL-dd'T'HH:mm:ss")
}
console.log(reminder);
// send to server
let guild = document.querySelector('.guildList a.is-active').dataset['guild'];
fetch(`/dashboard/api/guild/${guild}/reminders`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(reminder)
}).then(response => response.json()).then(data => console.log(data))
// process response
// reset inputs
});
document.querySelectorAll('textarea.autoresize').forEach((element) => {
element.addEventListener('input', () => {
element.style.height = "";
@ -696,6 +757,10 @@
});
});
function colorToInt(r, g, b) {
return (r << 16) + (g << 8) + (b);
}
document.querySelectorAll('.customizable').forEach((element) => {
element.querySelector('a').addEventListener('click', (e) => {
e.preventDefault();

View File

@ -28,7 +28,7 @@
<div class="a">
<p class="image is-24x24 customizable">
<a>
<img class="is-rounded" src="">
<img class="is-rounded embed_author_url" src="">
</a>
</p>
</div>
@ -77,7 +77,7 @@
<div class="b">
<p class="image thumbnail customizable">
<a>
<img class="" src="" alt="Square thumbnail embedded image">
<img class="embed_thumbnail_url" src="" alt="Square thumbnail embedded image">
</a>
</p>
</div>
@ -85,21 +85,21 @@
<p class="image is-400x300 customizable">
<a>
<img class="" src="" alt="Large embedded image">
<img class="embed_image_url" src="" alt="Large embedded image">
</a>
</p>
<div class="embed-footer-box">
<p class="image is-20x20 customizable">
<a>
<img class="is-rounded " src="" alt="Footer profile-like image">
<img class="is-rounded embed_footer_url" src="" alt="Footer profile-like image">
</a>
</p>
<label class="is-sr-only" for="embedFooter">Embed Footer text</label>
<textarea class="discord-embed-footer message-input autoresize "
placeholder="Embed Footer..."
maxlength="2048" id="embedFooter" name="embed_author" rows="1"></textarea>
maxlength="2048" id="embedFooter" name="embed_footer" rows="1"></textarea>
</div>
</div>
</div>
@ -128,7 +128,7 @@
<div class="field">
<label class="label">Time</label>
<div class="control">
<input class="input" type="datetime-local" name="time">
<input class="input" type="datetime-local" step="1" name="time">
</div>
</div>
@ -140,13 +140,13 @@
<input class="input" type="number" name="interval_months" placeholder="Months">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Days">
<input class="input" type="number" name="interval_days" placeholder="Days">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Hours">
<input class="input" type="number" name="interval_hours" placeholder="Hours">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Minutes">
<input class="input" type="number" name="interval_minutes" placeholder="Minutes">
</div>
<div class="column">
<input class="input" type="number" name="interval_seconds" placeholder="Seconds">

View File

@ -6,6 +6,7 @@
<div id="reminderCreator">
{% set creating = true %}
{% include "reminder_dashboard/guild_reminder" %}
{% set creating = false %}
</div>
<div class="buttons has-addons" style="margin-top: 1rem;">

View File

@ -45,10 +45,20 @@
<h2 class="title">JellyWX's Home</h2>
<ul class="is-size-5 pl-6">
<li>Do not discuss politics, harass other users, or use language intended to upset other users</li>
<li>Do not send malicious links</li>
<li>Do not share personal information about yourself or any other user. This includes but is not
limited to real names<sup>1</sup>, addresses, phone numbers, country of origin<sup>2</sup>, religion, email address,
IP address.</li>
<li>Do not send malicious links or attachments</li>
<li>Do not advertise</li>
<li>Do not send unwarranted direct messages</li>
</ul>
<p class="small">
<sup>1</sup> Some users may use their real name on their account. In this case, do not assert that
this is a user's real name, or use it to try and identify a user.
<br>
<sup>2</sup> Country of current residence may be discussed, as this is relevant to timezone and
DST selection.
</p>
</div>
</section>