npm - codeplay-common - Versions diffs - 4.4.1 → 4.4.3 - Mend

codeplay-common 4.4.1 → 4.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/.gitattributes +2 -2
package/LICENSE +21 -21
package/README.md +125 -125
package/files/buildCodeplay/codeplayBeforeBuild-6.2.js +4106 -4106
package/files/buildCodeplay/versions.json +23 -23
package/files/finalrelease +51 -51
package/files/generate-ai-promo-video.js +1650 -1650
package/files/iap-install-2.js +145 -145
package/files/ionic.config.json +6 -6
package/files/scripts/setup-baseline-profile.js +262 -262
package/files/take-screen-image.js +149 -23
package/files/take-screen-video.js +644 -644
package/package.json +15 -15
package/scripts/sync-files.js +103 -103
package/scripts/uninstall.js +109 -109

package/files/take-screen-image.js CHANGED Viewed

@@ -5,11 +5,21 @@ const { spawn, spawnSync } = require('node:child_process');
 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 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 amazonAssetDefinitions = [
+  { 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 },
+];
+const samsungAssetDefinitions = [
+  { fileName: 'edge-screen-160x2560.png', type: 'edge-screen', width: 160, height: 2560 },
+  { fileName: 'edge-screen-single-550x2560.png', type: 'edge-screen-single-plus', width: 550, height: 2560 },
+];
 const browserExecutablePaths = [
   'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
   'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
@@ -430,6 +440,8 @@ function printHelp() {
   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');
+  console.log('');
+  console.log('A normal capture automatically creates any missing Amazon and Samsung store assets.');
 }
 function selectProfiles(input) {
@@ -611,6 +623,11 @@ async function capturePageSnapshot(client) {
           clone.setAttribute('data-responsive-scroll-left', String(original.scrollLeft));
         }
+        if (original.classList.contains('swiper-initialized')) {
+          clone.setAttribute('data-responsive-swiper-width', String(original.clientWidth));
+          clone.setAttribute('data-responsive-swiper-height', String(original.clientHeight));
+        }
         if (original instanceof HTMLInputElement) {
           clone.setAttribute('value', original.value);
           clone.toggleAttribute('checked', original.checked);
@@ -698,7 +715,6 @@ async function capturePageSnapshot(client) {
       return {
         html: '<!doctype html>' + clonedRoot.outerHTML,
-        scrollX,
         scrollY,
       };
     })()`,
@@ -853,7 +869,7 @@ async function closeReplayBrowser(browser) {
 }
 async function waitForReplayLayout(client, snapshot) {
-  await client.send('Runtime.evaluate', {
+  const evaluation = await client.send('Runtime.evaluate', {
     expression: `(async () => {
       const assetWait = Promise.all([...document.images].map((image) => {
         if (image.complete) return Promise.resolve();
@@ -868,17 +884,82 @@ async function waitForReplayLayout(client, snapshot) {
         new Promise((resolve) => setTimeout(resolve, 5000)),
       ]);
+      document.querySelectorAll('[data-responsive-swiper-width]').forEach((swiper) => {
+        const wrapper = [...swiper.children].find((element) => (
+          element.classList.contains('swiper-wrapper')
+        ));
+        if (!wrapper) return;
+        const slides = [...wrapper.children].filter((element) => (
+          element.classList.contains('swiper-slide')
+        ));
+        const sourceWidth = Number(swiper.dataset.responsiveSwiperWidth);
+        const sourceHeight = Number(swiper.dataset.responsiveSwiperHeight);
+        const widthScale = sourceWidth > 0 ? swiper.clientWidth / sourceWidth : 1;
+        const heightScale = sourceHeight > 0 ? swiper.clientHeight / sourceHeight : 1;
+        const isVertical = swiper.classList.contains('swiper-vertical');
+        slides.forEach((slide) => {
+          if (!slide.dataset.responsiveSwiperWidth && slide.style.width) {
+            slide.dataset.responsiveSwiperWidth = String(parseFloat(slide.style.width));
+          }
+          if (!slide.dataset.responsiveSwiperHeight && slide.style.height) {
+            slide.dataset.responsiveSwiperHeight = String(parseFloat(slide.style.height));
+          }
+          const slideWidth = Number(slide.dataset.responsiveSwiperWidth);
+          const slideHeight = Number(slide.dataset.responsiveSwiperHeight);
+          if (Number.isFinite(slideWidth) && slideWidth > 0) {
+            slide.style.width = (slideWidth * widthScale) + 'px';
+          }
+          if (isVertical && Number.isFinite(slideHeight) && slideHeight > 0) {
+            slide.style.height = (slideHeight * heightScale) + 'px';
+          }
+        });
+        const activeSlide = slides.find((slide) => (
+          slide.classList.contains('swiper-slide-active')
+        )) || slides[0];
+        if (!activeSlide) return;
+        const offset = isVertical ? activeSlide.offsetTop : activeSlide.offsetLeft;
+        const direction = getComputedStyle(swiper).direction;
+        const horizontalOffset = direction === 'rtl' ? offset : -offset;
+        const verticalOffset = isVertical ? -offset : 0;
+        wrapper.style.transitionDuration = '0ms';
+        wrapper.style.transform = 'translate3d('
+          + (isVertical ? 0 : horizontalOffset) + 'px, '
+          + verticalOffset + 'px, 0px)';
+        if (swiper.classList.contains('swiper-autoheight')) {
+          wrapper.style.height = activeSlide.scrollHeight + 'px';
+        }
+      });
       document.querySelectorAll('[data-responsive-scroll-top]').forEach((element) => {
         element.scrollTop = Number(element.dataset.responsiveScrollTop);
         element.scrollLeft = Number(element.dataset.responsiveScrollLeft);
       });
-      scrollTo(${Number(snapshot.scrollX) || 0}, ${Number(snapshot.scrollY) || 0});
+      scrollTo(0, ${Number(snapshot.scrollY) || 0});
       await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+      return {
+        documentWidth: Math.max(document.documentElement.scrollWidth, document.body.scrollWidth),
+        viewportWidth: innerWidth,
+      };
     })()`,
     awaitPromise: true,
     returnByValue: true,
   });
+  return evaluation.result.value;
 }
 function getFrameAdornment(frameType) {
@@ -1441,7 +1522,7 @@ function createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy) {
 </html>`;
 }
-async function createAmazonAssets(client) {
+async function createAmazonAssets(client, skipExisting = false) {
   if (!fs.existsSync(amazonIconPath)) {
     throw new Error(`Amazon asset source icon was not found: ${amazonIconPath}`);
   }
@@ -1450,16 +1531,15 @@ async function createAmazonAssets(client) {
   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) {
+  for (const asset of amazonAssetDefinitions) {
+    const outputPath = path.join(amazonAssetsDirectory, asset.fileName);
+    if (skipExisting && fs.existsSync(outputPath)) {
+      continue;
+    }
     await client.send('Emulation.setDeviceMetricsOverride', {
       width: asset.width,
       height: asset.height,
@@ -1493,7 +1573,6 @@ async function createAmazonAssets(client) {
       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}`);
   }
@@ -1604,7 +1683,7 @@ function createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy) {
 </html>`;
 }
-async function createSamsungAssets(client) {
+async function createSamsungAssets(client, skipExisting = false) {
   if (!fs.existsSync(amazonIconPath)) {
     throw new Error(`Samsung asset source icon was not found: ${amazonIconPath}`);
   }
@@ -1613,15 +1692,17 @@ async function createSamsungAssets(client) {
   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) {
+  for (const asset of samsungAssetDefinitions) {
+    const outputPath = path.join(samsungAssetsDirectory, asset.fileName);
+    if (skipExisting && fs.existsSync(outputPath)) {
+      continue;
+    }
     await client.send('Emulation.setDeviceMetricsOverride', {
       width: asset.width,
       height: asset.height,
@@ -1650,7 +1731,6 @@ async function createSamsungAssets(client) {
       fromSurface: true,
       captureBeyondViewport: false,
     });
-    const outputPath = path.join(samsungAssetsDirectory, asset.fileName);
     const outputBuffer = Buffer.from(screenshot.data, 'base64');
     if (outputBuffer.length >= maximumFileSize) {
@@ -1667,6 +1747,41 @@ async function createSamsungAssets(client) {
   }
 }
+async function createMissingStoreAssets() {
+  const hasMissingAmazonAssets = amazonAssetDefinitions.some((asset) => (
+    !fs.existsSync(path.join(amazonAssetsDirectory, asset.fileName))
+  ));
+  const hasMissingSamsungAssets = samsungAssetDefinitions.some((asset) => (
+    !fs.existsSync(path.join(samsungAssetsDirectory, asset.fileName))
+  ));
+  if (!hasMissingAmazonAssets && !hasMissingSamsungAssets) {
+    console.log('Amazon and Samsung store assets already exist.');
+    return;
+  }
+  let browser;
+  let client;
+  try {
+    browser = await launchReplayBrowser();
+    client = await createReplayPage(browser);
+    if (hasMissingAmazonAssets) {
+      await createAmazonAssets(client, true);
+    }
+    if (hasMissingSamsungAssets) {
+      await createSamsungAssets(client, true);
+    }
+  } finally {
+    if (client) client.close();
+    if (browser) await closeReplayBrowser(browser);
+  }
+  console.log('Missing Amazon and Samsung store assets created.');
+}
 async function captureFramedScreenshot(
   client,
   screenshotBuffer,
@@ -1750,7 +1865,14 @@ async function captureProfile(client, snapshot, profile, screenshotFileName) {
     frameId: frameTree.frameTree.frame.id,
     html: snapshot.html,
   });
-  await waitForReplayLayout(client, snapshot);
+  const replayLayout = await waitForReplayLayout(client, snapshot);
+  if (replayLayout.documentWidth > replayLayout.viewportWidth + 1) {
+    console.warn(
+      `Warning: ${profile.label} replay is ${replayLayout.documentWidth}px wide `
+      + `inside a ${replayLayout.viewportWidth}px viewport.`,
+    );
+  }
   const screenshot = await client.send('Page.captureScreenshot', {
     format: 'png',
@@ -1961,6 +2083,10 @@ async function main() {
     return;
   }
+  if (!options.dryRun) {
+    await createMissingStoreAssets();
+  }
   const selectedProfiles = selectProfiles(options.profiles);
   if (options.frameExisting) {