Compare commits

...

2 Commits

2 changed files with 34 additions and 10 deletions

View File

@ -63,6 +63,10 @@ body {
background-color: #0056b3;
}
.PlaceholderItem {
animation: loading 1.5s infinite;
}
.PlaceholderItem > button,
.ParentDirectoryItem > button {
background-color: #4D4F5D;
@ -73,6 +77,15 @@ body {
}
.PlaceholderItem > button {
height: calc(16px + 10px * 2);
width: 6em;
height: calc(18px + 10px * 2);
min-width: 4em;
}
@keyframes loading {
0%, 100% {
filter: brightness(80%);
}
50% {
filter: brightness(100%);
}
}

View File

@ -68,16 +68,18 @@ function Contents(
};
if (item.is_dir) {
itemProps.onClick = () => {
const subCategory = getFileName(itemProps.url);
itemProps.onClick = item.isPlaceholder
? () => {}
: () => {
const subCategory = getFileName(itemProps.url);
if (category !== '') category = `${category}/${subCategory}`;
else category = subCategory;
if (subCategory === '..')
category = category.split('/').slice(0, -2).join('/');
if (category !== '') category = `${category}/${subCategory}`;
else category = subCategory;
if (subCategory === '..')
category = category.split('/').slice(0, -2).join('/');
setCategory(category);
};
setCategory(category);
};
return <DirectoryItem {...itemProps} />;
}
if (itemProps.url.endsWith('.mp4')) {
@ -137,6 +139,14 @@ function getFileName(string: string): string {
}
function getPlaceholderData(): galleryItemInfo[] {
const backDir = (): galleryItemInfo => {
return {
is_dir: true,
url: '..',
thumbnail_url: '',
isPlaceholder: true,
};
};
const placeholderDir = (): galleryItemInfo => {
return {
is_dir: true,
@ -155,6 +165,7 @@ function getPlaceholderData(): galleryItemInfo[] {
};
return [
backDir(),
placeholderDir(),
placeholderDir(),
placeholderImg(),