joachim/FileRise
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Embed API documentation as a full-screen modal

Browse Source
This commit is contained in:
Ryan
2025-04-24 17:35:41 -04:00
committed by GitHub
parent 04f5cbe31f
commit 078db33458
2 changed files with 32 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@@ -1,6 +1,6 @@
# Changelog # Changelog
## Changes 4/24/2025 ## Changes 4/24/2025 1.2.5
- Enhance README and wiki with expanded installation instructions - Enhance README and wiki with expanded installation instructions
- Adjusted Dockerfile’s Apache vhost to: - Adjusted Dockerfile’s Apache vhost to:
@@ -12,6 +12,10 @@
- Deny access to hidden files (dot-files) - Deny access to hidden files (dot-files)
- Add access control in public/.htaccess for api.html & openapi.json; update Nginx example in wiki - Add access control in public/.htaccess for api.html & openapi.json; update Nginx example in wiki
- Remove obsolete folders from repo root - Remove obsolete folders from repo root
- Embed API documentation (`api.html`) directly in the FileRise UI as a full-screen modal
- Introduced `openApiModalBtn` in the user panel to launch the API modal
- Added `#apiModal` container with a same-origin `<iframe src="api.html">` so session cookies authenticate automatically
- Close control uses the existing `.editor-close-btn` for consistent styling and hover effects
## Changes 4/23/2025 1.2.4 ## Changes 4/23/2025 1.2.4

31
public/js/authModals.js
View File

@@ -3,7 +3,7 @@ import { sendRequest } from './networkUtils.js';
import { t, applyTranslations, setLocale } from './i18n.js'; import { t, applyTranslations, setLocale } from './i18n.js';
import { loadAdminConfigFunc } from './auth.js'; import { loadAdminConfigFunc } from './auth.js';
const version = "v1.2.4"; // Update this version string as needed const version = "v1.2.5"; // Update this version string as needed
const adminTitle = `${t("admin_panel")} <small style="font-size: 12px; color: gray;">${version}</small>`; const adminTitle = `${t("admin_panel")} <small style="font-size: 12px; color: gray;">${version}</small>`;
let lastLoginData = null; let lastLoginData = null;
@@ -230,14 +230,36 @@ export function openUserPanel() {
<!-- New API Docs link --> <!-- New API Docs link -->
<div style="margin-bottom: 15px;"> <div style="margin-bottom: 15px;">
<a href="api.html" target="_blank" class="btn btn-secondary"> <button type="button" id="openApiModalBtn" class="btn btn-secondary">
${t("api_docs") || "API Docs"} ${t("api_docs") || "API Docs"}
</a> </button>
</div> </div>
</div> </div>
`; `;
document.body.appendChild(userPanelModal); document.body.appendChild(userPanelModal);
const apiModal = document.createElement("div");
apiModal.id = "apiModal";
apiModal.style.cssText = `
position: fixed; top:0; left:0; width:100vw; height:100vh;
background: rgba(0,0,0,0.8); z-index: 4000; display:none;
align-items: center; justify-content: center;
`;
apiModal.innerHTML = `
<div style="position:relative; width:90vw; height:90vh; background:#fff; border-radius:8px; overflow:hidden;">
<div class="editor-close-btn" id="closeApiModal">&times;</div>
<iframe src="api.html" style="width:100%;height:100%;border:none;"></iframe>
</div>
`;
document.body.appendChild(apiModal);
document.getElementById("openApiModalBtn").addEventListener("click", () => {
apiModal.style.display = "flex";
});
document.getElementById("closeApiModal").addEventListener("click", () => {
apiModal.style.display = "none";
});
// Handlers… // Handlers…
document.getElementById("closeUserPanel").addEventListener("click", () => { document.getElementById("closeUserPanel").addEventListener("click", () => {
userPanelModal.style.display = "none"; userPanelModal.style.display = "none";
@@ -246,6 +268,7 @@ export function openUserPanel() {
document.getElementById("changePasswordModal").style.display = "block"; document.getElementById("changePasswordModal").style.display = "block";
}); });
// TOTP checkbox // TOTP checkbox
const totpCheckbox = document.getElementById("userTOTPEnabled"); const totpCheckbox = document.getElementById("userTOTPEnabled");
totpCheckbox.checked = localStorage.getItem("userTOTPEnabled") === "true"; totpCheckbox.checked = localStorage.getItem("userTOTPEnabled") === "true";