diff --git a/app/js/sidebar_node.js b/app/js/sidebar_node.js index 3e1c01a..aa5eed4 100644 --- a/app/js/sidebar_node.js +++ b/app/js/sidebar_node.js @@ -94,7 +94,7 @@ function postPinned() { let sidebar_width = parseInt(getVar("sidebarWidth")) || 500; previewDiv.style.top = `${previewDivTop}px`; const previewDivLeft = sidebar_width - sidebad_view_width + correction_offset; - + if (sbPosition == "left") { previewDiv.style.left = `${previewDivLeft}px`; } else { @@ -440,34 +440,34 @@ async function createCategoryList() { function buildTree(categories, useSubcategories = true) { const tree = {}; - + for (const category in categories) { const parts = useSubcategories ? category.split('/').filter(part => part !== '') : [category]; - + let current = tree; if (parts.length > 0 || !useSubcategories) { - - + + for (const part of parts) { if (!current[part]) { current[part] = {}; } current = current[part]; } - + if (!current.items) { current.items = []; } - + categories[category].forEach(displayName => { current.items.push(displayName); }); } } - + return tree; } - + function createHtmlFromTree(tree, parentElement,pinnedItems) { for (const key in tree) { if (key !== 'items') { @@ -475,21 +475,21 @@ async function createCategoryList() { subfolderLi.textContent = "🗀 " + key; subfolderLi.classList.add('sidebarCategory'); subfolderLi.dataset.nameworkflow = key; - + const subfolderUl = document.createElement('ul'); subfolderUl.style.display = "none"; subfolderUl.classList.add('subfolder'); subfolderUl.dataset.subfolder = key; subfolderUl.id = key + "_ul"; subfolderUl.classList.add("displayNamesList"); - + subfolderLi.appendChild(subfolderUl); parentElement.appendChild(subfolderLi); - + createHtmlFromTree(tree[key], subfolderUl,pinnedItems); } } - + if (tree.items) { tree.items.forEach(displayName => { try { @@ -498,53 +498,51 @@ async function createCategoryList() { displayNameMain.classList.add('displayName'); displayNameMain.title = displayName.title; displayNameMain.id = displayName.type; - displayNameMain.textContent = displayName.title; - - - const displayNameItem = document.createElement('li'); displayNameItem.classList.add('sidebarItem'); //displayNameItem.innerHTML = "
"+displayName.title+"
"; displayNameItem.title = displayName.title; displayNameItem.draggable = true; displayNameItem.appendChild(displayNameMain); - + + let color; + const nodeData = displayName?.nodeData; + // USE NODE'S DEFAULT COLOR, IF ANY + if (color === undefined && nodeData !== undefined) { + color = nodeData.color; + } // JOVIMETRIX CUT-OUT FOR CUSTOM COLORED NODES if (CUSTOM_COLORS) { - let color = CUSTOM_COLORS[displayName.title]; - const nodeData = displayName?.nodeData; - if (color === undefined) { - if (nodeData !== undefined) { - let k = nodeData.category; - while (k) { - color = CUSTOM_COLORS[k]; - if (color) { - color = color.title; - break; - } - const last = k.lastIndexOf('/'); - k = last !== -1 ? k.substring(0, last) : ''; + color = CUSTOM_COLORS[displayName.title]; + if (color === undefined && nodeData !== undefined) { + let k = nodeData.category; + while (k) { + color = CUSTOM_COLORS[k]; + if (color) { + color = color.title; + break; } + const last = k.lastIndexOf('/'); + k = last !== -1 ? k.substring(0, last) : ''; } - } else { - color = color.title; - } - if (color) { - displayNameItem.style = `background: ${color}`; } } + // APPLY THE COLOR, IF ANY + if (color) { + displayNameItem.style = `background: ${color}`; + } // - + displayNameItem.id = displayName.type; - + /* Create Pin Button */ - + const pinButton = document.createElement('button'); pinButton.classList.add('pinButton'); - + let add_class = ""; - + if (pinnedItems.includes(displayName.type)) { add_class = "pinned"; } @@ -552,10 +550,10 @@ async function createCategoryList() { `; - + displayNameItem.appendChild(pinButton); /* End Pin Button */ - + parentElement.appendChild(displayNameItem); } catch (err) { console.log(err); @@ -563,20 +561,20 @@ async function createCategoryList() { }); } } - - + + async function renderList() { return new Promise(async (resolve, reject) => { const pinnedItems = await loadPinnedItems(); // const sidebarCustomNodes = document.getElementById("sidebarCustomNodes"); - + let tree_view = await getConfiguration("sb_tree_view") || "multi"; if (tree_view=="multi" ) { tree_view = true; - } else{ + } else{ tree_view = false; } const tree = buildTree(categories,tree_view); @@ -819,7 +817,7 @@ async function addSidebar() { }); - + function handleDrop(event) { event.preventDefault(); @@ -897,17 +895,17 @@ function toggleSHSB(force = undefined) { searchCategoryIcon.classList.add('closed'); search_bar.classList.add('closed'); scrollToTopButton.classList.add('closed'); - + } else { side_bar.classList.remove('closed'); clearIcon.classList.remove('closed'); searchCategoryIcon.classList.remove('closed'); search_bar.classList.remove('closed'); scrollToTopButton.classList.remove('closed'); - setVar("sb_minimized", "true"); + setVar("sb_minimized", "true"); } } else { - + if (side_bar.classList.contains('closed')) { side_bar.classList.remove('closed'); clearIcon.classList.remove('closed'); @@ -934,8 +932,8 @@ function toggleSHSB(force = undefined) { }); - - + + if (getVar("sb_minimized") == "false") { if (force == undefined) { @@ -949,7 +947,7 @@ function toggleSHSB(force = undefined) { main_sidebar.style.width = getVar("sidebarWidth") || '300px'; } else if (force == true) { - main_sidebar.style.width = '45px'; + main_sidebar.style.width = '45px'; } else { main_sidebar.style.width = getVar("sidebarWidth") || '300px'; @@ -958,7 +956,7 @@ function toggleSHSB(force = undefined) { } - + } @@ -1035,7 +1033,7 @@ function processViews(viewsData, settingsData) { div_panel_title.id = "panel_title_" + panel; div_panel_title.innerHTML = view.id.replace("_", " "); - + @@ -1089,11 +1087,11 @@ function processViews(viewsData, settingsData) { switchTab(getVar('sb_current_tab')); const sidebar_view = document.getElementById('sidebar_views'); const sidebar = document.getElementById('sidebar'); - - - + + + sidebar_view.addEventListener('mouseover', function () { - + if (getVar('sb_auto_hide') == "true") { if (getVar('sb_minimized') == "true") { toggleSHSB(false);