From 23e808b24ce6c773f2c4a84896cd91f29d641050 Mon Sep 17 00:00:00 2001 From: Tom Norris Date: Thu, 31 Aug 2023 23:07:08 -0700 Subject: [PATCH] Galery view looks pretty good again, though it still doesn't auto resize... --- src/block.ts | 10 ++++++---- src/svelte/ImageGrid.svelte | 20 +++++++++++++++----- src/utils.ts | 27 ++++++++++++++++++++++++++- src/view.ts | 14 +++++++++++--- 4 files changed, 58 insertions(+), 13 deletions(-) diff --git a/src/block.ts b/src/block.ts index 1ed4224..4f25e0a 100644 --- a/src/block.ts +++ b/src/block.ts @@ -4,10 +4,10 @@ import { extractColors } from '../node_modules/extract-colors' import type { GalleryBlockArgs, InfoBlockArgs } from './utils' import { - EXTENSIONS, GALLERY_DISPLAY_USAGE, GALLERY_INFO_USAGE, EXTRACT_COLORS_OPTIONS, OB_GALLERY_INFO, + EXTENSIONS, GALLERY_DISPLAY_USAGE, EXTRACT_COLORS_OPTIONS, OB_GALLERY_INFO, VIDEO_REGEX, getImageResources, - getImgInfo, updateFocus + getImgInfo, updateFocus, splitcolumns } from './utils' import { GalleryInfoView } from './view' import type GalleryPlugin from './main' @@ -66,10 +66,12 @@ export class GalleryProcessor if (args.type === 'grid') { + const [columns, columnWidth] = splitcolumns(imgList, elCanvas, args.imgWidth) + new ImageGrid({ props: { - imageList: imgList, - maxColumnWidth: args.imgWidth + columns: columns, + maxColumnWidth: columnWidth }, target: elCanvas }) diff --git a/src/svelte/ImageGrid.svelte b/src/svelte/ImageGrid.svelte index 7b886b6..4cb474d 100644 --- a/src/svelte/ImageGrid.svelte +++ b/src/svelte/ImageGrid.svelte @@ -1,19 +1,29 @@ - - - {#each imageList as img} +{#each columns as images} +
+ {#each images as img} {#if img.includes(".mp4")} - + {:else} {/if} {/each} +
+{/each}