Skip to content

HtmlItem

Defined in: core/items/html.ts:65

The HtmlItem class represents a web page item. This covers both item plugins and non-plugin URLs.

Inherits from: #core/Item Core/Item

Implements: #core/IItemChroma Core/IItemChroma, #core/IItemColor Core/IItemColor, #core/IItemLayout Core/IItemLayout, #core/IItemTransition Core/IItemTransition, #core/IAudio Core/IAudio, #core/ISourceConfigurable Core/ISourceConfigurable

var XJS = require('xjs');
XJS.Scene.getActiveScene().then(function(scene) {
scene.getItems().then(function(items) {
for (var i in items) {
if (items[i] instanceof XJS.HtmlItem) {
// Manipulate your HTML item here
items[i].enableBrowserTransparency(true);
}
}
});
});

All methods marked as Chainable resolve with the original HtmlItem instance. Also, any audio setting, i.e. volume, mute, stream only may not be properly reflected in the item unless native browser audio support is enabled. (Tools menu > General Settings > Advanced tab)

  • IItemLayout
  • IItemColor
  • IItemChroma
  • IItemTransition
  • ISourceConfigurable
  • IAudio
  • IItemEffect
  • ISourceHtml

new HtmlItem(props?): HtmlItem

Defined in: core/items/item.ts:88

HtmlItem

Item.constructor

applyConfig: (configObj) => Promise<HtmlItem>

Defined in: core/items/html.ts:607

See: #core/ISourceConfigurable#applyConfig applyConfig

any

Promise<HtmlItem>

ISourceConfigurable.applyConfig


bringForward: () => Promise<HtmlItem>

Defined in: core/items/html.ts:211

See: #core/IItemLayout#bringForward bringForward

Promise<HtmlItem>

IItemLayout.bringForward

Item.bringForward


bringToFront: () => Promise<HtmlItem>

Defined in: core/items/html.ts:216

See: #core/IItemLayout#bringToFront bringToFront

Promise<HtmlItem>

IItemLayout.bringToFront

Item.bringToFront


call: () => Promise<HtmlItem>

Defined in: core/items/html.ts:81

See: #core/ISourceHtml#call call

Promise<HtmlItem>

ISourceHtml.call


enableBrowser60FPS: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:111

See: #core/ISourceHtml#enableBrowser60FPS enableBrowser60FPS

boolean

Promise<HtmlItem>

ISourceHtml.enableBrowser60FPS


enableBrowserJS: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:151

See: #core/ISourceHtml#enableBrowserJS enableBrowserJS

boolean

Promise<HtmlItem>

ISourceHtml.enableBrowserJS


enableBrowserTransparency: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:101

See: #core/ISourceHtml#enableBrowserTransparency enableBrowserTransparency

boolean

Promise<HtmlItem>

ISourceHtml.enableBrowserTransparency


enableCustomCSS: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:171

See: #core/ISourceHtml#enableCustomCSS enableCustomCSS

boolean

Promise<HtmlItem>

ISourceHtml.enableCustomCSS


enableReloadOnSceneEnter: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:201

See: #core/ISourceHtml#enableReloadOnSceneEnter enableReloadOnSceneEnter

boolean

Promise<HtmlItem>

ISourceHtml.enableReloadOnSceneEnter


enableReloadOnShow: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:191

See: #core/ISourceHtml#enableReloadOnShow enableReloadOnShow

boolean

Promise<HtmlItem>

ISourceHtml.enableReloadOnShow


getAllowRightClick: () => Promise<boolean>

Defined in: core/items/html.ts:126

See: #core/ISourceHtml#getAllowRightClick getAllowRightClick

Promise<boolean>

ISourceHtml.getAllowRightClick


getBorderColor: () => Promise<Color>

Defined in: core/items/html.ts:363

See: #core/IItemColor#getBorderColor getBorderColor

Promise<Color>

IItemColor.getBorderColor


getBorderEffectColor: () => Promise<Color>

Defined in: core/items/html.ts:665

See: #core/IItemEffect#getBorderEffectColor getBorderEffectColor

Promise<Color>

IItemEffect.getBorderEffectColor


getBorderEffectOpacity: () => Promise<number>

Defined in: core/items/html.ts:659

See: #core/IItemEffect#getBorderEffectOpacity getBorderEffectOpacity

Promise<number>

IItemEffect.getBorderEffectOpacity


getBorderEffectRadius: () => Promise<number>

Defined in: core/items/html.ts:647

See: #core/IItemEffect#getBorderEffectRadius getBorderEffectRadius

Promise<number>

IItemEffect.getBorderEffectRadius


getBorderEffectThickness: () => Promise<number>

Defined in: core/items/html.ts:653

See: #core/IItemEffect#getBorderEffectThickness getBorderEffectThickness

Promise<number>

IItemEffect.getBorderEffectThickness


getBrightness: () => Promise<number>

Defined in: core/items/html.ts:343

See: #core/IItemColor#getBrightness getBrightness

Promise<number>

IItemColor.getBrightness


getBrowserCustomSize: () => Promise<Rectangle>

Defined in: core/items/html.ts:116

See: #core/ISourceHtml#getBrowserCustomSize getBrowserCustomSize

Promise<Rectangle>

ISourceHtml.getBrowserCustomSize


getBrowserJS: () => Promise<string>

Defined in: core/items/html.ts:136

See: #core/ISourceHtml#getBrowserJS getBrowserJS

Promise<string>

ISourceHtml.getBrowserJS


getBrowserLoadStatus: () => Promise<string>

Defined in: core/items/html.ts:181

See: #core/ISourceHtml#getBrowserLoadStatus getBrowserLoadStatus

Promise<string>

ISourceHtml.getBrowserLoadStatus


getCanvasRotate: () => Promise<number>

Defined in: core/items/html.ts:236

See: #core/IItemLayout#getCanvasRotate getCanvasRotate

Promise<number>

IItemLayout.getCanvasRotate

Item.getCanvasRotate


getChromaAntiAliasLevel: () => Promise<ChromaAntiAliasLevel>

Defined in: core/items/html.ts:432

See: #core/IItemChroma#getChromaAntiAliasLevel getChromaAntiAliasLevel

Promise<ChromaAntiAliasLevel>

IItemChroma.getChromaAntiAliasLevel


getChromaColorKeyColor: () => Promise<Color>

Defined in: core/items/html.ts:548

See: #core/IItemChroma#getChromaColorKeyColor getChromaColorKeyColor

Promise<Color>

IItemChroma.getChromaColorKeyColor


getChromaColorKeyExposure: () => Promise<number>

Defined in: core/items/html.ts:538

See: #core/IItemChroma#getChromaColorKeyExposure getChromaColorKeyExposure

Promise<number>

IItemChroma.getChromaColorKeyExposure


getChromaColorKeyThreshold: () => Promise<number>

Defined in: core/items/html.ts:528

See: #core/IItemChroma#getChromaColorKeyThreshold getChromaColorKeyThreshold

Promise<number>

IItemChroma.getChromaColorKeyThreshold


getChromaLegacyAlphaSmoothing: () => Promise<number>

Defined in: core/items/html.ts:484

See: #core/IItemChroma#getChromaLegacyAlphaSmoothing getChromaLegacyAlphaSmoothing

Promise<number>

IItemChroma.getChromaLegacyAlphaSmoothing


getChromaLegacyBrightness: () => Promise<number>

Defined in: core/items/html.ts:444

See: #core/IItemChroma#getChromaLegacyBrightness getChromaLegacyBrightness

Promise<number>

IItemChroma.getChromaLegacyBrightness


getChromaLegacyHue: () => Promise<number>

Defined in: core/items/html.ts:464

See: #core/IItemChroma#getChromaLegacyHue getChromaLegacyHue

Promise<number>

IItemChroma.getChromaLegacyHue


getChromaLegacySaturation: () => Promise<number>

Defined in: core/items/html.ts:454

See: #core/IItemChroma#getChromaLegacySaturation getChromaLegacySaturation

Promise<number>

IItemChroma.getChromaLegacySaturation


getChromaLegacyThreshold: () => Promise<number>

Defined in: core/items/html.ts:474

See: #core/IItemChroma#getChromaLegacyThreshold getChromaLegacyThreshold

Promise<number>

IItemChroma.getChromaLegacyThreshold


getChromaRGBKeyExposure: () => Promise<number>

Defined in: core/items/html.ts:516

See: #core/IItemChroma#getChromaRGBKeyExposure getChromaRGBKeyExposure

Promise<number>

IItemChroma.getChromaRGBKeyExposure


getChromaRGBKeyPrimaryColor: () => Promise<ChromaPrimaryColors>

Defined in: core/items/html.ts:496

See: #core/IItemChroma#getChromaRGBKeyPrimaryColor getChromaRGBKeyPrimaryColor

Promise<ChromaPrimaryColors>

IItemChroma.getChromaRGBKeyPrimaryColor


getChromaRGBKeyThreshold: () => Promise<number>

Defined in: core/items/html.ts:506

See: #core/IItemChroma#getChromaRGBKeyThreshold getChromaRGBKeyThreshold

Promise<number>

IItemChroma.getChromaRGBKeyThreshold


getContrast: () => Promise<number>

Defined in: core/items/html.ts:348

See: #core/IItemColor#getContrast getContrast

Promise<number>

IItemColor.getContrast


getCropping: () => Promise<Object>

Defined in: core/items/html.ts:241

See: #core/IItemLayout#getCropping getCropping

Promise<Object>

IItemLayout.getCropping

Item.getCropping


getCustomCSS: () => Promise<string>

Defined in: core/items/html.ts:156

See: #core/ISourceHtml#getCustomCSS getCustomCSS

Promise<string>

ISourceHtml.getCustomCSS


getCustomName: () => Promise<string>

Defined in: core/items/item.ts:758

See: #core/Source#getCustomName getCustomName

Promise<string>

Item.getCustomName


getEnhancedRotate: () => Promise<number>

Defined in: core/items/html.ts:246

See: #core/IItemLayout#getEnhancedRotate getEnhancedRotate

Promise<number>

IItemLayout.getEnhancedRotate

Item.getEnhancedRotate


getFileMask: () => Promise<string>

Defined in: core/items/html.ts:707

See: #core/IItemEffect#getFileMask getFileMask

Promise<string>

IItemEffect.getFileMask


getFilter: () => Promise<Filter>

Defined in: core/items/html.ts:719

See: #core/IItemEffect#getFilter getFilter

Promise<Filter>

IItemEffect.getFilter


getFilterConfig: () => Promise<Object>

Defined in: core/items/html.ts:734

See: #core/IItemEffect#getFilterConfig getFilterConfig

Promise<Object>

IItemEffect.getFilterConfig


getHue: () => Promise<number>

Defined in: core/items/html.ts:353

See: #core/IItemColor#getHue getHue

Promise<number>

IItemColor.getHue


getId: () => Promise<string>

Defined in: core/items/item.ts:267

return: Promise

Get the ID of the Item

item.getId().then(function(id) {
// The rest of your code here
});

Promise<string>

Item.getId


getItemList: () => Promise<Item[]>

Defined in: core/items/item.ts:513

See: #core/Source#getItemList getItemList

Promise<Item[]>

Item.getItemList


getKeepLoaded: () => Promise<boolean>

Defined in: core/items/item.ts:773

See: #core/Source#getKeepLoaded getKeepLoaded

Promise<boolean>

Item.getKeepLoaded


getKeyingType: () => Promise<KeyingType>

Defined in: core/items/html.ts:420

See: #core/IItemChroma#getKeyingType getKeyingType

Promise<KeyingType>

IItemChroma.getKeyingType


getMaskEffect: () => Promise<MaskEffect>

Defined in: core/items/html.ts:641

See: #core/IItemEffect#getMaskEffect getMaskEffect

Promise<MaskEffect>

IItemEffect.getMaskEffect


getName: () => Promise<string>

Defined in: core/items/item.ts:748

See: #core/Source#getName getName

Promise<string>

Item.getName


getPosition: () => Promise<Rectangle>

Defined in: core/items/html.ts:251

See: #core/IItemLayout#getPosition getPosition

Promise<Rectangle>

IItemLayout.getPosition

Item.getPosition


getRotateX: () => Promise<number>

Defined in: core/items/html.ts:261

See: #core/IItemLayout#getRotateX getRotateX

Promise<number>

IItemLayout.getRotateX

Item.getRotateX


getRotateY: () => Promise<number>

Defined in: core/items/html.ts:256

See: #core/IItemLayout#getRotateY getRotateY

Promise<number>

IItemLayout.getRotateY

Item.getRotateY


getRotateZ: () => Promise<number>

Defined in: core/items/html.ts:266

See: #core/IItemLayout#getRotateZ getRotateZ

Promise<number>

IItemLayout.getRotateZ

Item.getRotateZ


getSaturation: () => Promise<number>

Defined in: core/items/html.ts:358

See: #core/IItemColor#getSaturation getSaturation

Promise<number>

IItemColor.getSaturation


getShadowEffectBlur: () => Promise<number>

Defined in: core/items/html.ts:683

See: #core/IItemEffect#getShadowEffectBlur getShadowEffectBlur

Promise<number>

IItemEffect.getShadowEffectBlur


getShadowEffectColor: () => Promise<Color>

Defined in: core/items/html.ts:671

See: #core/IItemEffect#getShadowEffectColor getShadowEffectColor

Promise<Color>


getShadowEffectOffsetX: () => Promise<number>

Defined in: core/items/html.ts:695

See: #core/IItemEffect#getShadowEffectOffsetX getShadowEffectOffsetX

Promise<number>

IItemEffect.getShadowEffectOffsetX


getShadowEffectOffsetY: () => Promise<number>

Defined in: core/items/html.ts:701

See: #core/IItemEffect#getShadowEffectOffsetY getShadowEffectOffsetY

Promise<number>

IItemEffect.getShadowEffectOffsetY


getShadowEffectOpacity: () => Promise<number>

Defined in: core/items/html.ts:689

See: #core/IItemEffect#getShadowEffectOpacity getShadowEffectOpacity

Promise<number>

IItemEffect.getShadowEffectOpacity


getShadowEffectThickness: () => Promise<number>

Defined in: core/items/html.ts:677

See: #core/IItemEffect#getShadowEffectThickness getShadowEffectThickness

Promise<number>

IItemEffect.getShadowEffectThickness


getTransition: () => Promise<Transition>

Defined in: core/items/html.ts:570

See: #core/IItemTransition#getTransition getTransition

Promise<Transition>

IItemTransition.getTransition


getTransitionTime: () => Promise<number>

Defined in: core/items/html.ts:580

See: #core/IItemTransition#getTransitionTime getTransitionTime

Promise<number>

IItemTransition.getTransitionTime


getTransparency: () => Promise<number>

Defined in: core/items/html.ts:338

See: #core/IItemColor#getTransparency getTransparency

Promise<number>

IItemColor.getTransparency


getType: () => Promise<ItemTypes>

Defined in: core/items/item.ts:786

See: #core/Source#getType getType

Promise<ItemTypes>

Item.getType


getURL: () => Promise<string>

Defined in: core/items/html.ts:86

See: #core/ISourceHtml#getURL getURL

Promise<string>

ISourceHtml.getURL


getValue: () => Promise<string | XML>

Defined in: core/items/item.ts:763

See: #core/Source#getValue getValue

Promise<string | XML>

Item.getValue


getVolume: () => Promise<number>

Defined in: core/items/html.ts:612

See: #core/IAudio#getVolume getVolume

Promise<number>

IAudio.getVolume


isAudioAvailable: () => Promise<boolean>

Defined in: core/items/html.ts:636

See: #core/IAudio#isAudioAvailable isAudioAvailable

Promise<boolean>

IAudio.isAudioAvailable


isAutoMute: () => Promise<boolean>

Defined in: core/items/html.ts:618

See: #core/IAudio#isAutoMute isAutoMute

Promise<boolean>

IAudio.isAutoMute


isBrowser60FPS: () => Promise<boolean>

Defined in: core/items/html.ts:106

See: #core/ISourceHtml#isBrowser60FPS isBrowser60FPS

Promise<boolean>

ISourceHtml.isBrowser60FPS


isBrowserJSEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:146

See: #core/ISourceHtml#isBrowserJSEnabled isBrowserJSEnabled

Promise<boolean>

ISourceHtml.isBrowserJSEnabled


isBrowserOptimized: () => Promise<boolean>

Defined in: core/items/html.ts:176

See: #core/ISourceHtml#isBrowserOptimized isBrowserOptimized

Promise<boolean>

ISourceHtml.isBrowserOptimized


isBrowserTransparent: () => Promise<boolean>

Defined in: core/items/html.ts:96

See: #core/ISourceHtml#isBrowserTransparent isBrowserTransparent

Promise<boolean>

ISourceHtml.isBrowserTransparent


isChromaEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:410

See: #core/IItemChroma#isChromaEnabled isChromaEnabled

Promise<boolean>

IItemChroma.isChromaEnabled


isCustomCSSEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:166

See: #core/ISourceHtml#isCustomCSSEnabled isCustomCSSEnabled

Promise<boolean>

ISourceHtml.isCustomCSSEnabled


isEnhancedResizeEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:231

See: #core/IItemLayout#isEnhancedResizeEnabled isEnhancedResizeEnabled

Promise<boolean>

IItemLayout.isEnhancedResizeEnabled

Item.isEnhancedResizeEnabled


isFileMaskingGuideVisible: () => Promise<boolean>

Defined in: core/items/html.ts:713

See: #core/IItemEffect#isFileMaskingGuideVisible isFileMaskingGuideVisible

Promise<boolean>

IItemEffect.isFileMaskingGuideVisible


isFullDynamicColorRange: () => Promise<boolean>

Defined in: core/items/html.ts:368

See: #core/IItemColor#isFullDynamicColorRange isFullDynamicColorRange

Promise<boolean>

IItemColor.isFullDynamicColorRange


isKeepAspectRatio: () => Promise<boolean>

Defined in: core/items/html.ts:221

See: #core/IItemLayout#isKeepAspectRatio isKeepAspectRatio

Promise<boolean>

IItemLayout.isKeepAspectRatio

Item.isKeepAspectRatio


isMute: () => Promise<boolean>

Defined in: core/items/html.ts:615

See: #core/IAudio#isMute isMute

Promise<boolean>

IAudio.isMute


isPositionLocked: () => Promise<boolean>

Defined in: core/items/html.ts:226

See: #core/IItemLayout#isPositionLocked isPositionLocked

Promise<boolean>

IItemLayout.isPositionLocked

Item.isPositionLocked


isReloadOnSceneEnterEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:196

See: #core/ISourceHtml#isReloadOnSceneEnterEnabled isReloadOnSceneEnterEnabled

Promise<boolean>

ISourceHtml.isReloadOnSceneEnterEnabled


isReloadOnShowEnabled: () => Promise<boolean>

Defined in: core/items/html.ts:186

See: #core/ISourceHtml#isReloadOnShowEnabled isReloadOnShowEnabled

Promise<boolean>

ISourceHtml.isReloadOnShowEnabled


isSourceAvailable: () => Promise<boolean>

Defined in: core/items/html.ts:204

See: #core/ISourceHtml#isSourceAvailable isSourceAvailable

Promise<boolean>

ISourceHtml.isSourceAvailable


isStreamOnlyAudio: () => Promise<boolean>

Defined in: core/items/html.ts:630

See: #core/IAudio#isStreamOnlyAudio isStreamOnlyAudio

Promise<boolean>

IAudio.isStreamOnlyAudio


isVisible: () => Promise<boolean>

Defined in: core/items/html.ts:560

See: #core/IItemTransition#isVisible isVisible

Promise<boolean>

IItemTransition.isVisible


loadConfig: () => Promise<any>

Defined in: core/items/html.ts:592

See: #core/ISourceConfigurable#loadConfig loadConfig

Promise<any>

ISourceConfigurable.loadConfig


refresh: () => Promise<Source>

Defined in: core/items/item.ts:783

See: #core/Source#refresh refresh

Promise<Source>

Item.refresh


removeFilter: () => Promise<HtmlItem>

Defined in: core/items/html.ts:731

See: #core/IItemEffect#removeFilter removeFilter

Promise<HtmlItem>

IItemEffect.removeFilter


requestSaveConfig: (configObj) => Promise<HtmlItem>

Defined in: core/items/html.ts:602

See: #core/ISourceConfigurable#requestSaveConfig requestSaveConfig

any

Promise<HtmlItem>

ISourceConfigurable.requestSaveConfig


saveConfig: (configObj) => Promise<HtmlItem>

Defined in: core/items/html.ts:597

See: #core/ISourceConfigurable#saveConfig saveConfig

any

Promise<HtmlItem>

ISourceConfigurable.saveConfig


sendBackward: () => Promise<HtmlItem>

Defined in: core/items/html.ts:271

See: #core/IItemLayout#sendBackward sendBackward

Promise<HtmlItem>

IItemLayout.sendBackward

Item.sendBackward


sendToBack: () => Promise<HtmlItem>

Defined in: core/items/html.ts:276

See: #core/IItemLayout#sendToBack sendToBack

Promise<HtmlItem>

IItemLayout.sendToBack

Item.sendToBack


setAllowRightClick: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:131

See: #core/ISourceHtml#setAllowRightClick setAllowRightClick

boolean

Promise<HtmlItem>

ISourceHtml.setAllowRightClick


setAutoMute: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:627

See: #core/IAudio#setAutoMute setAutoMute

boolean

Promise<HtmlItem>

IAudio.setAutoMute


setBorderColor: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:398

See: #core/IItemColor#setBorderColor setBorderColor

Color

Promise<HtmlItem>

IItemColor.setBorderColor


setBorderEffectColor: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:668

See: #core/IItemEffect#setBorderEffectColor setBorderEffectColor

Color

Promise<HtmlItem>

IItemEffect.setBorderEffectColor


setBorderEffectOpacity: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:662

See: #core/IItemEffect#setBorderEffectOpacity setBorderEffectOpacity

number

Promise<HtmlItem>

IItemEffect.setBorderEffectOpacity


setBorderEffectRadius: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:650

See: #core/IItemEffect#setBorderEffectRadius setBorderEffectRadius

number

Promise<HtmlItem>

IItemEffect.setBorderEffectRadius


setBorderEffectThickness: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:656

See: #core/IItemEffect#setBorderEffectThickness setBorderEffectThickness

number

Promise<HtmlItem>

IItemEffect.setBorderEffectThickness


setBrightness: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:378

See: #core/IItemColor#setBrightness setBrightness

number

Promise<HtmlItem>

IItemColor.setBrightness


setBrowserCustomSize: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:121

See: #core/ISourceHtml#setBrowserCustomSize setBrowserCustomSize

Rectangle

Promise<HtmlItem>

ISourceHtml.setBrowserCustomSize


setBrowserJS: () => Promise<HtmlItem>

Defined in: core/items/html.ts:141

See: #core/ISourceHtml#setBrowserJS setBrowserJS

Promise<HtmlItem>

ISourceHtml.setBrowserJS


setCanvasRotate: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:281

See: #core/IItemLayout#setCanvasRotate setCanvasRotate

number

Promise<HtmlItem>

IItemLayout.setCanvasRotate

Item.setCanvasRotate


setChromaAntiAliasLevel: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:437

See: #core/IItemChroma#setChromaAntiAliasLevel setChromaAntiAliasLevel

ChromaAntiAliasLevel

Promise<HtmlItem>

IItemChroma.setChromaAntiAliasLevel


setChromaColorKeyColor: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:553

See: #core/IItemChroma#setChromaColorKeyColor setChromaColorKeyColor

Color

Promise<HtmlItem>

IItemChroma.setChromaColorKeyColor


setChromaColorKeyExposure: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:543

See: #core/IItemChroma#setChromaColorKeyExposure setChromaColorKeyExposure

number

Promise<HtmlItem>

IItemChroma.setChromaColorKeyExposure


setChromaColorKeyThreshold: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:533

See: #core/IItemChroma#setChromaColorKeyThreshold setChromaColorKeyThreshold

number

Promise<HtmlItem>

IItemChroma.setChromaColorKeyThreshold


setChromaEnabled: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:415

See: #core/IItemChroma#setChromaEnabled setChromaEnabled

boolean

Promise<HtmlItem>

IItemChroma.setChromaEnabled


setChromaLegacyAlphaSmoothing: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:489

See: #core/IItemChroma#setChromaLegacyAlphaSmoothing setChromaLegacyAlphaSmoothing

number

Promise<HtmlItem>

IItemChroma.setChromaLegacyAlphaSmoothing


setChromaLegacyBrightness: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:449

See: #core/IItemChroma#setChromaLegacyBrightness setChromaLegacyBrightness

number

Promise<HtmlItem>

IItemChroma.setChromaLegacyBrightness


setChromaLegacyHue: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:469

See: #core/IItemChroma#setChromaLegacyHue setChromaLegacyHue

number

Promise<HtmlItem>

IItemChroma.setChromaLegacyHue


setChromaLegacySaturation: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:459

See: #core/IItemChroma#setChromaLegacySaturation setChromaLegacySaturation

number

Promise<HtmlItem>

IItemChroma.setChromaLegacySaturation


setChromaLegacyThreshold: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:479

See: #core/IItemChroma#setChromaLegacyThreshold setChromaLegacyThreshold

number

Promise<HtmlItem>

IItemChroma.setChromaLegacyThreshold


setChromaRGBKeyExposure: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:521

See: #core/IItemChroma#setChromaRGBKeyExposure setChromaRGBKeyExposure

number

Promise<HtmlItem>

IItemChroma.setChromaRGBKeyExposure


setChromaRGBKeyPrimaryColor: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:501

See: #core/IItemChroma#setChromaRGBKeyPrimaryColor setChromaRGBKeyPrimaryColor

ChromaPrimaryColors

Promise<HtmlItem>

IItemChroma.setChromaRGBKeyPrimaryColor


setChromaRGBKeyThreshold: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:511

See: #core/IItemChroma#setChromaRGBKeyThreshold setChromaRGBKeyThreshold

number

Promise<HtmlItem>

IItemChroma.setChromaRGBKeyThreshold


setContrast: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:383

See: #core/IItemColor#setContrast setContrast

number

Promise<HtmlItem>

IItemColor.setContrast


setCropping: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:286

See: #core/IItemLayout#setCropping setCropping

Object

Promise<HtmlItem>

IItemLayout.setCropping

Item.setCropping


setCroppingEnhanced: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:291

See: #core/IItemLayout#setCroppingEnhanced setCroppingEnhanced

Object

Promise<HtmlItem>

IItemLayout.setCroppingEnhanced

Item.setCroppingEnhanced


setCustomCSS: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:161

See: #core/ISourceHtml#setCustomCSS setCustomCSS

string

Promise<HtmlItem>

ISourceHtml.setCustomCSS


setCustomName: () => Promise<Item>

Defined in: core/items/item.ts:753

See: #core/Source#setCustomName setCustomName

Promise<Item>

Item.setCustomName


setEnhancedResizeEnabled: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:311

See: #core/IItemLayout#setEnhancedResizeEnabled setEnhancedResizeEnabled

boolean

Promise<HtmlItem>

IItemLayout.setEnhancedResizeEnabled

Item.setEnhancedResizeEnabled


setEnhancedRotate: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:296

See: #core/IItemLayout#setEnhancedRotate setEnhancedRotate

number

Promise<HtmlItem>

IItemLayout.setEnhancedRotate

Item.setEnhancedRotate


setFileMask: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:710

See: #core/IItemEffect#setFileMask setFileMask

string

Promise<HtmlItem>

IItemEffect.setFileMask


setFilter: (value, config?) => Promise<HtmlItem>

Defined in: core/items/html.ts:722

See: #core/IItemEffect#setFilter setFilter

any

number

string

Promise<HtmlItem>

IItemEffect.setFilter


setFullDynamicColorRange: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:403

See: #core/IItemColor#setFullDynamicColorRange setFullDynamicColorRange

boolean

Promise<HtmlItem>

IItemColor.setFullDynamicColorRange


setHue: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:388

See: #core/IItemColor#setHue setHue

number

Promise<HtmlItem>

IItemColor.setHue


setKeepAspectRatio: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:301

See: #core/IItemLayout#setKeepAspectRatio setKeepAspectRatio

boolean

Promise<HtmlItem>

IItemLayout.setKeepAspectRatio

Item.setKeepAspectRatio


setKeepLoaded: (value) => Promise<Item>

Defined in: core/items/item.ts:778

See: #core/Source#setKeepLoaded setKeepLoaded

boolean

Promise<Item>

Item.setKeepLoaded


setKeyingType: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:425

See: #core/IItemChroma#setKeyingType setKeyingType

KeyingType

Promise<HtmlItem>

IItemChroma.setKeyingType


setMaskEffect: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:644

See: #core/IItemEffect#setMaskEffect setMaskEffect

MaskEffect

Promise<HtmlItem>

IItemEffect.setMaskEffect


setMute: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:624

See: #core/IAudio#setMute setMute

boolean

Promise<HtmlItem>

IAudio.setMute


setName: (value) => Promise<Item>

Defined in: core/items/item.ts:743

See: #core/Source#setName setName

string

Promise<Item>

Item.setName


setPosition: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:316

See: #core/IItemLayout#setPosition setPosition

Rectangle

Promise<HtmlItem>

IItemLayout.setPosition

Item.setPosition


setPositionLocked: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:306

See: #core/IItemLayout#setPositionLocked setPositionLocked

boolean

Promise<HtmlItem>

IItemLayout.setPositionLocked

Item.setPositionLocked


setRotateX: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:326

See: #core/IItemLayout#setRotateX setRotateX

number

Promise<HtmlItem>

IItemLayout.setRotateX

Item.setRotateX


setRotateY: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:321

See: #core/IItemLayout#setRotateY setRotateY

number

Promise<HtmlItem>

IItemLayout.setRotateY

Item.setRotateY


setRotateZ: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:331

See: #core/IItemLayout#setRotateZ setRotateZ

number

Promise<HtmlItem>

IItemLayout.setRotateZ

Item.setRotateZ


setSaturation: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:393

See: #core/IItemColor#setSaturation setSaturation

number

Promise<HtmlItem>

IItemColor.setSaturation


setShadowEffectBlur: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:686

See: #core/IItemEffect#setShadowEffectBlur setShadowEffectBlur

number

Promise<HtmlItem>

IItemEffect.setShadowEffectBlur


setShadowEffectColor: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:674

See: #core/IItemEffect#setShadowEffectColor setShadowEffectColor

Color

Promise<HtmlItem>


setShadowEffectOffsetX: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:698

See: #core/IItemEffect#setShadowEffectOffsetX setShadowEffectOffsetX

number

Promise<HtmlItem>

IItemEffect.setShadowEffectOffsetX


setShadowEffectOffsetY: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:704

See: #core/IItemEffect#setShadowEffectOffsetY setShadowEffectOffsetY

number

Promise<HtmlItem>

IItemEffect.setShadowEffectOffsetY


setShadowEffectOpacity: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:692

See: #core/IItemEffect#setShadowEffectOpacity setShadowEffectOpacity

number

Promise<HtmlItem>

IItemEffect.setShadowEffectOpacity


setShadowEffectThickness: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:680

See: #core/IItemEffect#setShadowEffectThickness setShadowEffectThickness

number

Promise<HtmlItem>

IItemEffect.setShadowEffectThickness


setStreamOnlyAudio: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:633

See: #core/IAudio#setStreamOnlyAudio setStreamOnlyAudio

boolean

Promise<HtmlItem>

IAudio.setStreamOnlyAudio


setTransition: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:575

See: #core/IItemTransition#setTransition setTransition

Transition

Promise<HtmlItem>

IItemTransition.setTransition


setTransitionTime: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:585

See: #core/IItemTransition#setTransitionTime setTransitionTime

number

Promise<HtmlItem>

IItemTransition.setTransitionTime


setTransparency: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:373

See: #core/IItemColor#setTransparency setTransparency

number

Promise<HtmlItem>

IItemColor.setTransparency


setURL: () => Promise<HtmlItem>

Defined in: core/items/html.ts:91

See: #core/ISourceHtml#setURL setURL

Promise<HtmlItem>

ISourceHtml.setURL


setValue: (value) => Promise<Item>

Defined in: core/items/item.ts:768

See: #core/Source#setValue setValue

string | XML

Promise<Item>

Item.setValue


setVisible: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:565

See: #core/IItemTransition#setVisible setVisible

boolean

Promise<HtmlItem>

IItemTransition.setVisible


setVolume: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:621

See: #core/IAudio#setVolume setVolume

number

Promise<HtmlItem>

IAudio.setVolume


showFileMaskingGuide: (value) => Promise<HtmlItem>

Defined in: core/items/html.ts:716

See: #core/IItemEffect#showFileMaskingGuide showFileMaskingGuide

boolean

Promise<HtmlItem>

IItemEffect.showFileMaskingGuide


static _emitter: EventEmitter

Defined in: core/items/item.ts:85

Item._emitter


static _subscriptions: any[] = []

Defined in: core/items/item.ts:86

Item._subscriptions

duplicate(options?): Promise<Item>

Defined in: core/items/item.ts:416

param: (options: {linked?:, scene?: })

return: Promise<Item>

Duplicate an item into the current scene or to a specified scene as Linked or Unlinked.

Linked items would generally have a single source, and any changes in the property of an item would be applied to all linked items.

Chainable

// item pertains to an actual Item instance
// Sample 1
item.duplicate() // duplicate selected item to the current scene as unlinked

Duplicate the selected item to a specific scene and set it to be linked to a single source with the original item.

// Sample 2
var toScene = xjs.Scene.getById(2)
item.duplicate({linked:true, scene:toScene})

boolean

number | Scene

Promise<Item>

Item.duplicate


getFPS(): Promise<number>

Defined in: core/items/item.ts:282

return: Promise

Get the frames rendered per second of an item

item.getFPS().then(function(fps) {
// The rest of your code here
});

Promise<number>

Item.getFPS


getParentItem(): Promise<Item>

Defined in: core/items/item.ts:587

return: Promise

Get the GroupItem that contains this item. This rejects if item is not a child item or non-existent

item.getParentItem()
.then(function(parentItem) {
console.log(parentItem);
});

Promise<Item>

Item.getParentItem


getSceneId(): Promise<string | number>

Defined in: core/items/item.ts:351

return: Promise<number|string>

Get (1-indexed) Scene ID where the source is loaded

source.getSceneId().then(function(id) {
// The rest of your code here
});

Promise<string | number>

Item.getSceneId


getSource(): Promise<Source>

Defined in: core/items/item.ts:530

return: Promise

Gets the Source of an item, linked items would only have 1 source.

Chainable

item.getSource().then(function(source) {
//Manipulate source here
source.setName('New Name')
})

Promise<Source>

Item.getSource


getView(): Promise<ViewTypes>

Defined in: core/items/item.ts:320

return: Promise

Get the view type of the item

item.getView().then(function(view) {
// view values:
// 0 = main view
// 1 = preview editor
// 2 = thumbnail preview
})

Promise<ViewTypes>

Item.getView


isChildItem(): Promise<boolean>

Defined in: core/items/item.ts:558

return: Promise

Checks if item is part of a group

item.isChildItem()
.then(function(isChild) {
console.log(isChild);
});

Promise<boolean>

Item.isChildItem


off(event, handler): void

Defined in: core/items/item.ts:224

param: (event: string, handler: Function)

Removes specificied event handler bound by on. Note that this can only be done for named function handlers.

let itemChange = function(...args) {
console.log('Item has changed');
}
let current;
let items;
xjs.Scene.getActiveScene()
.then( scene => {
current = scene;
return current.getItems();
}).then( list => {
items = list;
items[0].on('item-changed', itemChange);
setTimeout( ()=> {
items[0].off('item-changed', itemChange);
}, 10000);
});

string

Function

void

Item.off


on(event, handler): void

Defined in: core/items/item.ts:126

param: (event: string, handler: Function)

Allows listening to events per instance. Currently there are only two: item-changed and item-destroyed.

Item change is triggered thru any property change:

  • via js(source plugin/extension),
  • via visibility-toggling through the sources list,
  • or via the source properties dialog
let itemChange = function(...args) {
console.log('Item has changed');
}
let current;
let items;
xjs.Scene.getActiveScene()
.then( scene => {
current = scene;
return current.getItems();
}).then( list => {
items = list;
items[0].on('item-changed', itemChange);
});

Duplicate handlers are allowed.

string

Function

void

Item.on


remove(): Promise<boolean>

Defined in: core/items/item.ts:504

return: Promise

Removes selected item

item.remove()

Promise<boolean>

Item.remove


toXML(): XML

Defined in: core/items/item.ts:373

return: XML

Convert the Item object to an XML object. Use toString() to get the string version of the returned object.

var xml = item.toXML();

XML

Item.toXML


unlink(): Promise<Item>

Defined in: core/items/item.ts:486

return: Promise

Unlinks selected item.

Unlinks an item to the source of other linked items and renders its own source.

item.unlink()

Note: Once you unlink an Item, there’s still no method to reverse the process.

Promise<Item>

Item.unlink


static getAllSources(): Promise<Source[]>

Defined in: core/source/source.ts:220

return: Promise<Source[]>

Get all unique Source from every scene. Total number of Sources returned may be less than total number of items on all the scenes due to Linked items only having a single Source.

xjs.Source.getAllSources().then(function(sources) {
for(var i = 0 ; i < sources.length ; i++) {
if(sources[i] instanceof xjs.HtmlSource) {
// Manipulate HTML Source here
}
}
})

Promise<Source[]>

Item.getAllSources


static getCurrentSource(): Promise<Source>

Defined in: core/source/source.ts:108

return: Promise

Get the current source (when function is called by sources), or the source that was right-clicked to open the source properties window (when function is called from the source properties window)

xjs.Source.getCurrentSource().then(function(source) {
// This will fetch the current source (the plugin)
}).catch(function(err) {
// Handle the error here. Errors would only occur
// if we try to execute this method on Extension plugins
});

Promise<Source>

Item.getCurrentSource


static getItemList(): Promise<Item[]>

Defined in: core/items/item.ts:248

return: Promise<Item[]>

Gets the list of linked items of the current Item. Linked items are items linked to a single source.

xjs.Item.getItemList().then(function(items) {
for (var i = 0 ; i < items.length ; i++) {
// Manipulate each item here
items[i].setKeepAspectRatio(true);
}
})

This is simply a shortcut to: xjs.Item.getCurrentSource() -> source.getItemList()

Promise<Item[]>

Item.getItemList