fix(auth+bugs): optional auth bypass, login routes, conform column name, panel metadata fields, login page: main.js
This commit is contained in:
parent
47c113e6c3
commit
72c4a7f136
1 changed files with 64 additions and 86 deletions
|
|
@ -90,7 +90,7 @@ async function loadThumbnail(img, assetId) {
|
|||
img.src = url;
|
||||
img.dataset.loaded = '1';
|
||||
} catch (_) {
|
||||
// thumbnail unavailable — leave placeholder visible
|
||||
// thumbnail unavailable — leave placeholder
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -109,9 +109,8 @@ function setupEventListeners() {
|
|||
elements.serverUrlInput.addEventListener('change', (e) => {
|
||||
state.serverUrl = e.target.value.trim().replace(/\/$/, '');
|
||||
localStorage.setItem('mam_server_url', state.serverUrl);
|
||||
state.thumbCache = {}; // bust cache when server changes
|
||||
state.thumbCache = {};
|
||||
});
|
||||
|
||||
elements.connectBtn.addEventListener('click', connectToServer);
|
||||
elements.searchInput.addEventListener('input', debounce(handleSearch, 300));
|
||||
elements.projectFilter.addEventListener('change', handleProjectFilter);
|
||||
|
|
@ -136,10 +135,11 @@ async function connectToServer() {
|
|||
elements.connectBtn.disabled = true;
|
||||
|
||||
try {
|
||||
// Use the projects endpoint as a health check (no separate /health route exists)
|
||||
// Use the projects endpoint as a connectivity check
|
||||
const response = await fetch(`${state.serverUrl}/api/v1/projects`, {
|
||||
method: 'GET',
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'include',
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
|
|
@ -148,7 +148,6 @@ async function connectToServer() {
|
|||
elements.connectBtn.textContent = 'Reconnect';
|
||||
logMessage('Connected to Wild Dragon MAM');
|
||||
|
||||
// Pass the already-fetched JSON to avoid a second round-trip
|
||||
const projectData = await response.json();
|
||||
await fetchProjects(projectData);
|
||||
await fetchAssets();
|
||||
|
|
@ -178,19 +177,15 @@ function updateConnectionStatus(status) {
|
|||
// API Calls
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Load projects into state and the filter dropdown.
|
||||
* @param {Array} [preloadedData] - If provided, skips the fetch (reuse connection-check response).
|
||||
*/
|
||||
async function fetchProjects(preloadedData) {
|
||||
try {
|
||||
let projects;
|
||||
if (preloadedData) {
|
||||
// GET /api/v1/projects returns a plain array (not { projects: [] })
|
||||
projects = Array.isArray(preloadedData) ? preloadedData : [];
|
||||
} else {
|
||||
const response = await fetch(`${state.serverUrl}/api/v1/projects`, {
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'include',
|
||||
});
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||||
const data = await response.json();
|
||||
|
|
@ -217,21 +212,18 @@ async function fetchProjects(preloadedData) {
|
|||
|
||||
async function fetchAssets(page = 0) {
|
||||
if (!state.isConnected) return;
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
offset: page * state.pageSize,
|
||||
limit: state.pageSize,
|
||||
});
|
||||
|
||||
if (state.searchQuery) params.append('search', state.searchQuery);
|
||||
if (state.selectedProject !== 'all') params.append('project_id', state.selectedProject);
|
||||
|
||||
const response = await fetch(
|
||||
`${state.serverUrl}/api/v1/assets?${params.toString()}`,
|
||||
{ headers: { Accept: 'application/json' } }
|
||||
{ headers: { Accept: 'application/json' }, credentials: 'include' }
|
||||
);
|
||||
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||||
|
||||
const data = await response.json();
|
||||
|
|
@ -252,6 +244,7 @@ async function fetchAssetDetails(assetId) {
|
|||
try {
|
||||
const response = await fetch(`${state.serverUrl}/api/v1/assets/${assetId}`, {
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'include',
|
||||
});
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||||
return await response.json();
|
||||
|
|
@ -268,6 +261,7 @@ async function fetchAssetDetails(assetId) {
|
|||
async function getSignedDownloadUrl(assetId) {
|
||||
const response = await fetch(`${state.serverUrl}/api/v1/assets/${assetId}/stream`, {
|
||||
headers: { Accept: 'application/json' },
|
||||
credentials: 'include',
|
||||
});
|
||||
if (!response.ok) throw new Error(`HTTP ${response.status} from /stream`);
|
||||
const { url } = await response.json();
|
||||
|
|
@ -301,7 +295,7 @@ function createAssetCard(asset) {
|
|||
}
|
||||
card.dataset.assetId = asset.id;
|
||||
|
||||
// Thumbnail — lazy loaded by IntersectionObserver
|
||||
// Thumbnail — lazy loaded via IntersectionObserver
|
||||
const thumbnail = document.createElement('div');
|
||||
thumbnail.className = 'asset-thumbnail';
|
||||
|
||||
|
|
@ -312,7 +306,6 @@ function createAssetCard(asset) {
|
|||
img.onerror = () => { img.style.display = 'none'; };
|
||||
thumbnail.appendChild(img);
|
||||
thumbObserver.observe(img);
|
||||
|
||||
card.appendChild(thumbnail);
|
||||
|
||||
// Info row
|
||||
|
|
@ -327,7 +320,8 @@ function createAssetCard(asset) {
|
|||
info.appendChild(filenameEl);
|
||||
|
||||
const durationSec = asset.duration_ms ? asset.duration_ms / 1000 : null;
|
||||
const codec = (asset.metadata && asset.metadata.codec) || asset.media_type || 'video';
|
||||
// codec and media_type are top-level columns on the asset record
|
||||
const codec = asset.codec || asset.media_type || 'video';
|
||||
const meta = document.createElement('div');
|
||||
meta.className = 'asset-meta';
|
||||
meta.innerHTML = [
|
||||
|
|
@ -350,16 +344,16 @@ function showAssetDetails(asset) {
|
|||
state.selectedAsset = asset;
|
||||
elements.detailsPanel.classList.remove('hidden');
|
||||
|
||||
const meta = asset.metadata || {};
|
||||
// All of these are top-level columns in the assets table
|
||||
elements.detailsFilename.textContent = asset.display_name || asset.filename;
|
||||
elements.detailsCodec.textContent = meta.codec || asset.media_type || 'Unknown';
|
||||
elements.detailsResolution.textContent = meta.resolution || 'N/A';
|
||||
elements.detailsFps.textContent = meta.fps ? meta.fps + ' fps' : 'N/A';
|
||||
elements.detailsCodec.textContent = asset.codec || asset.media_type || 'Unknown';
|
||||
elements.detailsResolution.textContent = asset.resolution || 'N/A';
|
||||
elements.detailsFps.textContent = asset.fps ? asset.fps + ' fps' : 'N/A';
|
||||
elements.detailsDuration.textContent = asset.duration_ms
|
||||
? formatDuration(asset.duration_ms / 1000)
|
||||
: 'N/A';
|
||||
elements.detailsSize.textContent = meta.file_size
|
||||
? formatFileSize(meta.file_size)
|
||||
elements.detailsSize.textContent = asset.file_size
|
||||
? formatFileSize(asset.file_size)
|
||||
: 'N/A';
|
||||
|
||||
elements.detailsTags.innerHTML = '';
|
||||
|
|
@ -428,18 +422,18 @@ async function importAsset(asset) {
|
|||
try {
|
||||
elements.importBtn.disabled = true;
|
||||
|
||||
// Step 1: get a presigned proxy URL from the MAM API
|
||||
// 1. Get a presigned proxy URL
|
||||
showProgress('Getting download link...', 5);
|
||||
const url = await getSignedDownloadUrl(asset.id);
|
||||
|
||||
// Step 2: download the proxy (H.264) to the OS temp directory
|
||||
// 2. Download proxy to OS temp dir via Node.js
|
||||
const safeName = sanitizeFilename(
|
||||
(asset.display_name || asset.filename || asset.id) + '.mp4'
|
||||
);
|
||||
showProgress('Downloading ' + safeName + '...', 10);
|
||||
const filePath = await downloadFile(url, safeName);
|
||||
|
||||
// Step 3: hand the local path to Premiere Pro via ExtendScript
|
||||
// 3. Hand the local path to Premiere Pro
|
||||
showProgress('Importing into Premiere Pro...', 85);
|
||||
await importFileToPremiereProject(filePath);
|
||||
|
||||
|
|
@ -456,13 +450,7 @@ async function importAsset(asset) {
|
|||
|
||||
/**
|
||||
* Downloads a remote URL to a local temp file using Node.js http/https.
|
||||
*
|
||||
* Node.js is available via require() in CEP when the manifest contains:
|
||||
* <CEFCommandLine><Parameter>--enable-nodejs</Parameter></CEFCommandLine>
|
||||
*
|
||||
* @param {string} url - Presigned download URL (http or https)
|
||||
* @param {string} filename - Desired local filename (sanitized)
|
||||
* @returns {Promise<string>} Resolved with the absolute path to the saved file
|
||||
* Requires --enable-nodejs in the CEP manifest.
|
||||
*/
|
||||
function downloadFile(url, filename) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
|
@ -517,15 +505,10 @@ function downloadFile(url, filename) {
|
|||
}
|
||||
|
||||
/**
|
||||
* Uses csInterface.evalScript to call the Premiere Pro ExtendScript layer
|
||||
* and import the given local file into the active project.
|
||||
*
|
||||
* @param {string} filePath - Absolute local path to the downloaded proxy file
|
||||
* @returns {Promise<object>}
|
||||
* Calls csInterface.evalScript to import a local file into the open Premiere project.
|
||||
*/
|
||||
function importFileToPremiereProject(filePath) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
// Escape backslashes for Windows paths inside the script string literal
|
||||
var safePath = filePath.replace(/\\/g, '\\\\');
|
||||
|
||||
var script = [
|
||||
|
|
@ -641,9 +624,6 @@ function escapeHtml(str) {
|
|||
.replace(/'/g, ''');
|
||||
}
|
||||
|
||||
/**
|
||||
* Strips characters illegal in file names on Windows/macOS.
|
||||
*/
|
||||
function sanitizeFilename(name) {
|
||||
return name.replace(/[<>:"/\\|?*\x00-\x1f]/g, '_');
|
||||
}
|
||||
|
|
@ -653,9 +633,7 @@ function formatDuration(seconds) {
|
|||
var h = Math.floor(seconds / 3600);
|
||||
var m = Math.floor((seconds % 3600) / 60);
|
||||
var s = Math.floor(seconds % 60);
|
||||
if (h > 0) {
|
||||
return h + ':' + String(m).padStart(2, '0') + ':' + String(s).padStart(2, '0');
|
||||
}
|
||||
if (h > 0) return h + ':' + String(m).padStart(2, '0') + ':' + String(s).padStart(2, '0');
|
||||
return m + ':' + String(s).padStart(2, '0');
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue