Admin UI: collapse PER GROUP (category) with arrow, groups minimized by default; drop per-tool minimize
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Q8t9GEyyLZbUQu26na1JQg
This commit is contained in:
+8
-33
@@ -26,7 +26,7 @@ function updateCards(form){
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Categories (collapsible) + per-tool expand arrow (cards minimized by default) ---- */
|
/* ---- Collapse PER GROUP (category). Each group has an arrow; groups minimized by default. ---- */
|
||||||
var LSKEY='asktamMcpCatCollapsed';
|
var LSKEY='asktamMcpCatCollapsed';
|
||||||
function loadState(){try{return JSON.parse(localStorage.getItem(LSKEY)||'{}')||{};}catch(e){return {};}}
|
function loadState(){try{return JSON.parse(localStorage.getItem(LSKEY)||'{}')||{};}catch(e){return {};}}
|
||||||
function saveState(m){try{localStorage.setItem(LSKEY,JSON.stringify(m));}catch(e){}}
|
function saveState(m){try{localStorage.setItem(LSKEY,JSON.stringify(m));}catch(e){}}
|
||||||
@@ -44,15 +44,8 @@ function initCollapsibleTools(){
|
|||||||
});
|
});
|
||||||
saveState(state);
|
saveState(state);
|
||||||
}
|
}
|
||||||
function setAllCards(min){
|
|
||||||
form.querySelectorAll('.asktam-mcp-tool-card').forEach(function(card){
|
|
||||||
card.classList.toggle('is-min',min);
|
|
||||||
var b=card.querySelector('.asktam-mcp-card-min');
|
|
||||||
if(b){b.textContent=min?'▸':'▾';b.setAttribute('aria-label',min?'Expand tool':'Minimize tool');}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Global controls: category expand/collapse + expand/minimize every tool card
|
// Global controls: expand / collapse every group at once
|
||||||
var bulk=form.querySelector('.asktam-mcp-bulk-actions');
|
var bulk=form.querySelector('.asktam-mcp-bulk-actions');
|
||||||
if(bulk && !bulk.querySelector('.asktam-mcp-collapse-tools')){
|
if(bulk && !bulk.querySelector('.asktam-mcp-collapse-tools')){
|
||||||
var wrap=document.createElement('span');
|
var wrap=document.createElement('span');
|
||||||
@@ -62,9 +55,8 @@ function initCollapsibleTools(){
|
|||||||
wrap.appendChild(exp);wrap.appendChild(col);
|
wrap.appendChild(exp);wrap.appendChild(col);
|
||||||
var save=bulk.querySelector('.asktam-mcp-bulk-save');
|
var save=bulk.querySelector('.asktam-mcp-bulk-save');
|
||||||
if(save)bulk.insertBefore(wrap,save);else bulk.appendChild(wrap);
|
if(save)bulk.insertBefore(wrap,save);else bulk.appendChild(wrap);
|
||||||
// Expand all = open every category AND open every tool card; Collapse all = reverse
|
exp.addEventListener('click',function(){setAll(false);});
|
||||||
exp.addEventListener('click',function(){setAll(false);setAllCards(false);});
|
col.addEventListener('click',function(){setAll(true);});
|
||||||
col.addEventListener('click',function(){setAll(false);setAllCards(true);});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
cats.forEach(function(cat){
|
cats.forEach(function(cat){
|
||||||
@@ -74,14 +66,15 @@ function initCollapsibleTools(){
|
|||||||
var caret=document.createElement('span');
|
var caret=document.createElement('span');
|
||||||
caret.className='asktam-mcp-cat-caret';
|
caret.className='asktam-mcp-cat-caret';
|
||||||
caret.setAttribute('aria-hidden','true');
|
caret.setAttribute('aria-hidden','true');
|
||||||
caret.textContent='▾';
|
caret.textContent='▾'; // ▾ ; rotates to ▸ when the group is collapsed (CSS)
|
||||||
header.insertBefore(caret,header.firstChild);
|
header.insertBefore(caret,header.firstChild);
|
||||||
}
|
}
|
||||||
// Categories default EXPANDED so the full tool list is visible.
|
// Each GROUP minimized (collapsed) by default; click the header to expand it.
|
||||||
var collapsed=(id in state)?!!state[id]:false;
|
var collapsed=(id in state)?!!state[id]:true;
|
||||||
cat.classList.toggle('is-collapsed',collapsed);
|
cat.classList.toggle('is-collapsed',collapsed);
|
||||||
if(header && !header.dataset.collBound){
|
if(header && !header.dataset.collBound){
|
||||||
header.dataset.collBound='1';
|
header.dataset.collBound='1';
|
||||||
|
header.style.cursor='pointer';
|
||||||
header.addEventListener('click',function(e){
|
header.addEventListener('click',function(e){
|
||||||
if(e.target.closest('.asktam-mcp-category-actions'))return; // let All/None work
|
if(e.target.closest('.asktam-mcp-category-actions'))return; // let All/None work
|
||||||
var now=!cat.classList.contains('is-collapsed');
|
var now=!cat.classList.contains('is-collapsed');
|
||||||
@@ -90,24 +83,6 @@ function initCollapsibleTools(){
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Per-tool arrow — each tool MINIMIZED by default (shows just the name). Arrow expands it.
|
|
||||||
form.querySelectorAll('.asktam-mcp-tool-card').forEach(function(card){
|
|
||||||
if(card.querySelector('.asktam-mcp-card-min'))return;
|
|
||||||
card.classList.add('is-min');
|
|
||||||
var b=document.createElement('button');
|
|
||||||
b.type='button';
|
|
||||||
b.className='asktam-mcp-card-min';
|
|
||||||
b.setAttribute('aria-label','Expand tool');
|
|
||||||
b.textContent='▸'; // right-pointing arrow = minimized
|
|
||||||
b.addEventListener('click',function(e){
|
|
||||||
e.preventDefault();e.stopPropagation(); // don't toggle the tool's checkbox
|
|
||||||
var min=card.classList.toggle('is-min');
|
|
||||||
b.textContent=min?'▸':'▾'; // ▸ minimized / ▾ expanded
|
|
||||||
b.setAttribute('aria-label',min?'Expand tool':'Minimize tool');
|
|
||||||
});
|
|
||||||
card.appendChild(b);
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function initFooter(){
|
function initFooter(){
|
||||||
|
|||||||
Reference in New Issue
Block a user