codeplay-common 4.3.4 → 4.3.6

package/files/{take-responsive-screenshot.js → take-screen-image.js}

@@ -3,9 +3,12 @@ const path = require('node:path');
 const readline = require('node:readline/promises');
 const { spawn, spawnSync } = require('node:child_process');
 
-const screenshotDirectory = path.join(__dirname, 'Auto-Screenshot', 'Responsive');
-const inFrameDirectory = path.join(__dirname, 'Auto-Screenshot', 'In-Frame');
-const capacitorConfigPath = path.join(__dirname, 'capacitor.config.json');
+const screenshotDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Screenshot');
+const inFrameDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Frame');
+const amazonAssetsDirectory = path.join(__dirname, 'Auto-Screenshot', 'Amazon-assets');
+const samsungAssetsDirectory = path.join(__dirname, 'Auto-Screenshot', 'Samsung-assets');
+const capacitorConfigPath = path.join(__dirname, 'capacitor.config.json');
+const amazonIconPath = path.join(__dirname, 'resources', 'icon-only.png');
 const temporaryDirectory = path.join(__dirname, 'agent-temp');
 const browserExecutablePaths = [
   'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
@@ -25,18 +28,34 @@ const deviceProfiles = [
     deviceScaleFactor: 3,
     orientationSensitive: true,
     mobile: true,
-  },
-  {
-    name: 'android-tablet',
-    label: 'Android tablet',
-    outputDirectory: 'Android-Tab',
-    frameType: 'tablet',
-    width: 800,
-    height: 1280,
+  },
+  {
+    name: 'android-tablet-7-inch',
+    aliases: ['android-tablet'],
+    label: 'Android 7-inch Play Store tablet',
+    outputDirectory: 'Android-Tab-7inch',
+    frameType: 'tablet',
+    width: 675,
+    height: 1200,
     deviceScaleFactor: 2,
+    framedWidth: 1350,
+    framedHeight: 2400,
     orientationSensitive: true,
     mobile: true,
-  },
+  },
+  {
+    name: 'android-tablet-10-inch',
+    label: 'Android 10-inch Play Store tablet',
+    outputDirectory: 'Android-Tab-10inch',
+    frameType: 'tablet',
+    width: 900,
+    height: 1600,
+    deviceScaleFactor: 2,
+    framedWidth: 1800,
+    framedHeight: 3200,
+    orientationSensitive: true,
+    mobile: true,
+  },
   {
     name: 'iphone',
     label: 'iPhone 6.9-inch App Store viewport',
@@ -141,16 +160,18 @@ const deviceProfiles = [
     deviceScaleFactor: 1,
     mobile: false,
   },
-  {
-    name: 'chromebook',
-    label: 'Chromebook-sized viewport',
-    outputDirectory: 'Chromebook',
-    frameType: 'laptop',
-    width: 1366,
-    height: 768,
-    deviceScaleFactor: 1,
-    mobile: false,
-  },
+  {
+    name: 'chromebook',
+    label: 'Chromebook 4K Play Store viewport',
+    outputDirectory: 'Chromebook',
+    frameType: 'laptop',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 2,
+    framedWidth: 3840,
+    framedHeight: 2160,
+    mobile: false,
+  },
   {
     name: 'android-xr',
     label: 'Android XR 2D panel approximation',
@@ -339,7 +360,9 @@ function getScreenshotFileName(fileNameInput, selectedProfiles) {
 
 function parseArguments() {
   const args = process.argv.slice(2);
-  const options = {
+  const options = {
+    amazonAssets: false,
+    samsungAssets: false,
     dryRun: false,
     frameExisting: false,
     help: false,
@@ -351,7 +374,11 @@ function parseArguments() {
   for (let index = 0; index < args.length; index += 1) {
     const argument = args[index];
 
-    if (argument === '--dry-run') {
+    if (argument === '--amazon-assets') {
+      options.amazonAssets = true;
+    } else if (argument === '--samsung-assets') {
+      options.samsungAssets = true;
+    } else if (argument === '--dry-run') {
       options.dryRun = true;
     } else if (argument === '--frame-existing') {
       options.frameExisting = true;
@@ -395,12 +422,14 @@ function printHelp() {
   console.log('Capture the current live Android WebView at multiple responsive viewport sizes.');
   console.log('');
   console.log('Usage:');
-  console.log('  node take-responsive-screenshot.js');
-  console.log('  node take-responsive-screenshot.js --profiles iphone,ipad');
-  console.log('  node take-responsive-screenshot.js --prefix home --profiles android-phone,ipad');
-  console.log('  node take-responsive-screenshot.js --frame-existing');
-  console.log('  node take-responsive-screenshot.js --dry-run');
-  console.log('  node take-responsive-screenshot.js --list');
+  console.log('  node take-screen-image.js');
+  console.log('  node take-screen-image.js --profiles iphone,ipad');
+  console.log('  node take-screen-image.js --prefix home --profiles android-phone,ipad');
+  console.log('  node take-screen-image.js --frame-existing');
+  console.log('  node take-screen-image.js --amazon-assets');
+  console.log('  node take-screen-image.js --samsung-assets');
+  console.log('  node take-screen-image.js --dry-run');
+  console.log('  node take-screen-image.js --list');
 }
 
 function selectProfiles(input) {
@@ -415,7 +444,9 @@ function selectProfiles(input) {
   }
 
   const selectedProfiles = names.map((name) => {
-    const profile = deviceProfiles.find((candidate) => candidate.name === name);
+    const profile = deviceProfiles.find((candidate) => (
+      candidate.name === name || candidate.aliases?.includes(name)
+    ));
 
     if (!profile) {
       throw new Error(`Unknown profile: ${name}. Run with --list to see valid profiles.`);
@@ -876,7 +907,7 @@ function getFrameAdornment(frameType) {
   return '<div class="xr-status"></div>';
 }
 
-function createDeviceFrameHtml(profile, screenshotBuffer) {
+function createDeviceFrameHtml(profile, screenshotBuffer) {
   const screenshotDataUrl = `data:image/png;base64,${screenshotBuffer.toString('base64')}`;
   const aspectRatio = `${profile.width} / ${profile.height}`;
 
@@ -1114,9 +1145,522 @@ function createDeviceFrameHtml(profile, screenshotBuffer) {
     ${getFrameAdornment(profile.frameType)}
   </main>
 </body>
-</html>`;
-}
-
+</html>`;
+}
+
+function escapeHtml(value) {
+  return String(value)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+function cleanAssetCopy(value, maximumLength, fallback = '') {
+  const cleaned = String(value || '')
+    .replace(/<script\b[^>]*>[\s\S]*?<\/script>/gi, ' ')
+    .replace(/<style\b[^>]*>[\s\S]*?<\/style>/gi, ' ')
+    .replace(/<[^>]+>/g, ' ')
+    .replace(/&[a-zA-Z#0-9]+;/g, ' ')
+    .replace(/[_|]+/g, ' ')
+    .replace(/\s+/g, ' ')
+    .trim();
+  if (!cleaned) return fallback;
+  if (cleaned.length <= maximumLength) return cleaned;
+  const shortened = cleaned.slice(0, maximumLength + 1);
+  const lastSpace = shortened.lastIndexOf(' ');
+  return shortened.slice(0, lastSpace > maximumLength * 0.55 ? lastSpace : maximumLength).trim();
+}
+
+function readJsonAssetSource(filePath) {
+  try {
+    return JSON.parse(fs.readFileSync(filePath, 'utf8'));
+  } catch {
+    return {};
+  }
+}
+
+function collectProjectUiPhrases() {
+  const phrases = [];
+  const pageDirectory = path.join(__dirname, 'src', 'pages');
+  if (fs.existsSync(pageDirectory)) {
+    const pageFiles = fs.readdirSync(pageDirectory)
+      .filter((fileName) => /\.(?:f7|html)$/i.test(fileName))
+      .sort()
+      .slice(0, 40);
+    const visibleElementPattern = /<(?:h[1-4]|button|label|option|a|li)\b[^>]*>([\s\S]*?)<\/(?:h[1-4]|button|label|option|a|li)>/gi;
+    for (const fileName of pageFiles) {
+      const source = fs.readFileSync(path.join(pageDirectory, fileName), 'utf8');
+      let match;
+      while ((match = visibleElementPattern.exec(source)) && phrases.length < 120) {
+        const phrase = cleanAssetCopy(match[1], 52);
+        if (phrase) phrases.push(phrase);
+      }
+    }
+  }
+  return phrases;
+}
+
+function getStoreAssetCopy(config) {
+  const configuredAppName = cleanAssetCopy(config.appName, 40, 'App');
+  const appUniqueId = String(config.android?.APP_UNIQUE_ID ?? '').trim();
+  const promoCopyPath = appUniqueId
+    ? path.join(
+      __dirname,
+      'Auto-AI-Video',
+      `${appUniqueId}. ${sanitizeName(configuredAppName, 'App')}-promo-copy.json`,
+    )
+    : '';
+  const promoCopy = promoCopyPath && fs.existsSync(promoCopyPath)
+    ? readJsonAssetSource(promoCopyPath).copy || {}
+    : {};
+  const scenes = Array.isArray(promoCopy.scenes) ? promoCopy.scenes : [];
+  const footerKeywords = Array.isArray(promoCopy.footer_keywords)
+    ? promoCopy.footer_keywords
+    : [];
+  const manifestCandidates = [
+    path.join(__dirname, 'src', 'manifest.webmanifest'),
+    path.join(__dirname, 'public', 'manifest.webmanifest'),
+    path.join(__dirname, 'manifest.webmanifest'),
+  ];
+  const manifestPath = manifestCandidates.find((candidate) => fs.existsSync(candidate));
+  const manifest = manifestPath ? readJsonAssetSource(manifestPath) : {};
+  const candidates = [
+    ...footerKeywords,
+    ...scenes.flatMap((scene) => [
+      `${scene.title_line_1 || ''} ${scene.title_line_2 || ''}`,
+      scene.kicker,
+      scene.body,
+    ]),
+    ...(Array.isArray(manifest.categories) ? manifest.categories : []),
+    manifest.description,
+    ...collectProjectUiPhrases(),
+  ];
+  const uniquePhrases = [];
+  const seen = new Set([configuredAppName.toLowerCase()]);
+  for (const candidate of candidates) {
+    const phrase = cleanAssetCopy(candidate, 52);
+    const key = phrase.toLowerCase();
+    if (phrase.length < 3 || seen.has(key)) continue;
+    seen.add(key);
+    uniquePhrases.push(phrase);
+  }
+
+  const featureLabels = uniquePhrases
+    .map((phrase) => cleanAssetCopy(phrase, 18))
+    .filter((phrase, index, values) => (
+      phrase.length >= 3
+      && values.findIndex((value) => value.toLowerCase() === phrase.toLowerCase()) === index
+    ))
+    .slice(0, 9);
+  while (featureLabels.length < 9) {
+    featureLabels.push(`Feature ${String(featureLabels.length + 1).padStart(2, '0')}`);
+  }
+
+  const firstScene = scenes[0] || {};
+  const firstSceneTitle = cleanAssetCopy(
+    `${firstScene.title_line_1 || ''} ${firstScene.title_line_2 || ''}`,
+    34,
+  );
+  const primaryPhrase = footerKeywords[0] || featureLabels[0];
+  return {
+    amazonEyebrow: cleanAssetCopy(primaryPhrase, 32, `Explore ${configuredAppName}`),
+    amazonCallout: cleanAssetCopy(
+      firstScene.body || manifest.description || uniquePhrases[0],
+      52,
+      `Explore ${configuredAppName}`,
+    ),
+    featureLabels,
+    samsungKicker: cleanAssetCopy(firstScene.kicker || primaryPhrase, 28, 'App features'),
+    samsungAction: firstSceneTitle || cleanAssetCopy(primaryPhrase, 34, `Open ${configuredAppName}`),
+    samsungBody: cleanAssetCopy(
+      firstScene.body || manifest.description || uniquePhrases[1],
+      52,
+      'Explore the available features',
+    ),
+  };
+}
+
+function createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy) {
+  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
+  const safeAppName = escapeHtml(appName);
+  const safeEyebrow = escapeHtml(storeCopy.amazonEyebrow);
+  const safeCallout = escapeHtml(storeCopy.amazonCallout);
+  const featureMarkup = storeCopy.featureLabels.slice(0, 6)
+    .map((label) => `<span>${escapeHtml(label)}</span>`)
+    .join('');
+  const logoMarkup = asset.type === 'featured-logo'
+    ? `<main class="featured-logo"><img src="${iconDataUrl}" /><div><small>${safeEyebrow}</small><strong>${safeAppName}</strong></div></main>`
+    : '';
+  const iconMarkup = asset.type === 'icon'
+    ? `<main class="icon-card"><img src="${iconDataUrl}" /><div><small>${safeCallout}</small><strong>${safeAppName}</strong></div></main>`
+    : '';
+  const backgroundMarkup = asset.type.includes('background')
+    ? `<main class="background-art"><div class="pulse pulse-one"></div><div class="pulse pulse-two"></div><div class="feature-grid">${featureMarkup}</div></main>`
+    : '';
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      position: relative;
+      font-family: Arial, Helvetica, sans-serif;
+      color: #f8fbff;
+      background: transparent;
+    }
+    body.icon,
+    body.background-image,
+    body.featured-background {
+      background:
+        radial-gradient(circle at 16% 18%, rgba(52, 211, 235, 0.32), transparent 28%),
+        radial-gradient(circle at 82% 82%, rgba(201, 255, 65, 0.24), transparent 30%),
+        linear-gradient(135deg, #24113c 0%, #15152d 48%, #071725 100%);
+    }
+    body.icon::before,
+    body.background-image::before,
+    body.featured-background::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      opacity: 0.22;
+      background-image:
+        linear-gradient(rgba(255,255,255,0.07) 1px, transparent 1px),
+        linear-gradient(90deg, rgba(255,255,255,0.07) 1px, transparent 1px);
+      background-size: 72px 72px;
+    }
+    .icon-card {
+      position: relative;
+      z-index: 2;
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 72px;
+      padding: 72px 110px;
+    }
+    .icon-card img {
+      width: 500px;
+      height: 500px;
+      object-fit: contain;
+      border-radius: 104px;
+      box-shadow: 0 38px 80px rgba(0,0,0,0.48), 0 0 70px rgba(52,211,235,0.2);
+    }
+    .icon-card div { display: flex; flex-direction: column; gap: 18px; }
+    .icon-card small,
+    .featured-logo small {
+      color: #35d4eb;
+      font-size: 24px;
+      font-weight: 700;
+      letter-spacing: 7px;
+    }
+    .icon-card strong { font-size: 86px; line-height: 0.96; max-width: 500px; }
+    .featured-logo {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      gap: 24px;
+      padding: 20px 26px;
+      color: #111827;
+    }
+    .featured-logo img {
+      width: 210px;
+      height: 210px;
+      object-fit: contain;
+      border-radius: 44px;
+    }
+    .featured-logo div { display: flex; min-width: 0; flex-direction: column; gap: 8px; }
+    .featured-logo small { font-size: 14px; letter-spacing: 3px; }
+    .featured-logo strong {
+      max-width: 360px;
+      overflow: hidden;
+      color: #ffffff;
+      font-size: 56px;
+      line-height: 1;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      text-shadow: 0 3px 12px rgba(0,0,0,0.75);
+    }
+    .background-art { position: absolute; inset: 0; }
+    .pulse {
+      position: absolute;
+      border: 3px solid rgba(53,212,235,0.28);
+      border-radius: 50%;
+      box-shadow: 0 0 80px rgba(53,212,235,0.15);
+    }
+    .pulse-one { width: 520px; height: 520px; top: -180px; left: -110px; }
+    .pulse-two { width: 620px; height: 620px; right: -180px; bottom: -310px; border-color: rgba(201,255,65,0.22); }
+    .feature-grid {
+      position: absolute;
+      left: 8%;
+      right: 8%;
+      top: 50%;
+      display: grid;
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+      gap: 24px;
+      transform: translateY(-50%);
+    }
+    .feature-grid span {
+      display: flex;
+      min-height: 108px;
+      align-items: center;
+      justify-content: center;
+      padding: 20px;
+      color: #f8fbff;
+      border: 2px solid rgba(255,255,255,0.17);
+      border-radius: 22px;
+      background: linear-gradient(145deg, rgba(42,55,75,0.96), rgba(11,18,29,0.96));
+      box-shadow: 0 20px 28px rgba(0,0,0,0.28);
+      font-size: clamp(20px, 2vw, 34px);
+      font-weight: 700;
+      text-align: center;
+    }
+    .feature-grid span:nth-child(3n+1) { border-top: 7px solid #35d4eb; }
+    .feature-grid span:nth-child(3n+2) { border-top: 7px solid #ff9f43; }
+    .feature-grid span:nth-child(3n) { border-top: 7px solid #c9ff41; }
+    body.featured-background .feature-grid { left: 5%; right: 5%; gap: 18px; }
+  </style>
+</head>
+<body class="${asset.type}">
+  ${iconMarkup}
+  ${logoMarkup}
+  ${backgroundMarkup}
+</body>
+</html>`;
+}
+
+async function createAmazonAssets(client) {
+  if (!fs.existsSync(amazonIconPath)) {
+    throw new Error(`Amazon asset source icon was not found: ${amazonIconPath}`);
+  }
+
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  const appName = config.appName || 'App';
+  const storeCopy = getStoreAssetCopy(config);
+  const iconBuffer = fs.readFileSync(amazonIconPath);
+  const assets = [
+    { fileName: 'icon-1280x720.png', type: 'icon', width: 1280, height: 720 },
+    { fileName: 'background-image-1920x1080.png', type: 'background-image', width: 1920, height: 1080 },
+    { fileName: 'featured-content-logo-640x260.png', type: 'featured-logo', width: 640, height: 260, transparent: true },
+    { fileName: 'featured-content-background-1920x720.png', type: 'featured-background', width: 1920, height: 720 },
+  ];
+
+  fs.mkdirSync(amazonAssetsDirectory, { recursive: true });
+
+  for (const asset of assets) {
+    await client.send('Emulation.setDeviceMetricsOverride', {
+      width: asset.width,
+      height: asset.height,
+      deviceScaleFactor: 1,
+      mobile: false,
+      screenWidth: asset.width,
+      screenHeight: asset.height,
+      positionX: 0,
+      positionY: 0,
+    });
+
+    const frameTree = await client.send('Page.getFrameTree');
+    await client.send('Page.setDocumentContent', {
+      frameId: frameTree.frameTree.frame.id,
+      html: createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy),
+    });
+    await client.send('Runtime.evaluate', {
+      expression: `Promise.all([...document.images].map((image) => image.complete
+        ? Promise.resolve()
+        : new Promise((resolve) => {
+          image.addEventListener('load', resolve, { once: true });
+          image.addEventListener('error', resolve, { once: true });
+        }))).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
+      awaitPromise: true,
+      returnByValue: true,
+    });
+
+    const screenshot = await client.send('Page.captureScreenshot', {
+      format: 'png',
+      fromSurface: true,
+      captureBeyondViewport: false,
+      omitBackground: Boolean(asset.transparent),
+    });
+    const outputPath = path.join(amazonAssetsDirectory, asset.fileName);
+    fs.writeFileSync(outputPath, Buffer.from(screenshot.data, 'base64'));
+    console.log(`Saved Amazon asset ${asset.width}x${asset.height}: ${outputPath}`);
+  }
+}
+
+function createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy) {
+  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
+  const safeAppName = escapeHtml(appName);
+  const featureButtons = storeCopy.featureLabels.map((label, index) => (
+    `<button><i>0${index + 1}</i><span>${escapeHtml(label.toUpperCase())}</span></button>`
+  )).join('');
+  const safeKicker = escapeHtml(storeCopy.samsungKicker.toUpperCase());
+  const safeAction = escapeHtml(storeCopy.samsungAction.toUpperCase());
+  const safeBody = escapeHtml(storeCopy.samsungBody);
+  const content = asset.type === 'edge-screen'
+    ? `<main class="edge-panel"><header><img src="${iconDataUrl}" /><strong>${safeAppName}</strong></header><section>${featureButtons}</section></main>`
+    : `<main class="single-panel"><header><img src="${iconDataUrl}" /><div><small>${safeKicker}</small><strong>${safeAppName}</strong></div></header><div class="single-action"><span>+</span><strong>${safeAction}</strong><small>${safeBody}</small></div><div class="accent-bars"><i></i><i></i><i></i><i></i><i></i></div></main>`;
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      position: relative;
+      color: #f7fbff;
+      background:
+        radial-gradient(circle at 50% 8%, rgba(53,212,235,0.26), transparent 24%),
+        radial-gradient(circle at 50% 88%, rgba(201,255,65,0.16), transparent 25%),
+        linear-gradient(180deg, #231039, #111729 48%, #071522);
+      font-family: Arial, Helvetica, sans-serif;
+    }
+    body::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      opacity: 0.18;
+      background: repeating-linear-gradient(0deg, transparent 0 79px, rgba(255,255,255,0.08) 80px);
+    }
+    main { position: relative; z-index: 1; width: 100%; height: 100%; }
+    .edge-panel { display: flex; flex-direction: column; padding: 28px 12px; }
+    .edge-panel header { display: flex; flex-direction: column; align-items: center; gap: 12px; min-height: 230px; }
+    .edge-panel header img { width: 112px; height: 112px; border-radius: 25px; object-fit: contain; }
+    .edge-panel header strong { max-width: 136px; overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
+    .edge-panel section { display: grid; flex: 1; grid-template-rows: repeat(9, 1fr); gap: 13px; }
+    .edge-panel button {
+      display: flex;
+      width: 100%;
+      min-height: 0;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      color: #f7fbff;
+      border: 1px solid rgba(255,255,255,0.16);
+      border-top: 5px solid #35d4eb;
+      border-radius: 18px;
+      background: linear-gradient(145deg, rgba(41,55,76,0.98), rgba(10,17,29,0.98));
+      box-shadow: 0 10px 18px rgba(0,0,0,0.3);
+    }
+    .edge-panel button:nth-child(3n+2) { border-top-color: #ff9f43; }
+    .edge-panel button:nth-child(3n) { border-top-color: #c9ff41; }
+    .edge-panel button i { color: #35d4eb; font-size: 14px; font-style: normal; font-weight: 700; }
+    .edge-panel button span { font-size: 12px; font-weight: 700; letter-spacing: 1px; }
+    .single-panel { display: flex; flex-direction: column; align-items: center; padding: 100px 44px; }
+    .single-panel header { display: flex; width: 100%; align-items: center; gap: 24px; }
+    .single-panel header img { width: 160px; height: 160px; border-radius: 36px; object-fit: contain; }
+    .single-panel header div { display: flex; min-width: 0; flex-direction: column; gap: 9px; }
+    .single-panel header small { color: #35d4eb; font-size: 17px; font-weight: 700; letter-spacing: 3px; }
+    .single-panel header strong { overflow: hidden; font-size: 48px; text-overflow: ellipsis; white-space: nowrap; }
+    .single-action {
+      display: flex;
+      width: 100%;
+      height: 880px;
+      margin-top: 380px;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      border: 3px solid rgba(53,212,235,0.5);
+      border-radius: 90px;
+      background: linear-gradient(145deg, rgba(39,53,75,0.96), rgba(8,16,28,0.98));
+      box-shadow: 0 50px 90px rgba(0,0,0,0.42), 0 0 75px rgba(53,212,235,0.16);
+    }
+    .single-action span {
+      display: grid;
+      width: 260px;
+      height: 260px;
+      place-items: center;
+      color: #0d1721;
+      border-radius: 50%;
+      background: linear-gradient(145deg, #35d4eb, #c9ff41);
+      box-shadow: 0 25px 55px rgba(53,212,235,0.3);
+      font-size: 170px;
+      font-weight: 200;
+      line-height: 1;
+    }
+    .single-action strong { margin-top: 65px; font-size: 42px; letter-spacing: 5px; }
+    .single-action small { margin-top: 18px; color: #a9b7c9; font-size: 24px; }
+    .accent-bars { display: flex; align-items: center; gap: 18px; height: 300px; margin-top: auto; }
+    .accent-bars i { width: 14px; height: 70px; border-radius: 999px; background: #35d4eb; }
+    .accent-bars i:nth-child(2), .accent-bars i:nth-child(4) { height: 140px; background: #ff5964; }
+    .accent-bars i:nth-child(3) { height: 210px; background: #c9ff41; }
+  </style>
+</head>
+<body>${content}</body>
+</html>`;
+}
+
+async function createSamsungAssets(client) {
+  if (!fs.existsSync(amazonIconPath)) {
+    throw new Error(`Samsung asset source icon was not found: ${amazonIconPath}`);
+  }
+
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  const appName = config.appName || 'App';
+  const storeCopy = getStoreAssetCopy(config);
+  const iconBuffer = fs.readFileSync(amazonIconPath);
+  const assets = [
+    { fileName: 'edge-screen-160x2560.png', type: 'edge-screen', width: 160, height: 2560 },
+    { fileName: 'edge-screen-single-plus-550x2560.png', type: 'edge-screen-single-plus', width: 550, height: 2560 },
+  ];
+  const maximumFileSize = 1024 * 1024;
+
+  fs.mkdirSync(samsungAssetsDirectory, { recursive: true });
+
+  for (const asset of assets) {
+    await client.send('Emulation.setDeviceMetricsOverride', {
+      width: asset.width,
+      height: asset.height,
+      deviceScaleFactor: 1,
+      mobile: false,
+      screenWidth: asset.width,
+      screenHeight: asset.height,
+      positionX: 0,
+      positionY: 0,
+    });
+    const frameTree = await client.send('Page.getFrameTree');
+    await client.send('Page.setDocumentContent', {
+      frameId: frameTree.frameTree.frame.id,
+      html: createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy),
+    });
+    await client.send('Runtime.evaluate', {
+      expression: `Promise.all([...document.images].map((image) => image.complete
+        ? Promise.resolve()
+        : new Promise((resolve) => image.addEventListener('load', resolve, { once: true }))))
+        .then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
+      awaitPromise: true,
+      returnByValue: true,
+    });
+    const screenshot = await client.send('Page.captureScreenshot', {
+      format: 'png',
+      fromSurface: true,
+      captureBeyondViewport: false,
+    });
+    const outputPath = path.join(samsungAssetsDirectory, asset.fileName);
+    const outputBuffer = Buffer.from(screenshot.data, 'base64');
+
+    if (outputBuffer.length >= maximumFileSize) {
+      throw new Error(
+        `Samsung asset exceeds 1024 KB (${Math.ceil(outputBuffer.length / 1024)} KB): ${asset.fileName}`,
+      );
+    }
+
+    fs.writeFileSync(outputPath, outputBuffer);
+    console.log(
+      `Saved Samsung asset ${asset.width}x${asset.height} `
+      + `(${Math.ceil(outputBuffer.length / 1024)} KB): ${outputPath}`,
+    );
+  }
+}
+
 async function captureFramedScreenshot(
   client,
   screenshotBuffer,
@@ -1332,8 +1876,13 @@ async function runInteractiveCaptureLoop(
   console.log('\nResponsive screenshot tool closed.');
 }
 
-async function getInteractiveOptions(options) {
-  if (!process.stdin.isTTY || options.dryRun) {
+async function getInteractiveOptions(options) {
+  if (
+    !process.stdin.isTTY
+    || options.dryRun
+    || options.amazonAssets
+    || options.samsungAssets
+  ) {
     return options;
   }
 
@@ -1370,9 +1919,43 @@ async function main() {
     return;
   }
 
-  options = await getInteractiveOptions(options);
-
-  const selectedProfiles = selectProfiles(options.profiles);
+  options = await getInteractiveOptions(options);
+
+  if (options.amazonAssets) {
+    let amazonBrowser;
+    let amazonClient;
+
+    try {
+      amazonBrowser = await launchReplayBrowser();
+      amazonClient = await createReplayPage(amazonBrowser);
+      await createAmazonAssets(amazonClient);
+    } finally {
+      if (amazonClient) amazonClient.close();
+      if (amazonBrowser) await closeReplayBrowser(amazonBrowser);
+    }
+
+    console.log(`Amazon asset creation completed: ${amazonAssetsDirectory}`);
+    return;
+  }
+
+  if (options.samsungAssets) {
+    let samsungBrowser;
+    let samsungClient;
+
+    try {
+      samsungBrowser = await launchReplayBrowser();
+      samsungClient = await createReplayPage(samsungBrowser);
+      await createSamsungAssets(samsungClient);
+    } finally {
+      if (samsungClient) samsungClient.close();
+      if (samsungBrowser) await closeReplayBrowser(samsungBrowser);
+    }
+
+    console.log(`Samsung asset creation completed: ${samsungAssetsDirectory}`);
+    return;
+  }
+
+  const selectedProfiles = selectProfiles(options.profiles);
 
   if (options.frameExisting) {
     await frameExistingScreenshots(selectedProfiles);