kibi/f0ckm
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

update reply cancel button with less clutter

Browse Source
This commit is contained in:
Kibi Kelburton
2026-05-16 18:22:18 +02:00
parent f4faffd4de
commit b96d97e213
1 changed files with 96 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
public/s/js/comments.js
View File

@@ -19,14 +19,14 @@ class CommentSystem {
this.customEmojis = CommentSystem.emojiCache || {};
this.icons = {
reply: `<i class="fa-solid fa-reply"></i>`,
pin: `<i class="fa-solid fa-thumbtack"></i>`,
unpin: `<i class="fa-solid fa-thumbtack"></i>`,
edit: `<i class="fa-solid fa-pen"></i>`,
reply: `<i class="fa-solid fa-reply"></i>`,
pin: `<i class="fa-solid fa-thumbtack"></i>`,
unpin: `<i class="fa-solid fa-thumbtack"></i>`,
edit: `<i class="fa-solid fa-pen"></i>`,
delete: `<i class="fa-solid fa-trash"></i>`,
link: `<i class="fa-solid fa-link"></i>`,
link: `<i class="fa-solid fa-link"></i>`,
pinned: `<i class="fa-solid fa-thumbtack"></i>`,
lock: `<i class="fa-solid fa-lock"></i>`,
lock: `<i class="fa-solid fa-lock"></i>`,
unlock: `<i class="fa-solid fa-lock-open"></i>`
};
@@ -143,7 +143,7 @@ class CommentSystem {
// Stale-check: only compare player element (not mediaEl — SyntheticClock is always new)
if (window.danmakuInstance) {
const stale = window.danmakuInstance.player !== playerEl
|| !document.contains(window.danmakuInstance.player);
|| !document.contains(window.danmakuInstance.player);
if (stale) {
window.danmakuInstance.destroy();
window.danmakuInstance = null;
@@ -355,9 +355,9 @@ class CommentSystem {
try {
targetEl.setSelectionRange(state.focused.start, state.focused.end);
} catch (e) {
// Fallback to end if range is invalid
const len = targetEl.value.length;
targetEl.setSelectionRange(len, len);
// Fallback to end if range is invalid
const len = targetEl.value.length;
targetEl.setSelectionRange(len, len);
}
}
}
@@ -1078,7 +1078,7 @@ class CommentSystem {
el.muted = snap.muted;
el.volume = snap.volume;
if (!snap.paused) {
el.play().catch(() => {/* autoplay may be blocked */});
el.play().catch(() => {/* autoplay may be blocked */ });
}
});
}
@@ -1515,7 +1515,7 @@ class CommentSystem {
const urlToParse = href.startsWith('//') ? window.location.protocol + href : href;
const urlObj = new URL(urlToParse, siteOrigin);
isSameSite = (urlObj.hostname === window.location.hostname);
} catch(e) {}
} catch (e) { }
}
// Shorten internal links if text matches the URL
@@ -1905,8 +1905,8 @@ class CommentSystem {
renderInput(parentId = null) {
const i18n = window.f0ckI18n || {};
const placeholder = i18n.write_comment || 'Write a comment...';
const postLabel = i18n.post || 'Post';
const cancelLabel = i18n.cancel || 'Cancel';
const postLabel = i18n.post || 'Post';
const cancelLabel = i18n.cancel || 'Cancel';
const maxLen = window.f0ckSession?.comment_max_length;
const maxLenAttr = (maxLen !== null && maxLen !== undefined) ? ` maxlength="${maxLen}"` : '';
const counter = (maxLen !== null && maxLen !== undefined)
@@ -1917,7 +1917,7 @@ class CommentSystem {
<textarea placeholder="${placeholder}"${maxLenAttr}></textarea>
<div class="input-actions">
${counter}
${parentId ? `<button class="cancel-reply">${cancelLabel}</button>` : ''}
${parentId ? `<button class="cancel-reply" title="${cancelLabel}"><i class="fa-solid fa-xmark"></i></button>` : ''}
<button class="submit-comment">${postLabel}</button>
</div>
</div>
@@ -2068,7 +2068,7 @@ class CommentSystem {
.length;
counter.textContent = `${nonQuotedLen} / ${max}`;
counter.classList.toggle('near-limit', nonQuotedLen >= max * 0.9);
counter.classList.toggle('at-limit', nonQuotedLen >= max);
counter.classList.toggle('at-limit', nonQuotedLen >= max);
});
// Single Change Listener for Sort
@@ -2244,7 +2244,7 @@ class CommentSystem {
contentEl.innerHTML = `
<textarea class="edit-textarea">${currentContent}</textarea>
<div class="input-actions">
<button class="cancel-edit-btn">Cancel</button>
<button class="cancel-edit-btn" title="Cancel"><i class="fa-solid fa-comment-slash"></i></button>
<button class="save-edit-btn">Save</button>
</div>
`;
@@ -3052,8 +3052,11 @@ class CommentSystem {
}
textarea.focus();
});
const submitBtn = actions.querySelector('.submit-comment');
actions.insertBefore(trigger, submitBtn);
const referenceNode = actions.querySelector('.cancel-reply') ||
actions.querySelector('.cancel-edit-btn') ||
actions.querySelector('.submit-comment') ||
actions.querySelector('.save-edit-btn');
actions.insertBefore(trigger, referenceNode);
actions.insertBefore(spoilerBtn, trigger);
if (this.isAdmin) {
const lockBtn = document.createElement('button');