Playback settings

Prev Next

Available in Classic and VPC

In playback settings, you can view how to edit the script code to set the option related to the player playback.

Note
  • For descriptions of properties to set options, see Player settings.
  • Configurable options may vary depending on the current pricing plan.

Autoplay

You can autoplay the player's playback source with autostart property. Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  autostart: true, // autoplay (false: no autoplay)
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
Note

You can feel uncomfortable when a noise is heard and a video is played as soon as the web page starts. To prevent this, autoplay is restricted to play under certain conditions. At least one of the followings must be met:

  • When volume is 0 or muted
  • After user input actions, such as a click, touch, or key input, etc, on the web page
  • When set to white list page in the settings
  • When <iframe> that supports autoplay and the relevant document are set

Autopause

The play source can automatically pause when minimizing the browser window or switching tabs with autoPause property. Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  autoPause: true, // autopause (false: no autopause)
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
});

Mute

You can play on mute when first playing the player with muted property. Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  muted: true, // mute on first play (false: no mute)
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
});

Playback Speed

You can control the playback speed with playbackRate property. If no playback speed is set, the default value of '1.0' is applied. You can set the playback speed to be slower by entering a number less than 1.0, or set the playback speed to be faster by entering a number higher than 1.0.
The examples to set the playback speed to 0.5 are as follows.

// Video (MP4)
new ncplayer('video1', {
  muted: true,
  playbackRate: 0.5, Playback speed control// (default value: 1.0)
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
});

Playback Speed Control UI

UI can be provided so that you can set the playback speed personally with playRateSetting property.

Note

This option is only available when subscribing the Standard pricing plan.

Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  muted: true,
  playRateSetting: [0.5,0.75,1.0,1.25,1.5,1.75,2.0], // Support 0.5 to 2x speed
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
});

Low Latency (LL-HLS)

You can apply the player optimized for Low Latency HLS with the lowLatencyMode property.

Note
  • This is the officially supported mode for Low Latency HLS of the Live Station service. For more information about Low Latency HLS settings, see Live Station User Guide.
  • This option is only available when subscribing the Standard pricing plan.

Examples are as follows:

// Video (HLS)
new ncplayer('video1', {
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4/index.m3u8',
    },
  ],
	lowLatencyMode: true, // LL-HLS Enable (false: LL-HLS Disabled)
});

Repeated Playback

You can play a video on repeat with repeat property. Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  repeat: true, // repeat (false: no repeat)
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
});

Set Initial Release Date

You can set VOD to allow all viewers to simultaneously watch the same segment, like a live broadcast setting with setStartTime property.

Note
  • This option can only be set when subscribing Standard pricing plan and applied to only VOD.
  • Date format supports UTC format.

Examples are as follows:

// Video (MP4)
new ncplayer('video1', {
  autoPause: true,
  playlist: [
    {
      file: 'https://CDNdomain/example_video_01.mp4',
    },
  ],
	setStartTime:"2023-02-08 06:07:00+00:00", // set initial release date
});