polotno-node 2.9.39 → 2.10.1

package/dist/index.html

@@ -8,7 +8,7 @@
       }
     </style>
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <script type="module" crossorigin src="./assets/index-BWNdW2kw.js"></script>
+    <script type="module" crossorigin src="./assets/index-D56TTNQ-.js"></script>
   </head>
   <body>
     <div id="root"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "polotno-node",
-  "version": "2.9.39",
+  "version": "2.10.1",
   "description": "Polotno workflow from NodeJS",
   "main": "index.js",
   "scripts": {
@@ -26,7 +26,7 @@
     "gifencoder": "^2.0.1",
     "pixelmatch": "^6.0.0",
     "pngjs": "^7.0.0",
-    "polotno": "^2.11.5",
+    "polotno": "^2.12.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "vite": "^5.3.4"

package/video-parallel.js

@@ -116,6 +116,20 @@ module.exports.jsonToVideo = async function jsonToVideo(
       })
     );
 
+    const audios = [];
+    // download all audio tracks
+    await Promise.all(
+      (json.audios || []).map(async (audio) => {
+        const filename = Math.random().toString(36).substring(7);
+        const destination = path.join(tempFolder.name, filename);
+        await downloadVideo(audio.src, destination);
+        audios.push({
+          ...audio,
+          file: destination,
+        });
+      })
+    );
+
     const duration = json.pages.reduce((acc, page) => {
       return acc + (page.duration ?? 5000);
     }, 0);
@@ -139,11 +153,10 @@ module.exports.jsonToVideo = async function jsonToVideo(
       chunks.push(frames.slice(i, i + chunkSize));
     }
 
+    let lastTime = 0;
     const pages = json.pages.map((p, index) => {
-      const previousPage = json.pages[index - 1];
-      const startTime = previousPage
-        ? previousPage.startTime + previousPage.duration
-        : 0;
+      const startTime = lastTime;
+      lastTime = startTime + p.duration;
       return {
         id: p.id,
         startTime,
@@ -157,16 +170,19 @@ module.exports.jsonToVideo = async function jsonToVideo(
       chunks.map(async (chunk, chunkIndex) => {
         const instance = typeof inst === 'function' ? await inst() : inst;
         const page = await instance.createPage();
+        await page.evaluate(() => {
+          if (window.config?.onLoadError) {
+            window.config.onLoadError((error) => {
+              window._polotnoError = error;
+            });
+          } else {
+            console.error(
+              'onLoadError function is not defined in the client. Error handling will not work.'
+            );
+          }
+        });
         page.setDefaultNavigationTimeout(60000); // Increase timeout to 60 seconds
 
-        await page.evaluate(async (json) => {
-          store.loadJSON(json);
-          await store.waitLoading();
-          await new Promise((resolve) => {
-            setTimeout(resolve, 100);
-          });
-        }, json);
-
         let lastPageIndex = -1;
         for (const frameIndex of chunk) {
           let currentTime = frameIndex * timePerFrame;
@@ -185,9 +201,23 @@ module.exports.jsonToVideo = async function jsonToVideo(
             );
           });
           if (storePageIndex !== lastPageIndex) {
+            await page.evaluate(async (json) => {
+              store.loadJSON(json);
+              await store.waitLoading();
+              await new Promise((resolve) => {
+                setTimeout(resolve, 100);
+              });
+            }, json);
             await page.evaluate(async (currentTime) => {
               store.setCurrentTime(currentTime);
+              store.checkActivePage();
+              store.activePage.set({
+                _rendering: true,
+              });
               await store.waitLoading();
+              await new Promise((resolve) => {
+                setTimeout(resolve, 100);
+              });
               if (window.config.unstable_setTextOverflow) {
                 window.config.unstable_setTextOverflow('resize');
               } else {
@@ -195,7 +225,8 @@ module.exports.jsonToVideo = async function jsonToVideo(
                 //   'Can not set text overflow mode. Define window.config.unstable_setTextOverflow function'
                 // );
               }
-            });
+            }, currentTime);
+            lastPageIndex = storePageIndex;
           }
           const startTime = Date.now();
           const dataURL = await page.evaluate(
@@ -219,6 +250,25 @@ module.exports.jsonToVideo = async function jsonToVideo(
             attrs || {},
             currentTime
           );
+          const error = await page.evaluate(() => window._polotnoError);
+          if (error) {
+            // clear error
+            await page.evaluate(() => {
+              window._polotnoError = null;
+            });
+            const message = error.toString();
+            const isFontError =
+              message.indexOf('Timeout for loading font') >= 0;
+            const skipError = isFontError && attrs.skipFontError;
+
+            const isImageError = message.indexOf('image ') >= 0;
+            const skipImageError = isImageError && attrs.skipImageError;
+
+            if (!skipError && !skipImageError) {
+              throw new Error(error);
+            }
+          }
+          // TODO: add error handling!!!!
           fs.writeFileSync(
             `${tempFolder.name}/${frameIndex}.jpeg`,
             dataURL.split(',')[1],
@@ -315,21 +365,31 @@ module.exports.jsonToVideo = async function jsonToVideo(
         // Map the video stream from the image sequence
         ffmpegCmd.outputOptions(['-map 0:v']);
 
-        // Prepare audio filter complex only if there are audio inputs
-        if (audioInputs.length > 0) {
-          const audioFilters = audioInputs.map(
-            (input, i) =>
-              `[${input.index}:a]adelay=${input.delay}|${input.delay},volume=${input.volume}[a${i}]`
-          );
-          const audioMerge = audioInputs.map((_, i) => `[a${i}]`).join('');
+        // Prepare audio filter complex for both video and pure audio inputs
+        const allAudioInputs = [...audioInputs, ...audios];
+        if (allAudioInputs.length > 0) {
+          const audioFilters = allAudioInputs.map((input, i) => {
+            const inputIndex = audioInputs.includes(input)
+              ? input.index
+              : audioInputs.length + i + 1;
+            return `[${inputIndex}:a]adelay=${input.delay}|${input.delay},volume=${input.volume},apad[a${i}]`;
+          });
+          const audioMerge = allAudioInputs.map((_, i) => `[a${i}]`).join('');
           const filterComplex = `${audioFilters.join(
             ';'
           )};${audioMerge}amix=inputs=${
-            audioInputs.length
-          }:duration=longest[aout]`;
+            allAudioInputs.length
+          }:dropout_transition=0,aformat=sample_fmts=fltp:sample_rates=44100:channel_layouts=stereo,apad,atrim=0:${
+            duration / 1000
+          }[aout]`;
 
           ffmpegCmd.complexFilter(filterComplex);
           ffmpegCmd.outputOptions(['-map [aout]']);
+
+          // Add pure audio inputs
+          audios.forEach((audio) => {
+            ffmpegCmd.input(audio.file);
+          });
         }
 
         ffmpegCmd