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

gfsd

Browse Source
This commit is contained in:
Kibi Kelburton
2026-07-17 12:55:11 +02:00
parent 7fe2192142
commit 41d18bbc54
2 changed files with 48 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
public/s/js/settings.js
View File

@@ -706,8 +706,8 @@
} }
const existingRemoveBtn = document.getElementById('banner-remove-btn'); const existingRemoveBtn = document.getElementById('banner-remove-btn');
if (!existingRemoveBtn && bannerUploadBtn) { if (!existingRemoveBtn) {
const actionsDiv = bannerUploadBtn.closest('.avatar-upload-actions'); const actionsDiv = bannerUploadBtn ? bannerUploadBtn.closest('.avatar-upload-actions') : null;
if (actionsDiv) { if (actionsDiv) {
const editBtn = document.createElement('button'); const editBtn = document.createElement('button');
editBtn.type = 'button'; editBtn.id = 'banner-edit-btn'; editBtn.type = 'button'; editBtn.id = 'banner-edit-btn';
@@ -720,6 +720,32 @@
btn.className = 'button button-danger'; btn.className = 'button button-danger';
btn.textContent = 'Remove Banner'; btn.textContent = 'Remove Banner';
actionsDiv.appendChild(btn); actionsDiv.appendChild(btn);
} else {
const menu = document.getElementById('banner-edit-menu');
if (menu) {
const editBtn = document.createElement('button');
editBtn.type = 'button'; editBtn.id = 'banner-edit-btn';
editBtn.style.cssText = 'display: block; width: 100%; text-align: left; padding: 5px 8px; background: none; border: none; color: #fff; cursor: pointer; font-size: 0.8em;';
editBtn.textContent = 'Edit Position';
editBtn.onmouseover = () => editBtn.style.background='#333';
editBtn.onmouseout = () => editBtn.style.background='none';
editBtn.onclick = () => menu.style.display='none';
menu.insertBefore(editBtn, menu.firstChild);
const remBtn = document.createElement('button');
remBtn.type = 'button'; remBtn.id = 'banner-remove-btn';
remBtn.style.cssText = 'display: block; width: 100%; text-align: left; padding: 5px 8px; background: none; border: none; color: #e74c3c; cursor: pointer; font-size: 0.8em;';
remBtn.textContent = 'Remove Banner';
remBtn.onmouseover = () => remBtn.style.background='#333';
remBtn.onmouseout = () => remBtn.style.background='none';
remBtn.onclick = () => menu.style.display='none';
menu.insertBefore(remBtn, menu.children[1]);
const hr = document.createElement('hr');
hr.style.cssText = 'border: none; border-top: 1px solid #444; margin: 5px 0;';
hr.id = 'banner-menu-hr';
menu.insertBefore(hr, menu.children[2]);
}
} }
} }
@@ -790,12 +816,12 @@
window._f0ckBannerEditBound = true; window._f0ckBannerEditBound = true;
document.addEventListener('click', async (e) => { document.addEventListener('click', async (e) => {
if (e.target.id === 'banner-edit-btn') { if (e.target.id === 'banner-edit-btn') {
const preview = document.getElementById('banner-preview'); const preview = document.getElementById('banner-preview') || document.getElementById('live-profile-preview-box');
if (!preview) return; if (!preview) return;
const bgImg = preview.style.backgroundImage; let bgImg = preview.style.backgroundImage || preview.style.getPropertyValue('--author-banner');
const bgPos = preview.style.backgroundPosition; let bgPos = preview.style.backgroundPosition || preview.style.getPropertyValue('--author-banner-position');
const bgSize = preview.style.backgroundSize; let bgSize = preview.style.backgroundSize || preview.style.getPropertyValue('--author-banner-size');
const urlMatch = bgImg.match(/url\(['"]?(.*?)['"]?\)/); const urlMatch = bgImg.match(/url\(['"]?(.*?)['"]?\)/);
if (!urlMatch) return; if (!urlMatch) return;
@@ -847,6 +873,8 @@
e.target.remove(); e.target.remove();
const editBtn = document.getElementById('banner-edit-btn'); const editBtn = document.getElementById('banner-edit-btn');
if (editBtn) editBtn.remove(); if (editBtn) editBtn.remove();
const menuHr = document.getElementById('banner-menu-hr');
if (menuHr) menuHr.remove();
const bannerPreview = document.getElementById('banner-preview'); const bannerPreview = document.getElementById('banner-preview');
if (bannerPreview) { if (bannerPreview) {

24
views/user-partial.html
View File

@@ -1,9 +1,19 @@
<div class="profile-page-wrapper" style="max-width: 800px; margin: 0 auto; width: 100%; padding: 20px 10px; box-sizing: border-box;"> <div class="profile-page-wrapper" style="max-width: 800px; margin: 0 auto; width: 100%; padding: 20px 10px; box-sizing: border-box;">
<div class="profile_head" id="live-profile-preview-box" data-banner-user="{{ user.user || '' }}" style="position: relative; @if(user.banner_file && user_banner_enabled) --author-banner: url('/a/{{ user.banner_file }}'); --author-banner-position: {{ user.banner_position === 'center' ? 'center top' : (user.banner_position || 'center top') }}; --author-banner-size: {{ user.banner_size || 'cover' }}; @endif"> <div class="profile_head" id="live-profile-preview-box" data-banner-user="{{ user.user || '' }}" style="position: relative; @if(user.banner_file && user_banner_enabled) --author-banner: url('/a/{{ user.banner_file }}'); --author-banner-position: {{ user.banner_position === 'center' ? 'center top' : (user.banner_position || 'center top') }}; --author-banner-size: {{ user.banner_size || 'cover' }}; @endif">
@if(session && session.id === user.user_id && user_banner_enabled) @if(session && session.id === user.user_id && user_banner_enabled)
<button id="inline-banner-edit-btn" style="position:absolute; top: 10px; right: 10px; background: rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.2); border-radius: 4px; padding: 4px 8px; color: #fff; cursor: pointer; z-index: 10; font-size: 0.8em;" title="{{ t('profile.edit_banner', 'Edit Banner') }}"> <div id="inline-banner-edit-wrapper" style="position:absolute; top: 10px; right: 10px; z-index: 10;">
<i class="fa-solid fa-pen"></i> Edit Banner <button id="inline-banner-edit-btn" onclick="const menu = document.getElementById('banner-edit-menu'); menu.style.display = menu.style.display === 'none' ? 'block' : 'none';" style="background: rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.2); border-radius: 4px; padding: 4px 8px; color: #fff; cursor: pointer; font-size: 0.8em;" title="{{ t('profile.edit_banner', 'Edit Banner') }}">
</button> <i class="fa-solid fa-pen"></i> Edit Banner
</button>
<div id="banner-edit-menu" style="display: none; position: absolute; right: 0; top: 100%; margin-top: 5px; background: #222; border: 1px solid #444; border-radius: 4px; padding: 5px; min-width: 120px; box-shadow: 0 2px 10px rgba(0,0,0,0.5);">
@if(user.banner_file)
<button id="banner-edit-btn" onclick="document.getElementById('banner-edit-menu').style.display='none';" style="display: block; width: 100%; text-align: left; padding: 5px 8px; background: none; border: none; color: #fff; cursor: pointer; font-size: 0.8em;" onmouseover="this.style.background='#333'" onmouseout="this.style.background='none'">Edit Position</button>
<button id="banner-remove-btn" onclick="document.getElementById('banner-edit-menu').style.display='none';" style="display: block; width: 100%; text-align: left; padding: 5px 8px; background: none; border: none; color: #e74c3c; cursor: pointer; font-size: 0.8em;" onmouseover="this.style.background='#333'" onmouseout="this.style.background='none'">Remove Banner</button>
<hr id="banner-menu-hr" style="border: none; border-top: 1px solid #444; margin: 5px 0;">
@endif
<button onclick="document.getElementById('banner-choose-btn').click(); document.getElementById('banner-edit-menu').style.display='none';" style="display: block; width: 100%; text-align: left; padding: 5px 8px; background: none; border: none; color: #fff; cursor: pointer; font-size: 0.8em;" onmouseover="this.style.background='#333'" onmouseout="this.style.background='none'">Upload New</button>
</div>
</div>
<div style="display:none;"> <div style="display:none;">
<button id="banner-choose-btn"></button> <button id="banner-choose-btn"></button>
<input type="file" id="banner-file-input" accept="image/gif,image/jpeg,image/png,image/webp"> <input type="file" id="banner-file-input" accept="image/gif,image/jpeg,image/png,image/webp">
@@ -386,13 +396,7 @@
<script src="/s/js/settings.js"></script> <script src="/s/js/settings.js"></script>
<script> <script>
(function() { (function() {
const bannerEditBtn = document.getElementById('inline-banner-edit-btn');
const bannerChooseBtn = document.getElementById('banner-choose-btn');
if (bannerEditBtn && bannerChooseBtn) {
bannerEditBtn.addEventListener('click', () => {
bannerChooseBtn.click();
});
}
const avatarEditBtn = document.getElementById('inline-avatar-btn'); const avatarEditBtn = document.getElementById('inline-avatar-btn');
const avatarFileInput = document.getElementById('inline-avatar-file'); const avatarFileInput = document.getElementById('inline-avatar-file');