This commit is contained in:
Kerwin Bryant 2025-03-04 08:59:50 +00:00
parent 605c5d4a07
commit 3cbcd95e6a

View File

@ -5,7 +5,7 @@ import {registerGlobalInitFunc} from '../modules/observer.ts';
import ViewFileTree from '../components/ViewFileTree.vue'; import ViewFileTree from '../components/ViewFileTree.vue';
async function toggleSidebar(sidebarEl: HTMLElement, visibility: boolean) { async function toggleSidebar(sidebarEl: HTMLElement, visibility: boolean) {
const showBtnEl = document.querySelector('.show-tree-sidebar-button'); const showBtnEl = sidebarEl.parentElement.querySelector('.show-tree-sidebar-button');
const containerClassList = sidebarEl.parentElement.classList; const containerClassList = sidebarEl.parentElement.classList;
containerClassList.toggle('repo-grid-tree-sidebar', visibility); containerClassList.toggle('repo-grid-tree-sidebar', visibility);
containerClassList.toggle('repo-grid-filelist-only', !visibility); containerClassList.toggle('repo-grid-filelist-only', !visibility);
@ -22,28 +22,30 @@ async function toggleSidebar(sidebarEl: HTMLElement, visibility: boolean) {
}); });
} }
async function loadChildren(path: string, recursive?: boolean) { function childrenLoader(sidebarEl: HTMLElement) {
const fileTree = document.querySelector('#view-file-tree'); return async (path: string, recursive?: boolean) => {
const apiBaseUrl = fileTree.getAttribute('data-api-base-url'); const fileTree = sidebarEl.querySelector('#view-file-tree');
const refTypeNameSubURL = fileTree.getAttribute('data-current-ref-type-name-sub-url'); const apiBaseUrl = fileTree.getAttribute('data-api-base-url');
const response = await GET(`${apiBaseUrl}/tree/${refTypeNameSubURL}/${encodeURIComponent(path ?? '')}?recursive=${recursive ?? false}`); const refTypeNameSubURL = fileTree.getAttribute('data-current-ref-type-name-sub-url');
const json = await response.json(); const response = await GET(`${apiBaseUrl}/tree/${refTypeNameSubURL}/${encodeURIComponent(path ?? '')}?recursive=${recursive ?? false}`);
if (json instanceof Array) { const json = await response.json();
return json.map((i) => ({ if (json instanceof Array) {
name: i.name, return json.map((i) => ({
type: i.type, name: i.name,
path: i.path, type: i.type,
sub_module_url: i.sub_module_url, path: i.path,
children: i.children, sub_module_url: i.sub_module_url,
})); children: i.children,
} }));
return null; }
return null;
};
} }
async function loadContent(sidebarEl: HTMLElement) { async function loadContent(sidebarEl: HTMLElement) {
// load content by path (content based on home_content.tmpl) // load content by path (content based on home_content.tmpl)
const response = await GET(`${window.location.href}?only_content=true`); const response = await GET(`${window.location.href}?only_content=true`);
const contentEl = document.querySelector('.repo-home-filelist'); const contentEl = sidebarEl.parentElement.querySelector('.repo-home-filelist');
contentEl.innerHTML = await response.text(); contentEl.innerHTML = await response.text();
reloadContentScript(sidebarEl, contentEl); reloadContentScript(sidebarEl, contentEl);
} }
@ -56,14 +58,14 @@ function reloadContentScript(sidebarEl: HTMLElement, contentEl: Element) {
export function initViewFileTreeSidebar() { export function initViewFileTreeSidebar() {
registerGlobalInitFunc('initViewFileTreeSidebar', async (el: HTMLElement) => { registerGlobalInitFunc('initViewFileTreeSidebar', async (el: HTMLElement) => {
document.querySelector('.hide-tree-sidebar-button').addEventListener('click', () => { el.querySelector('.hide-tree-sidebar-button').addEventListener('click', () => {
toggleSidebar(el, false); toggleSidebar(el, false);
}); });
document.querySelector('.repo-home-filelist .show-tree-sidebar-button').addEventListener('click', () => { el.parentElement.querySelector('.repo-home-filelist .show-tree-sidebar-button').addEventListener('click', () => {
toggleSidebar(el, true); toggleSidebar(el, true);
}); });
const fileTree = document.querySelector('#view-file-tree'); const fileTree = el.querySelector('#view-file-tree');
const baseUrl = fileTree.getAttribute('data-api-base-url'); const baseUrl = fileTree.getAttribute('data-api-base-url');
const treePath = fileTree.getAttribute('data-tree-path'); const treePath = fileTree.getAttribute('data-tree-path');
const refType = fileTree.getAttribute('data-current-ref-type'); const refType = fileTree.getAttribute('data-current-ref-type');
@ -72,10 +74,10 @@ export function initViewFileTreeSidebar() {
const selectedItem = ref(getSelectedPath(refString)); const selectedItem = ref(getSelectedPath(refString));
const files = await loadChildren(treePath, true); const files = await childrenLoader(el)(treePath, true);
fileTree.classList.remove('is-loading'); fileTree.classList.remove('is-loading');
const fileTreeView = createApp(ViewFileTree, {files, selectedItem, loadChildren, loadContent: (path: string) => { const fileTreeView = createApp(ViewFileTree, {files, selectedItem, loadChildren: childrenLoader(el), loadContent: (path: string) => {
selectedItem.value = getSelectedPath(refString, `${baseUrl}/src${refString}/${path}`); selectedItem.value = getSelectedPath(refString, `${baseUrl}/src${refString}/${path}`);
window.history.pushState(null, null, `${baseUrl}/src${refString}/${encodeURIComponent(path)}`); window.history.pushState(null, null, `${baseUrl}/src${refString}/${encodeURIComponent(path)}`);
loadContent(el); loadContent(el);