-
-
-
-
-
-
+
+
+
+
+
-
+
Image name
-
-
Generation prompt
+
+
Reference Images
+
+ Face reference
@@ -2167,16 +2166,11 @@
@@ -2346,6 +2353,31 @@
// --- HYDRATION_START ---
const PRELOADED_IMAGES = [
+ "20260630_021844_view_000_000deg.png",
+ "20260630_022002_view_000_000deg.png",
+ "20260630_021951_view_000_000deg.png",
+ "20260630_021940_view_000_000deg.png",
+ "20260630_021929_view_000_000deg.png",
+ "20260630_021906_view_000_000deg.png",
+ "20260630_021855_view_000_000deg.png",
+ "20260630_021833_view_000_000deg.png",
+ "20260630_021821_view_000_000deg.png",
+ "20260630_021810_view_000_000deg.png",
+ "20260630_021759_view_000_000deg.png",
+ "20260630_021748_view_000_000deg.png",
+ "20260630_021737_view_000_000deg.png",
+ "20260630_021726_view_000_000deg.png",
+ "20260630_021715_view_000_000deg.png",
+ "_turntable/cg_ad73335e/views/view_000_000deg.png",
+ "20260630_021650_view_000_000deg.png",
+ "20260630_021342_sc_view_023_345deg.png",
+ "20260630_021047_sc_view_023_345deg.png",
+ "20260630_020706_sc_view_023_345deg.png",
+ "20260630_020632_sc_view_023_345deg.png",
+ "20260630_020621_sc_view_023_345deg.png",
+ "20260630_020517_sc_view_023_345deg.png",
+ "20260630_020313_sc_view_023_345deg.png",
+ "20260630_020143_sc_view_023_345deg.png",
"20260629_212135_image.png",
"20260629_211901_dup_view_002_030deg.png",
"20260629_211841_dup_view_002_030deg.png",
@@ -2353,7 +2385,6 @@
"20260629_211613_dup_view_002_030deg.png",
"20260629_211543_dup_view_002_030deg.png",
"20260629_205647_dup_view_002_030deg.png",
- "20260629_211323_test_upload_image.png",
"20260629_211213_dup_view_002_030deg.png",
"20260629_210320_dup_view_002_030deg.png",
"20260629_210225_dup_view_002_030deg.png",
@@ -5219,7 +5250,6 @@
"_turntable/cg_ad73335e/views/view_005_075deg.png",
"_turntable/cg_ad73335e/views/view_004_060deg.png",
"_turntable/cg_ad73335e/views/view_003_045deg.png",
- "_turntable/cg_ad73335e/views/view_000_000deg.png",
"_turntable/cg_61b863a8/views/view_023_345deg.png",
"_turntable/cg_61b863a8/views/view_022_330deg.png",
"_turntable/cg_61b863a8/views/view_021_315deg.png",
@@ -7791,13 +7821,43 @@
let _multiSelectModeActive = false;
const _selectedFilenames = new Set();
+ function isOrbitFile(fname) {
+ if (!fname) return false;
+ return fname.includes('_turntable/') || /deg\.png|deg_|\d+deg/i.test(fname);
+ }
+
+ function getRepresentativeLabel(n) {
+ if (isOrbitFile(n)) {
+ const m = n.match(/_(\d+)deg/i) || n.match(/(\d+)deg/i) || n.match(/view_(\d+)/i);
+ if (m) {
+ let num = m[1].replace(/^0+/, '');
+ if (!num) num = '0';
+ return `Orbit ${num}°`;
+ }
+ return 'Orbit';
+ }
+ if (n.endsWith('_face.png') || n.includes('_face.')) {
+ return '👤 Face Crop';
+ }
+ if (fileIsSource[n]) {
+ return '★ Source';
+ }
+ if (filePoses[n]) {
+ return filePoses[n];
+ }
+ if (isVideo(n) || fileContentType[n] === 'video') {
+ return '🎬 Video';
+ }
+ return '';
+ }
+
function switchFilmstripTab(tab) {
_activeFilmstripTab = tab;
// Highlight tab
- ['Active', 'Group', 'Hidden', 'Source', 'Archived', 'Video'].forEach(t => {
+ ['Active', 'Group', 'Hidden', 'Source', 'Archived', 'Video', 'OrbitFilter'].forEach(t => {
const el = document.getElementById(`fsTab${t}`);
- if (el) el.classList.toggle('active', t.toLowerCase() === tab);
+ if (el) el.classList.toggle('active', t.toLowerCase().replace('filter', '') === tab);
});
// Reset selection when switching tabs
@@ -7810,12 +7870,13 @@
const data = groupData.get(lbCurrentGid);
if (data) {
if (tab === 'active') {
- // Filter out hidden, source, archived, and videos
+ // Filter out hidden, source, archived, videos, and orbits
const activeNames = [];
const activeUrls = [];
data.names.forEach((name, i) => {
const isVid = isVideo(name) || fileContentType[name] === 'video';
- if (!fileHidden[name] && !fileIsSource[name] && !fileArchived[name] && !isVid) {
+ const isOrb = isOrbitFile(name);
+ if (!fileHidden[name] && !fileIsSource[name] && !fileArchived[name] && !isVid && !isOrb) {
activeNames.push(name);
activeUrls.push(data.urls[i]);
}
@@ -7847,6 +7908,8 @@
matched.push(fname);
} else if (tab === 'video' && isVid && !isArchived) {
matched.push(fname);
+ } else if (tab === 'orbit' && isOrbitFile(fname) && !isArchived) {
+ matched.push(fname);
}
});
@@ -8476,8 +8539,10 @@
if (!rect) return;
const isManual = !!document.getElementById('padBar');
+ if (!isManual) return;
+
const getV = (side) => {
- const el = document.getElementById(isManual ? 'pad' + side : 'sbPad' + side);
+ const el = document.getElementById('pad' + side);
return el ? el.value : '0';
};
@@ -8496,19 +8561,13 @@
overlay.className = 'pad-preview-overlay';
// Style based on selected fill mode to make preview professional & intuitive
- if (isManual) {
- if (fill === 'black') {
- overlay.style.background = 'rgba(0, 0, 0, 0.7)';
- overlay.style.borderColor = '#444';
- } else if (fill === 'white') {
- overlay.style.background = 'rgba(255, 255, 255, 0.7)';
- overlay.style.borderColor = '#ccc';
- } else {
- overlay.style.background = 'rgba(245, 158, 11, 0.4)';
- overlay.style.borderColor = '#f59e0b';
- }
+ if (fill === 'black') {
+ overlay.style.background = 'rgba(0, 0, 0, 0.7)';
+ overlay.style.borderColor = '#444';
+ } else if (fill === 'white') {
+ overlay.style.background = 'rgba(255, 255, 255, 0.7)';
+ overlay.style.borderColor = '#ccc';
} else {
- // Sidebar is always transparent background before outpaint
overlay.style.background = 'rgba(245, 158, 11, 0.4)';
overlay.style.borderColor = '#f59e0b';
}
@@ -8530,6 +8589,9 @@
}
viewer.appendChild(overlay);
});
+
+ // Re-render Generate tab button if active
+ updateSbGenBtn();
}
function closeStudio() {
@@ -8849,9 +8911,11 @@
// Source refs
const refs = fileSourceRefs[fname];
const refsDiv = document.getElementById('lbSourceRefs');
+ const refsWrap = document.getElementById('lbSourceRefsWrap');
if (refsDiv) {
if (refs && refs.length > 0) {
refsDiv.style.display = 'flex';
+ if (refsWrap) refsWrap.style.display = 'block';
refsDiv.innerHTML = refs.map(r => {
let srcUrl = '';
let isGallery = true;
@@ -8879,6 +8943,7 @@
}).join('');
} else {
refsDiv.style.display = 'none';
+ if (refsWrap) refsWrap.style.display = 'none';
}
}
@@ -8901,13 +8966,21 @@
const prefBtn = document.getElementById('lbPreferredBtn');
if (prefBtn) prefBtn.style.display = multi && lbIdx > 0 ? '' : 'none';
+ // Dynamically show or hide the Orbit tab filter depending on whether orbit files exist in this group
+ const orbitFilterBtn = document.getElementById('fsTabOrbitFilter');
+ if (orbitFilterBtn) {
+ const data = groupData.get(lbCurrentGid);
+ const hasOrbits = data && data.names.some(isOrbitFile);
+ orbitFilterBtn.style.display = hasOrbits ? '' : 'none';
+ }
+
// Film strip — always visible (override old display:none CSS)
const strip = document.getElementById('lbVariantStrip');
strip.style.display = 'flex';
const sceneryActive = _activeSidebarTab === 'scenery';
strip.innerHTML = lbUrls.map((url, i) => {
const n = lbNames[i];
- const pose = filePoses[n] || '';
+ const pose = getRepresentativeLabel(n);
const act = i === lbIdx ? ' active' : '';
const isSel = _selectedFilenames.has(n);
const selCls = isSel ? ' selected' : '';
@@ -10423,9 +10496,19 @@
if (btn) btn.disabled = false;
}
+ function copyRawFilename() {
+ const fname = lbNames[lbIdx];
+ if (!fname) return;
+ navigator.clipboard.writeText(fname).then(() => {
+ showToast('Filename copied to clipboard', 'success');
+ }).catch(err => {
+ showToast('Failed to copy: ' + err, 'error');
+ });
+ }
+
async function lbRemoveBg() {
const fname = lbNames[lbIdx];
- const btn = document.getElementById('lbNoBgBtn');
+ const btn = document.getElementById('lbNoBgBtn') || document.getElementById('sbNoBgBtn');
if (btn) { btn.disabled = true; btn.textContent = 'Removing…'; }
showToast('Removing background…');
try {
@@ -12028,9 +12111,8 @@
}
if ((e.key === 'c' || e.key === 'C') && tag !== 'INPUT' && tag !== 'TEXTAREA') {
if (document.getElementById('studio').classList.contains('open')) {
- const cb = document.getElementById('sbCheckerboard');
const viewer = document.getElementById('studioViewer');
- const cur = viewer ? viewer.classList.contains('show-checker') : (cb ? cb.checked : false);
+ const cur = viewer ? viewer.classList.contains('show-checker') : false;
toggleCheckerboard(!cur);
return;
}
@@ -12352,12 +12434,6 @@
const savedScrollTop = panel.scrollTop;
// Preserve live input values before re-render
const prevPromptVal = document.getElementById('sbGenPromptInput')?.value ?? '';
- _sbPadTop = document.getElementById('sbPadTop')?.value ?? _sbPadTop;
- _sbPadRight = document.getElementById('sbPadRight')?.value ?? _sbPadRight;
- _sbPadBottom = document.getElementById('sbPadBottom')?.value ?? _sbPadBottom;
- _sbPadLeft = document.getElementById('sbPadLeft')?.value ?? _sbPadLeft;
- _sbPadOutpaint = document.getElementById('sbPadOutpaint')?.checked ?? _sbPadOutpaint;
- _sbPadUniform = document.getElementById('sbPadUniform')?.checked ?? _sbPadUniform;
_fsSelectedPoses.forEach(name => {
const el = document.getElementById('sbPoseEdit_' + CSS.escape(name));
if (el) _sbPoseEdits[name] = el.value;
@@ -12366,32 +12442,40 @@
const donePoses = new Set();
lbNames.forEach(n => { if (filePoses[n]) donePoses.add(filePoses[n]); });
- // Camera angles section — absolute positions
+ // Camera angles section — absolute positions (default collapsed)
const absAngles = CAMERA_ANGLES.filter(a => !a.relative);
const relAngles = CAMERA_ANGLES.filter(a => a.relative);
const ORBIT_NAMES = ['Front', '¾ Left', '¾ Right', 'Side L', 'Side R', 'Back'];
const allOrbitSel = ORBIT_NAMES.every(n => _sbSelectedAngles.has(n));
- let html = `
-
-
-
-
-
@@ -2186,7 +2180,20 @@
-
+
+
+
+
Image name
+
+
- Camera — absolute
-
-
`;
+ let html = `
+
';
- // Relative rotations
- html += '
+
+ Camera — absolute +
+
+
+
+ `;
html += absAngles.map(a => {
const sel = _sbSelectedAngles.has(a.name) ? ' selected' : '';
const done = donePoses.has(a.name) ? ' done' : '';
const nSafe = a.name.replace(/'/g, "\\'");
return ``;
}).join('');
- html += '
';
+ html += 'Camera — relative
';
+ // Relative rotations (default collapsed)
+ html += `
+
';
// Wireframe pose reference
const wfSel = _sbWireframeRef || '';
@@ -12485,18 +12569,6 @@
});
}
- // Add a brand-new pose (persisted to poses.md).
- html += `
-
+
Camera — relative
+`;
html += relAngles.map(a => {
const sel = _sbSelectedAngles.has(a.name) ? ' selected' : '';
const done = donePoses.has(a.name) ? ' done' : '';
const nSafe = a.name.replace(/'/g, "\\'");
return ``;
}).join('');
- html += '
';
+ html += '
-
`;
-
// Sticky footer — always visible without scrolling: refs + custom prompt + Generate
html += `+ New pose
- - - - -`;
if (_sbRefIndices.length > 0) {
@@ -12526,33 +12598,7 @@
: 'One edit per selected reference.'}
`;
}
}
- html += `
- Pad:
- ${['Top','Right','Bottom','Left'].map(side => {
- const val = side==='Top'?_sbPadTop:side==='Right'?_sbPadRight:side==='Bottom'?_sbPadBottom:_sbPadLeft;
- const onInput = `syncPadFields(this)`;
- const onBlur = `this.value = formatPadValue(this.value); ${onInput}`;
- const label = side === 'Top' ? 'T:' : side === 'Right' ? 'R:' : side === 'Bottom' ? 'B:' : 'L:';
- return ``;
- }).join('')}
-
-
-
-
-
-
-
-
-
-
-
-
+ html += `
Generating…
@@ -12628,13 +12674,14 @@
if (el) _sbPoseEdits[name] = el.value;
}
- // Refetch poses from the backend, then re-render both the Generate tab and batch menu.
+ // Refetch poses from the backend, then re-render both the Generate tab, Design tab and batch menu.
async function _reloadPosesUI() {
try {
const r = await fetch(`${API}/poses`);
if (r.ok) availablePoses = await r.json();
} catch (e) { /* non-fatal */ }
renderSidebarGenerate();
+ renderSidebarDesigner();
if (document.getElementById('poseMenu')) renderPoseMenu();
}
@@ -12694,6 +12741,12 @@
});
if (r.ok) {
showToast('Pose added', 'success');
+ const nEl = document.getElementById('sbNewPoseName');
+ const tEl = document.getElementById('sbNewPoseText');
+ const bEl = document.getElementById('sbNewPoseBeta');
+ if (nEl) nEl.value = '';
+ if (tEl) tEl.value = '';
+ if (bEl) bEl.checked = false;
await _reloadPosesUI();
} else {
showToast('Add failed: ' + await r.text(), 'error');
@@ -12764,7 +12817,7 @@
}, 400);
}
- async function submitSingleAngle(prompt) {
+ async function submitSingleAngle(prompt, angleName) {
if (!_fsModelFilename) return;
const bar = document.getElementById('studioAngleBar');
if (bar) bar.style.pointerEvents = 'none';
@@ -12774,7 +12827,7 @@
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
filenames: [_fsModelFilename], prompt: [prompt],
- poses: [null], seed: -1, max_area: 0, group_id: lbCurrentGid,
+ poses: [angleName || null], seed: -1, max_area: 0, group_id: lbCurrentGid,
wireframe_ref: _sbWireframeRef || null,
wireframe_time: _sbWireframeTime,
}),
@@ -12811,7 +12864,8 @@
const overlay = CAMERA_ANGLES.slice(0, 6);
bar.innerHTML = overlay.map(a => {
const pSafe = a.prompt.replace(/'/g, "\\'");
- return ``;
+ const nSafe = a.name.replace(/'/g, "\\'");
+ return ``;
}).join('') + `
+ `;
+
+ // Synchronize the button's visual state on render
+ const isChecked = document.getElementById('studioViewer')?.classList.contains('show-checker');
+ const overlayBtn = document.getElementById('overlayCheckerboardBtn');
+ if (overlayBtn) {
+ overlayBtn.style.color = isChecked ? '#10b981' : '#f43f5e';
+ overlayBtn.style.background = isChecked ? 'rgba(16,185,129,0.1)' : '';
+ }
}
function updateSbGenBtn() {
const btn = document.getElementById('sbGenBtn');
if (!btn) return;
const hasPrompt = (document.getElementById('sbGenPromptInput')?.value || '').trim().length > 0;
- const getV = (id) => document.getElementById(id)?.value || '0';
- const padValStr = getV('sbPadTop') + getV('sbPadRight') + getV('sbPadBottom') + getV('sbPadLeft');
- const hasPadding = padValStr.replace(/[0%\s]/g, '').length > 0;
- const outpaint = document.getElementById('sbPadOutpaint')?.checked;
- const hasPaddingAction = hasPadding && outpaint;
+
+ let hasPaddingAction = false;
+ const padBar = document.getElementById('padBar');
+ if (padBar) {
+ const getV = (id) => document.getElementById(id)?.value || '0';
+ const padValStr = getV('padTop') + getV('padRight') + getV('padBottom') + getV('padLeft');
+ const hasPadding = padValStr.replace(/[0%\s]/g, '').length > 0;
+ const outpaint = document.getElementById('padOutpaint')?.checked;
+ hasPaddingAction = hasPadding && outpaint;
+ }
+
const total = _fsSelectedPoses.size + _sbSelectedAngles.size + (hasPrompt ? 1 : 0) + (hasPaddingAction && !hasPrompt ? 1 : 0);
btn.disabled = total === 0;
btn.textContent = total > 1 ? `Generate (${total})` : 'Generate';
@@ -12986,20 +13060,29 @@
if (!_fsModelFilename) return;
const promptVal = (document.getElementById('sbGenPromptInput')?.value || '').trim();
const hasPoses = _fsSelectedPoses.size > 0 || _sbSelectedAngles.size > 0;
- const getV = (id) => document.getElementById(id)?.value || '0';
- const padValStr = getV('sbPadTop') + getV('sbPadRight') + getV('sbPadBottom') + getV('sbPadLeft');
- const hasPadding = padValStr.replace(/[0%\s]/g, '').length > 0;
- const outpaint = document.getElementById('sbPadOutpaint')?.checked;
- const hasPaddingAction = hasPadding && outpaint;
-
- if (!hasPoses && !hasPaddingAction) {
- // If no poses or padding, we'll run base_prompts
+
+ const padBar = document.getElementById('padBar');
+ let hasPaddingAction = false;
+ if (padBar) {
+ const getV = (id) => document.getElementById(id)?.value || '0';
+ const padValStr = getV('padTop') + getV('padRight') + getV('padBottom') + getV('padLeft');
+ const hasPadding = padValStr.replace(/[0%\s]/g, '').length > 0;
+ const outpaint = document.getElementById('padOutpaint')?.checked;
+ hasPaddingAction = hasPadding && outpaint;
+
+ _sbPadTop = document.getElementById('padTop')?.value || '0';
+ _sbPadRight = document.getElementById('padRight')?.value || '0';
+ _sbPadBottom = document.getElementById('padBottom')?.value || '0';
+ _sbPadLeft = document.getElementById('padLeft')?.value || '0';
+ _sbPadOutpaint = outpaint || false;
+ } else {
+ _sbPadTop = '0';
+ _sbPadRight = '0';
+ _sbPadBottom = '0';
+ _sbPadLeft = '0';
+ _sbPadOutpaint = false;
}
- _sbPadTop = document.getElementById('sbPadTop')?.value || '0';
- _sbPadRight = document.getElementById('sbPadRight')?.value || '0';
- _sbPadBottom = document.getElementById('sbPadBottom')?.value || '0';
- _sbPadLeft = document.getElementById('sbPadLeft')?.value || '0';
- _sbPadOutpaint = document.getElementById('sbPadOutpaint')?.checked || false;
+
const prompts = [], poses = [];
_fsSelectedPoses.forEach(name => {
poses.push(name);
@@ -13860,8 +13943,8 @@
const isSelected = _sceneRefs[0] && _sceneRefs[0].kind === 'wireframe' && _sceneRefs[0].name === frame;
const borderStyle = isSelected ? 'border:2px solid #8b5cf6' : 'border:1px solid #27272a';
html += `
-
- })
+
+
`;
});
@@ -13897,8 +13980,8 @@
const isSelected = _sceneRefs[0] && _sceneRefs[0].kind === 'wireframe' && _sceneRefs[0].name === img;
const borderStyle = isSelected ? 'border:2px solid #2563eb' : 'border:1px solid #333';
html += `
-
- })
+
';
@@ -14006,10 +14089,10 @@
let groupHtml = `
+
`;
});
html += '`;
groupHtml += visibleItems.map(it => {
const url = `${API}/output/` + encodeURIComponent(it.filename);
- return `
- 
`;
}).join('');
@@ -14468,15 +14551,11 @@
+
-
-
SAM2 merges all non-border masks (preserves hair, glasses, sandals).
rembg (U2Net) is faster and works without SAM2 checkpoint.
@@ -14623,8 +14702,11 @@ } } - const cb = document.getElementById('sbCheckerboard'); - if (cb) cb.checked = on; + const overlayBtn = document.getElementById('overlayCheckerboardBtn'); + if (overlayBtn) { + overlayBtn.style.color = on ? '#10b981' : '#f43f5e'; + overlayBtn.style.background = on ? 'rgba(16,185,129,0.1)' : ''; + } } // ---- set preferred ---- @@ -14846,6 +14928,19 @@ } else if (_designerResults !== null) { html += `
`;
panel.innerHTML = html;
rembg (U2Net) is faster and works without SAM2 checkpoint.
@@ -14623,8 +14702,11 @@ } } - const cb = document.getElementById('sbCheckerboard'); - if (cb) cb.checked = on; + const overlayBtn = document.getElementById('overlayCheckerboardBtn'); + if (overlayBtn) { + overlayBtn.style.color = on ? '#10b981' : '#f43f5e'; + overlayBtn.style.background = on ? 'rgba(16,185,129,0.1)' : ''; + } } // ---- set preferred ---- @@ -14846,6 +14928,19 @@ } else if (_designerResults !== null) { html += `
No valid poses were returned by the AI. Try adjusting guidelines.
`;
}
+
+ // Add a brand-new pose (persisted to poses.md).
+ html += `
+
+
`;
+
html += `