+ ${filteredImages.map(img => {
+ // 计算适当的展示高度：
+ // 1. 保持原始宽高比
+ // 2. 限制最大高度为视窗高度的60%
+ // 3. 确保最小高度为容器宽度的40%
+ const aspectRatio = (img.height / img.width) * 100;
+ const containerWidth = 800; // modal content的最大宽度
+ const minHeightPercent = 40; // 最小高度为容器宽度的40%
+ const maxHeightPercent = (window.innerHeight * 0.6 / containerWidth) * 100;
+ const heightPercent = Math.max(
+ minHeightPercent,
+ Math.min(maxHeightPercent, aspectRatio)
+ );
+
+ // Check if image should be blurred
+ const nsfwLevel = img.nsfwLevel !== undefined ? img.nsfwLevel : 0;
+ const shouldBlur = state.settings.blurMatureContent && nsfwLevel > NSFW_LEVELS.PG13;
+
+ // Determine NSFW warning text based on level
+ let nsfwText = "Mature Content";
+ if (nsfwLevel >= NSFW_LEVELS.XXX) {
+ nsfwText = "XXX-rated Content";
+ } else if (nsfwLevel >= NSFW_LEVELS.X) {
+ nsfwText = "X-rated Content";
+ } else if (nsfwLevel >= NSFW_LEVELS.R) {
+ nsfwText = "R-rated Content";
+ }
+
+ // Extract metadata from the image
+ const meta = img.meta || {};
+ const prompt = meta.prompt || '';
+ const negativePrompt = meta.negative_prompt || meta.negativePrompt || '';
+ const size = meta.Size || `${img.width}x${img.height}`;
+ const seed = meta.seed || '';
+ const model = meta.Model || '';
+ const steps = meta.steps || '';
+ const sampler = meta.sampler || '';
+ const cfgScale = meta.cfgScale || '';
+ const clipSkip = meta.clipSkip || '';
+
+ // Check if we have any meaningful generation parameters
+ const hasParams = seed || model || steps || sampler || cfgScale || clipSkip;
+ const hasPrompts = prompt || negativePrompt;
+
+ // If no metadata available, show a message
+ if (!hasParams && !hasPrompts) {
+ const metadataPanel = `
+
+ `;
+
+ if (img.type === 'video') {
+ return generateVideoWrapper(img, heightPercent, shouldBlur, nsfwText, metadataPanel);
+ }
+ return generateImageWrapper(img, heightPercent, shouldBlur, nsfwText, metadataPanel);
+ }
+
+ // Create a data attribute with the prompt for copying instead of trying to handle it in the onclick
+ // This avoids issues with quotes and special characters
+ const promptIndex = Math.random().toString(36).substring(2, 15);
+ const negPromptIndex = Math.random().toString(36).substring(2, 15);
+
+ // Create parameter tags HTML
+ const paramTags = `
+
+ `;
+
+ // Metadata panel HTML
+ const metadataPanel = `
+
+ `;
+
+ if (img.type === 'video') {
+ return generateVideoWrapper(img, heightPercent, shouldBlur, nsfwText, metadataPanel);
+ }
+ return generateImageWrapper(img, heightPercent, shouldBlur, nsfwText, metadataPanel);
+ }).join('')}
+