top
/
rDrama
forked from rDrama/rDrama
1
0
Fork 0
Code Pull Requests Activity

speed -> inline

master
Aevann 2024-01-12 07:18:24 +02:00
parent a0a7c7e9c5
commit d453f8c811
10 changed files with 56 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
files/assets/css/main.css
View File

@ -6564,7 +6564,7 @@ g {
padding-left: 10px; padding-left: 10px;
} }
#speed-carot-modal #inline-carot-modal
{ {
background-color: var(--gray-700); background-color: var(--gray-700);
max-height: 500px; max-height: 500px;
@ -6576,29 +6576,29 @@ g {
z-index: 1000000001; z-index: 1000000001;
} }
#speed-carot-modal .speed-modal-option #inline-carot-modal .inline-modal-option
{ {
border-bottom: 1px solid #606060; border-bottom: 1px solid #606060;
padding: 4px; padding: 4px;
cursor: pointer; cursor: pointer;
} }
#speed-carot-modal .speed-modal-option:hover, #inline-carot-modal .inline-modal-option:hover,
#speed-carot-modal .speed-modal-option:focus, #inline-carot-modal .inline-modal-option:focus,
#speed-carot-modal .speed-modal-option.selected #inline-carot-modal .inline-modal-option.selected
{ {
background-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2);
} }
#speed-carot-modal .speed-modal-image #inline-carot-modal .inline-modal-image
{ {
object-fit: contain; object-fit: contain;
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
#speed-carot-modal .speed-modal-option span #inline-carot-modal .inline-modal-option span
{ {
overflow: hidden; overflow: hidden;
display: inline-block; display: inline-block;
@ -6711,7 +6711,7 @@ div.markdown {
} }
@media (min-width: 768px) { @media (min-width: 768px) {
#speed-carot-modal .speed-modal-image #inline-carot-modal .inline-modal-image
{ {
width: 50px; width: 50px;
height: 50px; height: 50px;

4
files/assets/css/themes/classic_dark.css
View File

@ -5,11 +5,11 @@
--background: 34, 34, 34; --background: 34, 34, 34;
} }
#speed-carot-modal .speed-modal-option { #inline-carot-modal .inline-modal-option {
background-color: rgb(var(--background)); background-color: rgb(var(--background));
} }
#speed-carot-modal .speed-modal-option:hover, #speed-carot-modal .speed-modal-option:focus, #speed-carot-modal .speed-modal-option.selected { #inline-carot-modal .inline-modal-option:hover, #inline-carot-modal .inline-modal-option:focus, #inline-carot-modal .inline-modal-option.selected {
background-color: #444444; background-color: #444444;
} }

2
files/assets/css/transparent.css
View File

@ -10,7 +10,7 @@
background: rgba(var(--background), 0.9) !important; background: rgba(var(--background), 0.9) !important;
} }
.fixed-bottom, .popover, .modal-content, .dropdown-menu, .navbar, body, .form-control, #speed-carot-modal { .fixed-bottom, .popover, .modal-content, .dropdown-menu, .navbar, body, .form-control, #inline-carot-modal {
background-color: rgb(var(--background)) !important; background-color: rgb(var(--background)) !important;
} }

2
files/assets/js/bottom.js
View File

@ -229,7 +229,7 @@ document.addEventListener("click", function (e) {
if (element.dataset.toggleelement) { if (element.dataset.toggleelement) {
if (element.dataset.toggleelement.startsWith('#reply-')) if (element.dataset.toggleelement.startsWith('#reply-'))
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
const toggling = document.querySelector(element.dataset.toggleelement) const toggling = document.querySelector(element.dataset.toggleelement)
const attr = element.dataset.toggleattr; const attr = element.dataset.toggleattr;

8
files/assets/js/comments_v.js
View File

@ -98,7 +98,7 @@ function toggleEdit(id){
charLimit(box.id, 'charcount-edit-' + id) charLimit(box.id, 'charcount-edit-' + id)
} }
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
}; };
@ -131,7 +131,7 @@ deleteCommentButton.onclick = () => {
}; };
function post_reply(id) { function post_reply(id) {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
const btn = document.getElementById(`save-reply-to-${id}`) const btn = document.getElementById(`save-reply-to-${id}`)
btn.disabled = true; btn.disabled = true;
@ -257,7 +257,7 @@ function comment_edit(id){
} }
function post_comment(fullname, hide){ function post_comment(fullname, hide){
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
const btn = document.getElementById('save-reply-to-'+fullname) const btn = document.getElementById('save-reply-to-'+fullname)
const ta = document.getElementById('reply-form-body-'+fullname) const ta = document.getElementById('reply-form-body-'+fullname)
@ -359,5 +359,5 @@ function cancel(fullname) {
document.getElementById(`reply-to-${fullname}`).classList.add('d-none') document.getElementById(`reply-to-${fullname}`).classList.add('d-none')
remove_dialog(); remove_dialog();
restore_reply_buttons(fullname) restore_reply_buttons(fullname)
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
} }

14
files/assets/js/core.js
View File

@ -214,7 +214,7 @@ function bs_trigger(e) {
return bootstrap.Tooltip.getOrCreateInstance(element); return bootstrap.Tooltip.getOrCreateInstance(element);
}); });
if (typeof update_speed_emoji_modal == 'function') { if (typeof update_inline_emoji_modal == 'function') {
insertGhostDivs(e) insertGhostDivs(e)
} }
} }
@ -305,8 +305,8 @@ function reload() {
} }
function sendFormXHR(form, extraActionsOnSuccess) { function sendFormXHR(form, extraActionsOnSuccess) {
if (typeof close_inline_speed_emoji_modal === "function") { if (typeof close_inline_emoji_modal === "function") {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
} }
const t = form.querySelector('[type="submit"]') const t = form.querySelector('[type="submit"]')
@ -702,14 +702,14 @@ if (screen_width < 768) {
} }
document.addEventListener('show.bs.modal', () => { document.addEventListener('show.bs.modal', () => {
if (typeof close_inline_speed_emoji_modal === "function") { if (typeof close_inline_emoji_modal === "function") {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
} }
}); });
document.addEventListener('hide.bs.modal', () => { document.addEventListener('hide.bs.modal', () => {
if (typeof close_inline_speed_emoji_modal === "function") { if (typeof close_inline_emoji_modal === "function") {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
} }
}); });

2
files/assets/js/edit_post.js
View File

@ -17,7 +17,7 @@ function togglePostEdit(id) {
autoExpand(box); autoExpand(box);
} }
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
}; };
document.getElementById('post-edit-title').addEventListener('keydown', (e) => { document.getElementById('post-edit-title').addEventListener('keydown', (e) => {

58
files/assets/js/emoji_modal/speed_emoji_modal.js → files/assets/js/emoji_modal/inline_emoji_modal.js
View File

@ -28,13 +28,13 @@ function update_ghost_div_textarea(text)
// Used for anything where a user is typing, specifically for the emoji modal // Used for anything where a user is typing, specifically for the emoji modal
// Just leave it global, I don't care // Just leave it global, I don't care
let speed_carot_modal = document.createElement("div"); let inline_carot_modal = document.createElement("div");
speed_carot_modal.id = "speed-carot-modal"; inline_carot_modal.id = "inline-carot-modal";
speed_carot_modal.style.position = "absolute"; inline_carot_modal.style.position = "absolute";
speed_carot_modal.style.left = "0px"; inline_carot_modal.style.left = "0px";
speed_carot_modal.style.top = "0px"; inline_carot_modal.style.top = "0px";
speed_carot_modal.style.display = "none"; inline_carot_modal.style.display = "none";
document.body.appendChild(speed_carot_modal); document.body.appendChild(inline_carot_modal);
let e let e
@ -48,24 +48,24 @@ function curr_word_is_emoji()
current_word.charAt(current_word.length-1) != ":"; current_word.charAt(current_word.length-1) != ":";
} }
function close_inline_speed_emoji_modal() { function close_inline_emoji_modal() {
selecting = false; selecting = false;
speed_carot_modal.style.display = "none"; inline_carot_modal.style.display = "none";
} }
function populate_speed_emoji_modal(results, textbox) function populate_inline_emoji_modal(results, textbox)
{ {
selecting = true; selecting = true;
if (!results || results.size === 0) if (!results || results.size === 0)
{ {
speed_carot_modal.style.display = "none"; inline_carot_modal.style.display = "none";
return -1; return -1;
} }
emoji_index = 0; emoji_index = 0;
speed_carot_modal.scrollTop = 0; inline_carot_modal.scrollTop = 0;
speed_carot_modal.innerHTML = ""; inline_carot_modal.innerHTML = "";
const MAXXX = 50; const MAXXX = 50;
// Not sure why the results is a Set... but oh well // Not sure why the results is a Set... but oh well
let i = 0; let i = 0;
@ -75,10 +75,10 @@ function populate_speed_emoji_modal(results, textbox)
if (i++ > MAXXX) return i; if (i++ > MAXXX) return i;
let emoji_option = document.createElement("div"); let emoji_option = document.createElement("div");
emoji_option.className = "speed-modal-option emoji-option " + (i === 1 ? "selected" : ""); emoji_option.className = "inline-modal-option emoji-option " + (i === 1 ? "selected" : "");
emoji_option.tabIndex = 0; emoji_option.tabIndex = 0;
let emoji_option_img = document.createElement("img"); let emoji_option_img = document.createElement("img");
emoji_option_img.className = "speed-modal-image emoji-option-image"; emoji_option_img.className = "inline-modal-image emoji-option-image";
// This is a bit // This is a bit
emoji_option_img.src = `${SITE_FULL_IMAGES}/e/${name}.webp` emoji_option_img.src = `${SITE_FULL_IMAGES}/e/${name}.webp`
let emoji_option_text = document.createElement("span"); let emoji_option_text = document.createElement("span");
@ -96,7 +96,7 @@ function populate_speed_emoji_modal(results, textbox)
if (current_word.includes("!")) name = `!${name}` if (current_word.includes("!")) name = `!${name}`
emoji_option.addEventListener('click', () => { emoji_option.addEventListener('click', () => {
close_inline_speed_emoji_modal() close_inline_emoji_modal()
textbox.value = textbox.value.replace(new RegExp(current_word+"(?=\\s|$)", "gi"), `:${name}: `) textbox.value = textbox.value.replace(new RegExp(current_word+"(?=\\s|$)", "gi"), `:${name}: `)
textbox.focus() textbox.focus()
if (typeof markdown === "function" && textbox.dataset.preview) { if (typeof markdown === "function" && textbox.dataset.preview) {
@ -106,14 +106,14 @@ function populate_speed_emoji_modal(results, textbox)
// Pack // Pack
emoji_option.appendChild(emoji_option_img); emoji_option.appendChild(emoji_option_img);
emoji_option.appendChild(emoji_option_text); emoji_option.appendChild(emoji_option_text);
speed_carot_modal.appendChild(emoji_option); inline_carot_modal.appendChild(emoji_option);
} }
if (i === 0) speed_carot_modal.style.display = "none"; if (i === 0) inline_carot_modal.style.display = "none";
else speed_carot_modal.style.display = "initial"; else inline_carot_modal.style.display = "initial";
return i; return i;
} }
function update_speed_emoji_modal(event) function update_inline_emoji_modal(event)
{ {
const box_coords = update_ghost_div_textarea(event.target); const box_coords = update_ghost_div_textarea(event.target);
@ -148,28 +148,28 @@ function update_speed_emoji_modal(event)
modal_pos.x += window.scrollX; modal_pos.x += window.scrollX;
modal_pos.y += window.scrollY; modal_pos.y += window.scrollY;
speed_carot_modal.style.display = "initial"; inline_carot_modal.style.display = "initial";
speed_carot_modal.style.left = box_coords.x - 30 + "px"; inline_carot_modal.style.left = box_coords.x - 30 + "px";
speed_carot_modal.style.top = modal_pos.y + box_coords.y + 14 + "px"; inline_carot_modal.style.top = modal_pos.y + box_coords.y + 14 + "px";
// Do the search (and do something with it) // Do the search (and do something with it)
const resultSet = emojisSearchDictionary.completeSearch(current_word.substring(1).replace(/[#!]/g, "")); const resultSet = emojisSearchDictionary.completeSearch(current_word.substring(1).replace(/[#!]/g, ""));
const found = globalEmojis.filter(i => resultSet.has(i.name)); const found = globalEmojis.filter(i => resultSet.has(i.name));
populate_speed_emoji_modal(found, event.target); populate_inline_emoji_modal(found, event.target);
}); });
} }
else { else {
speed_carot_modal.style.display = "none"; inline_carot_modal.style.display = "none";
} }
} }
function speed_carot_navigate(event) function inline_carot_navigate(event)
{ {
if (!selecting) return; if (!selecting) return;
let select_items = speed_carot_modal.querySelectorAll(".speed-modal-option"); let select_items = inline_carot_modal.querySelectorAll(".inline-modal-option");
if (!select_items || !curr_word_is_emoji()) return; if (!select_items || !curr_word_is_emoji()) return;
const modal_keybinds = { const modal_keybinds = {
@ -203,8 +203,8 @@ function insertGhostDivs(element) {
ghostdiv.style.display = "none"; ghostdiv.style.display = "none";
i.after(ghostdiv); i.after(ghostdiv);
} }
i.addEventListener('input', update_speed_emoji_modal, false); i.addEventListener('input', update_inline_emoji_modal, false);
i.addEventListener('keydown', speed_carot_navigate, false); i.addEventListener('keydown', inline_carot_navigate, false);
}); });
} }

4
files/assets/js/userpage_v.js
View File

@ -24,7 +24,7 @@ function updateBux(mobile=false) {
} }
function transferCoins(t, mobile=false) { function transferCoins(t, mobile=false) {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
for(let el of document.getElementsByClassName('toggleable')) { for(let el of document.getElementsByClassName('toggleable')) {
el.classList.add('d-none'); el.classList.add('d-none');
@ -48,7 +48,7 @@ function transferCoins(t, mobile=false) {
} }
function transferBux(t, mobile=false) { function transferBux(t, mobile=false) {
close_inline_speed_emoji_modal(); close_inline_emoji_modal();
for(let el of document.getElementsByClassName('toggleable')) { for(let el of document.getElementsByClassName('toggleable')) {
el.classList.add('d-none'); el.classList.add('d-none');

2
files/templates/modals/emoji.html
View File

@ -72,5 +72,5 @@
<input hidden id="emoji_params" value="?n={{emoji_count()}}&show_nsfw={{g.show_nsfw}}"> <input hidden id="emoji_params" value="?n={{emoji_count()}}&show_nsfw={{g.show_nsfw}}">
<script defer src="{{'js/emoji_modal/search_dictionary.js' | asset}}"></script> <script defer src="{{'js/emoji_modal/search_dictionary.js' | asset}}"></script>
<script defer src="{{'js/emoji_modal/speed_emoji_modal.js' | asset}}"></script> <script defer src="{{'js/emoji_modal/inline_emoji_modal.js' | asset}}"></script>
<script defer src="{{'js/emoji_modal/emoji_modal.js' | asset}}"></script> <script defer src="{{'js/emoji_modal/emoji_modal.js' | asset}}"></script>