slon-project/slon
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Slon/Api/V1/CustomEmojis: Implement Custom Emojis

Browse source 
Fixes #6
This commit is contained in:
Alec Murphy 2025-03-13 15:50:48 -04:00
parent a4a959d875
commit 5a9bf4f32b
4 changed files with 175 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

60
Slon/Static/html/admin/main.html
View file

@ -36,6 +36,7 @@
<ul class="menu-list">
<li><a onclick="manageAccounts(0)" id="menuitem-accounts">Accounts</a></li>
<li><a onclick="manageAnnouncements()" id="menuitem-announcements">Announcements</a></li>
<li><a onclick="manageCustomEmojis()" id="menuitem-customemojis">Custom Emoji</a></li>
<li><a onclick="manageInstance()" id="menuitem-instance">Instance</a></li>
<li><a onclick="manageSettings()" id="menuitem-settings">Settings</a></li>
</ul>
@ -115,6 +116,34 @@
setContent(html);
setActiveLink("announcements");
}
async function manageCustomEmojis() {
clearActiveLinks();
const request = new Request("/manage/custom-emojis");
const response = await fetch(request);
const custom_emojis = await response.json();
let html = "<h4 class=\"title is-4\">Custom Emojis</h4><div class=spacer></div>";
for (let i = 0; i < custom_emojis.length; i++) {
let filename_split = custom_emojis[i]["url"].split('/')
html += "<div class=\"is-inline-block\"><img src=\"" + custom_emojis[i]["url"] + "\" style=\"width:48px;height:48px\"><br>" + custom_emojis[i]["shortcode"] + "<br><button onclick=\"confirmDeleteCustomEmoji('" + custom_emojis[i]["shortcode"] + "', '" + filename_split[filename_split.length-1] + "')\">Delete</button></div>";
}
html += "<form id=\"emoji-form\"action=\"javascript:saveNewCustomEmoji()\"><div>";
html += "<div class=\"section is-inline-block\" style=\"width:420px;vertical-align:top\">";
html += "<label class=label>Shortcode</label><div class=control><input name=shortcode id=shortcode class=input placeholder=my-cool-emoji required autocomplete=off></div><div class=spacer></div>";
html += "<label class=label>Image</label><div class=control><input onchange=updateBase64Image(this) name=image-file id=image-file type=file required autocomplete=off> <img id=image-thumb style=\"display:none\" width=48 height=48></div><div class=spacer></div>";
html += "<label class=label>Visible in picker</label><div class=control><input name=visible-in-picker id=visible-in-picker type=checkbox checked></div><div class=spacer></div>";
html += "<label class=label>Category</label><div class=control><input name=category id=category class=input placeholder=\"Cool Emojis\" required autocomplete=off></div><div class=spacer></div>";
html += "</div>";
html += "</div>";
html += "<div class=\"control next\"><input class=\"button is-link\" type=submit value=New Custom Emoji></div>"
html += "</div></form>";
setContent(html);
setActiveLink("customemojis");
}
async function manageInstance() {
clearActiveLinks();
const request = new Request("/manage/instance");
@ -218,6 +247,14 @@
manageAccounts(0);
}
}
async function confirmDeleteCustomEmoji(shortcode, filename) {
if (confirm("Are you sure you want to delete :" + shortcode + ": ?")) {
const request = new Request("/delete/custom-emoji?shortcode=" + shortcode + "&filename=" + filename);
const response = await fetch(request);
const empty_json = await response.json();
manageCustomEmojis();
}
}
function createNewAnnouncement() {
clearActiveLinks();
let html = "<h4 class=\"title is-4\">New Announcement</h4><div class=spacer></div>";
@ -307,6 +344,17 @@
alert(JSON.stringify(json));
}
}
async function saveNewCustomEmoji() {
const form = document.getElementById('emoji-form');
const formData = new FormData(form);
const response = await fetch('/new/custom-emoji', { method: 'POST', body: formData, signal: AbortSignal.timeout(15000) });
const json = await response.json();
if (!Object.keys(json).length) {
manageCustomEmojis();
} else {
alert(JSON.stringify(json));
}
}
async function saveInstance() {
let data = {};
let fields = document.getElementsByTagName("input");
@ -339,6 +387,18 @@
}
);
}
function updateBase64Image(el) {
let reader = new FileReader();
reader.readAsDataURL(el.files[0]);
reader.addEventListener(
"load",
() => {
el.base64 = reader.result;
document.getElementById("image-thumb").src = reader.result;
document.getElementById("image-thumb").style = "";
}
);
}
const formatTime = milliseconds => {
const seconds = Math.floor((milliseconds / 1000) % 60);
const minutes = Math.floor((milliseconds / 1000 / 60) % 60);