105 lines
3.6 KiB
JavaScript
105 lines
3.6 KiB
JavaScript
|
|
// Panel bootstrap. Wires DOM events to API / Library / Import handlers and
|
||
|
|
// restores the connection from localStorage on mount.
|
||
|
|
|
||
|
|
(function () {
|
||
|
|
// Avoid running twice if UXP reloads the panel.
|
||
|
|
if (window.__df_uxp_started) return;
|
||
|
|
window.__df_uxp_started = true;
|
||
|
|
|
||
|
|
function syncConnectBtn() {
|
||
|
|
const u = UI.$('#server-url').value.trim();
|
||
|
|
const t = UI.$('#api-token').value.trim();
|
||
|
|
UI.$('#connect-btn').disabled = !u || !t;
|
||
|
|
}
|
||
|
|
|
||
|
|
async function tryConnect(serverUrl, apiToken) {
|
||
|
|
UI.setStatus('#connect-status', 'Connecting…', 'muted');
|
||
|
|
try {
|
||
|
|
const me = await API.connect(serverUrl, apiToken);
|
||
|
|
UI.$('#connected-host').textContent =
|
||
|
|
(me.user && (me.user.display_name || me.user.username)) ?
|
||
|
|
(me.user.display_name || me.user.username) + ' @ ' + serverUrl
|
||
|
|
: serverUrl;
|
||
|
|
UI.setStatus('#connect-status', '', 'muted');
|
||
|
|
UI.showPane('library');
|
||
|
|
await Library.refresh('');
|
||
|
|
} catch (e) {
|
||
|
|
API.state.connected = false;
|
||
|
|
UI.setStatus('#connect-status', 'Connect failed: ' + e.message, 'error');
|
||
|
|
UI.showPane('connect');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function wireConnectPane() {
|
||
|
|
UI.$('#server-url').value = API.state.serverUrl;
|
||
|
|
UI.$('#api-token').value = API.state.apiToken;
|
||
|
|
syncConnectBtn();
|
||
|
|
['input', 'change'].forEach(ev => {
|
||
|
|
UI.$('#server-url').addEventListener(ev, syncConnectBtn);
|
||
|
|
UI.$('#api-token').addEventListener(ev, syncConnectBtn);
|
||
|
|
});
|
||
|
|
UI.$('#connect-btn').addEventListener('click', async () => {
|
||
|
|
const u = UI.$('#server-url').value.trim();
|
||
|
|
const t = UI.$('#api-token').value.trim();
|
||
|
|
await tryConnect(u, t);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function wireLibraryPane() {
|
||
|
|
UI.$('#disconnect-btn').addEventListener('click', () => {
|
||
|
|
API.disconnect();
|
||
|
|
UI.$('#server-url').value = '';
|
||
|
|
UI.$('#api-token').value = '';
|
||
|
|
syncConnectBtn();
|
||
|
|
UI.showPane('connect');
|
||
|
|
UI.setStatus('#connect-status', 'Disconnected.', 'muted');
|
||
|
|
});
|
||
|
|
|
||
|
|
let searchTimer = null;
|
||
|
|
UI.$('#search-input').addEventListener('input', (e) => {
|
||
|
|
clearTimeout(searchTimer);
|
||
|
|
const q = e.target.value;
|
||
|
|
searchTimer = setTimeout(() => Library.refresh(q), 250);
|
||
|
|
});
|
||
|
|
UI.$('#refresh-btn').addEventListener('click', () => Library.refresh(UI.$('#search-input').value));
|
||
|
|
|
||
|
|
UI.$('#import-proxy-btn').addEventListener('click', async () => {
|
||
|
|
const a = Library.selectedAsset();
|
||
|
|
if (!a) return;
|
||
|
|
UI.$('#import-proxy-btn').disabled = true;
|
||
|
|
UI.$('#import-hires-btn').disabled = true;
|
||
|
|
try { await Import.proxy(a); }
|
||
|
|
catch (e) { UI.hideProgress(); UI.toast('Proxy import failed: ' + e.message, 'error'); }
|
||
|
|
finally { Library.syncActions(); }
|
||
|
|
});
|
||
|
|
|
||
|
|
UI.$('#import-hires-btn').addEventListener('click', async () => {
|
||
|
|
const a = Library.selectedAsset();
|
||
|
|
if (!a) return;
|
||
|
|
UI.$('#import-proxy-btn').disabled = true;
|
||
|
|
UI.$('#import-hires-btn').disabled = true;
|
||
|
|
try { await Import.hires(a); }
|
||
|
|
catch (e) { UI.hideProgress(); UI.toast('Hi-res import failed: ' + e.message, 'error'); }
|
||
|
|
finally { Library.syncActions(); }
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function init() {
|
||
|
|
wireConnectPane();
|
||
|
|
wireLibraryPane();
|
||
|
|
// If we have stored creds, try to reconnect silently. On failure fall
|
||
|
|
// back to the connect pane so the user can retype.
|
||
|
|
if (API.state.serverUrl && API.state.apiToken) {
|
||
|
|
tryConnect(API.state.serverUrl, API.state.apiToken);
|
||
|
|
} else {
|
||
|
|
UI.showPane('connect');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (document.readyState === 'loading') {
|
||
|
|
document.addEventListener('DOMContentLoaded', init);
|
||
|
|
} else {
|
||
|
|
init();
|
||
|
|
}
|
||
|
|
})();
|