Nodejs create straightforward video slideshows

Need to read first:

Read https://www.nodejsauto.com/2020/04/nodejs-resize-image-sample-size-by-jimp.html
(Nodejs resize images same size by Jimp: (batch change photos to the same size))

How your video will display
The standard aspect ratio for YouTube on a computer is 16:9. If your video has a different aspect ratio, the player will automatically change to the ideal size to match your video and the viewer’s device.

For some video and device aspects ratios like 9:16 vertical videos on computer browsers, YouTube may add more padding for optimal viewing. The padding is white by default, and dark gray when Dark theme is turned on.

For best results, avoid adding padding or black bars directly to your video. Padding interferes with YouTube’s ability to adjust the player dynamically to your video size and the viewer’s device.

Recommended resolution & aspect ratios
For the default 16:9 aspect ratio, encode at these resolutions:


  • 2160p: 3840x2160
  • 1440p: 2560x1440
  • 1080p: 1920x1080
  • 720p: 1280x720
  • 480p: 854x480
  • 360p: 640x360
  • 240p: 426x240


Optimize again (reduce image size) (edit file "./jimp.js")

module.exports.reSize2 = async function (x, y, opt, bg, text) {
  // bg: 'black'
  var image2= opt.jimp;
  if(image2.bitmap.width==x && image2.bitmap.height== y) {
    if(text) {
      var font = await Jimp.loadFont(Jimp.FONT_SANS_32_WHITE);
      image2.print(font, 0, 0, {
        text,
        alignmentX: Jimp.HORIZONTAL_ALIGN_RIGHT,
        alignmentY: Jimp.VERTICAL_ALIGN_BOTTOM
      }, image2.bitmap.width, image2.bitmap.height);
      console.log('texted and saved done!');
      return image2.write(opt.path); // save
    }
    else return '_';
  }
  var image = await Jimp.read(x, y, bg);
  await image.quality(0); // 0 - 100
  var heightd= image2.bitmap.height* x/image2.bitmap.width;
  var widthd= y * image2.bitmap.width / image2.bitmap.height;
  if(heightd>y){
    await image2.resize(widthd, y);
  }
  else if(widthd>x){
    await image2.resize(x, heightd);
  }
  await image.composite(image2, Math.abs(x - image2.bitmap.width) / 2, Math.abs(y - image2.bitmap.height) / 2, [
    {
      mode: Jimp.BLEND_SOURCE_OVER,
      opacitySource: 0.5,
      opacityDest: 0.9
    }
  ]);

  if(text) {
    var font = await Jimp.loadFont(Jimp.FONT_SANS_32_WHITE);
    image.print(font, 0, 0, {
      text,
      alignmentX: Jimp.HORIZONTAL_ALIGN_RIGHT,
      alignmentY: Jimp.VERTICAL_ALIGN_BOTTOM
    }, image.bitmap.width, image.bitmap.height);
  }
  console.log('resized, texted and saved done!');
  return image.write(opt.path); // save
}

Material:
Folder images, file music .mp3
Then code to creat video slideshows..

Nodejs create straightforward video slideshows:

Run:
var images = [];
const fs = require('fs');
fs.readdirSync('anh').forEach(function (el, idx) {
  images.push({
    path: __dirname + '\\anh\\' + el,
    // caption: 'by Nodejs Auto',
    // loop: 10 // long caption
  })
});
var videoshow = require('videoshow') // require fluent-ffmpeg
function slideNow(){
  console.log('start..');
  videoshow(images, {
    fps: 25,
    loop: 5, // seconds
    transition: true,
    transitionDuration: 1, // seconds
    videoBitrate: 1024,
    videoCodec: 'libx264',
    size: '1280x720',
    audioBitrate: '128k',
    audioChannels: 2,
    format: 'mp4',
    pixelFormat: 'yuv420p'
  })
  //.audio('song.mp3')
  .save('video.mp4')
  .on('start', function (command) {
    console.log('ffmpeg process started:', command)
  })
  .on('error', function (err, stdout, stderr) {
    console.error('Error:', err)
    console.error('ffmpeg stderr:', stderr)
  })
  .on('end', function (output) {
    console.error('Video created in:', output)
  })
  ;
}
const meJimp= require('./jimp');
; (async function () {
  var a = await meJimp.findMaxSz(images);
  for(var i=0; i< a.images.length; i++){
    // await meJimp.reSize(a.width, a.height, a.images[i], 'black', a.images[i].caption);
    // await meJimp.reSize(a.width, a.height, a.images[i], 'black');
    await meJimp.reSize2(1280, 720, a.images[i], 'black');
  }
  slideNow();
})().catch(function(_ex){
  console.error(_ex);
});

Package:
videoshow: https://www.npmjs.com/package/videoshow
Desciption:
Simple utility for node/io.js to create straightforward video slideshows based on images using ffmpeg, with additional features such as audio, subtitles and fade in/out transitions between slides.

Comments