Video

Element type: Dictionary
Availability: 2.0.6+

Play a local or online video with custom behaviors. The URL to the video can be a direct link, a path, a Youtube or Vimeo link.

Keys

Name	Type	Possible values	Required
Type	String	Video	Required
URL	String	-	Required
HideControls	Boolean	-
ShouldFillSpace	Boolean	-
Height	Number	-
AutomaticStart PRO	Boolean	-
Repeat PRO	Boolean	-
IsMuted	Boolean	-
Margins	Dictionary (Margins)	-
Border	Dictionary (Border)	-
Condition PRO	Dictionary (Condition)	-

Detail

Type Required

Type: String
Explanation: The type of the component which has to be Video.

URL Required

Type: String
Explanation: The URL of the video to play. Can be local or online. Starting with Octory 2.4.3, you can directly use a YouTube or Vimeo url.

HideControls

Type: Boolean
Default: false
Explanation: When true, the controls to play the video will be hidden, preventing the user to pause or resume it.

ShouldFillSpace

Type: Boolean
Default: false
Explanation: If set to true, the video will take all the available space in the container, while keeping its ratio, and it will stop when the maximum width or height is reached.

Height

Type: Number
Explanation: The height of the video component. The width is fixed as the available space within the container. The image will fill the overall available width or height, depending of which one is the smallest, to keep its dimensions.

info

Is ignored if ShouldFillSpace is set to true.
If no Height and no ShouldFillSpace keys are specified, the maximum height is 200.

AutomaticStart PRO

Type: Boolean
Default: false
Explanation: If true, the video will start automatically when the slide that contains it is shown.

Repeat PRO

Type: Boolean
Default: false
Explanation: If true, the video will restart when it is finished.

IsMuted

Type: Boolean
Default: false
Explanation: If true, the video sound will not be played.

Margins

Type: Dictionary (Margins)
Explanation: Add padding to the component's sides.

Border

Type: Dictionary (Border)
Explanation: Add a top or bottom border to a component.

Condition PRO

Type: Dictionary (Condition)
Explanation: Allows to hide or show the component using a boolean expression.

Example

Using an online video.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<!-- ... -->
	<key>Slides</key>
	<array>
		<dict>
			<key>Containers</key>
			<array>
				<dict>
					<key>Components</key>
					<array>
						<dict>
							<key>Type</key>
							<string>Video</string>
							<key>URL</key>
							<string>https://devstreaming-cdn.apple.com/videos/streaming/examples/bipbop_adv_example_hevc/master.m3u8</string>
						</dict>
					</array>
				</dict>
			</array>
		</dict>
	</array>
	<!-- ... -->
</dict>
</plist>

Local video with a variable Videos in its URL. For instance, Videos could be /Users/jappleseed/Application Support/Octory/Resources/Videos. Controls are hidden and the video will start automatically when it appears.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<!-- ... -->
	<key>Slides</key>
	<array>
		<dict>
			<key>Containers</key>
			<array>
				<dict>
					<key>Components</key>
					<array>
						<dict>
							<key>Type</key>
							<string>Image</string>
							<key>URL</key>
							<string>${Videos}/onboarding.mov</string>
							<key>AutomaticStart</key>
							<true/>
							<key>HideControls</key>
							<true/>
						</dict>
					</array>
				</dict>
			</array>
		</dict>
	</array>
	<!-- ... -->
</dict>
</plist>