Component APIs

360° Gallery

gwd-360gallery

A gallery object that shows an object rotating.

Properties

Name Description
images:string A comma separated string of image paths used in the gallery.
autoplay:boolean The gallery should automatically play through the images in the gallery after the gallery loads
wrap:boolean The gallery should allow the user to swipe around from the first frame to the last, instead of stopping at the ends

Events

Name Description
firstinteraction Sent when the user interacts with the gallery for the first time
allframesviewed Sent when all frames of the gallery are shown at least once
allframesloaded Sent when all frames of the gallery are loaded
frameshown Sent when a new frame is shown
frameactivated Sent when a new frame has started to be activated, even if it's not yet visible
frametap Sent when the user taps on a frame

Methods

Name Description
goToFrame(frame:number, opt_animate:string, opt_direction:string) Animate to the frame specified
rotateOnce(opt_duration:number, opt_direction:string) Rotate the object in the gallery once
goForwards() Moves gallery forwards by one frame
goBackwards() Moves gallery backwards by one frame
Add to Calendar

gwd-addtocalendar

Adds event to calendars.

Properties

Name Description
event-title:string The event name as it will be seen in the user's calendar
start-date:string The date the event begins
start-time:string The time the event starts (in 24-hour time)
end-date:string The date the event ends
end-time:string The time the event ends (in 24-hour time)
timezone:string The time zone for the event. When this is set, the time will be adjusted correctly for the user when the user is in another time zone
location:string The location of the event
description:string The description of the event
icalendar:boolean Whether an iCalendar file should be used or not
google:boolean Whether a Google Calendar should be used or not
windows-live:boolean Whether a Windows Live Calendar should be used or not
yahoo:boolean Whether a Yahoo Calendar should be used or not
bg-color:string Hexadecimal value for the background color of the drop-down
font-color:string Hexadecimal value for the font color of the drop-down
font-family:string Name for the font of the drop-down
font-size:string Size for the font of the drop-down
font-weight:string Font weight for the font of the drop-down
highlight-color:string Hexadecimal value for the highlight color of the drop-down
 
Audio

gwd-audio

A component that wraps an HTMLAudioElement

Properties

Name Description
autoplay:boolean Whether the audio should autoplay when loaded
loop:boolean Whether the audio should loop when completed
muted:boolean Whether the audio should start muted
controls:boolean Whether the default native player controls are enabled
sources:string A comma separated string of audios in different formats

Events

Name Description
play Sent when playback of the media starts after a prior pause event
pause Sent when playback is paused
playing Sent when the media begins to play (for the first time, after having been paused, or after ending and then restarting)
ended Sent when playback completes
volumechange Sent when the audio volume changes (both when the volume is set and when the muted attribute is changed)
seeked Sent when a seek operation completes
waiting Sent when the requested operation (such as playback) is delayed pending the completion of another operation (such as a seek)

Methods

Name Description
mute() Toggle to mute / unmute the audio
pause() Pauses the audio
play() Plays the audio
replay() Replays the audio
seek(time:number) Jumps to the specified time in the audio
Carousel Gallery

gwd-carouselgallery

A gallery object that shows its frames on a carousel style layout

Properties

Name Description
images:string A comma separated string of image paths used in the gallery
groups:string A comma separated string of group IDs
transition-duration:number Gallery animation speed in milliseconds
start-frame:number The number of the image you want to display initially
autoplay:boolean Whether to autoplay the frames once or not
has-navigation:boolean Whether to automatically include gallery navigation controls
navigation-thumbnails:boolean Whether thumbnails should be used for navigation instead of dots.
navigation-highlight:color A CSS color code used to highlight the active frame in navigation.
scaling:string How image content will be scaled to fit its frame.
frame-width:number The width of one content panel
frame-height:number The height of one content panel
neighbor-rotation-y:number A Y-axis rotation applied to neighbors of the currently centered panel. This is used to tilt the neighboring panels
neighbor-translation-x:number An X-axis translation applied to neighbors of the currently centered panel. Used to adjust placement of neighboring panels
neighbor-translation-y:number A Y-axis translation applied to neighbors of the currently centered panel
neighbor-translation-z:number A Z-axis translation applied to neighbors of the currently centered panel
exit-urls:string A comma separated string of exit URLs, corresponding to the images in the the gallery
show-reflection:boolean Whether to show a CSS3 based reflection
pause-front-media:boolean When the current frame changes, whether to pause media elements (e.g., video or audio) on the previous frame
resume-next-media:boolean When the current frame changes, whether to resume media elements (e.g., video or audio) on the new current frame

Events

Name Description
firstinteraction Sent when the user interacts with the gallery for the first time
allframesviewed Sent when all frames of the gallery have been shown at least once
allframesloaded Sent when all frames of the gallery are loaded
autoplayended Sent when autoplay has ended for any reason. event.detail.completed will be true if it ended naturally by reaching the intended duration elapsing, else it will be false
frameshown Sent when a new frame is shown
frameactivated Sent when a new frame has started to be activated, even if it's not yet visible
frameautoplayed Sent when a frame is activated for autoplay. This may trigger more often than 'frame shown', because it will be fired separately for each of multiple frames that are visible at once
frametap Sent when the user taps on a frame
reachleftend Sent when the gallery reaches its left end
reachrightend Sent when the gallery reaches its right end
trackstart Sent when the mouse or touch drag begins
track The component registers the X and Y location data associated with the mouse or touch drag
trackend Sent when the mouse or touch drag ends

Methods

Name Description
goToFrame(index:number, opt_animate:string) Go to the frame specified
goForwards(opt_animate:string) Go to the next frame if available
goBackwards(opt_animate:string) Go to the previous frame
rotateOnce(opt_duration:number, opt_direction:string) Show every frame in the gallery once
stopRotation() Halts current automatic rotation
Gallery Navigation

gwd-gallerynavigation

A navigation control for a GWD gallery component.

Properties

Name Description
for:string A comma separated string of image paths used in the gallery
highlight:color A CSS color code used to highlight the active frame in navigation
use-thumbnails:boolean Whether thumbnails should be used for navigation instead of dots
Generic Ad

gwd-genericad

Implements the Generic Ad container

Events

Name Description
adinitialized Dispatched just before the Generic element renders the ad's content.

Methods

Name Description
initAd() Starts the ad upon receiving the appropriate events from Enabler
goToPage(opt_pageId:string, opt_transition:string, opt_duration:number, opt_easing:string, opt_direction:string) Navigates to the expanded dimensions of the ad. If a page id is not specified, the ad navigates to the default page
exit(url:string, opt_collapseOnExit:boolean, opt_pageId:string) Exits the Ad and optionally collapses the ad
Gesture

gwd-gesture

Abstraction for a number of gesture events

Properties

Name Description
touch-action:string How the touch action should be interpreted. Valid values are: auto, none, pan-x, and pan-y. Default behavior is the same as it is set to none.

Events

Name Description
hover Sent when the mouse or touch location enters the component boundary
hoverend Sent when the mouse or touch location leaves the component boundary
trackstart Sent when the mouse or touch drag begins
track The component registers the X and Y location data associated with the mouse or touch drag
trackend Sent when the mouse or touch drag ends
tap Sent when a use tap or mouse click is registered
swipeleft Sent when the user swipes left
swiperight Sent when the user swipes right
swipeup Sent when the user swipes up
swipedown Sent when the user swipes down
Google Ad

gwd-google-ad

Implements the Google ad container

Properties

Name Description
polite-load:boolean Whether this Ad must respect the polite loading semantics
fullscreen:boolean Whether this ad should attempt to expand fullscreen or not

Events

Name Description
adinitialized Sent just before the element renders the Ad's content.
expandstart Sent when the enabler fires expand start event
expandfinish Sent when the enabler fires expand finish event
collapsestart Sent when the enabler fires collapse start event
collapsefinish Sent when the enabler fires collapse finish event
fullscreensupport Sent if fullscreen expansion is supported

Methods

Name Description
initAd() Starts the Ad upon receiving the appropriate events from Enabler
goToPage(opt_pageId:string, opt_transition:string, opt_duration:number, opt_easing:string, opt_direction:string) Navigates to the expanded dimensions of the ad. If a page id is not specified, the Ad navigates to the default page
exit(exitId:string, url:string, opt_collapseOnExit:boolean, opt_pauseMedia:boolean, opt_pageId:string) Exits the Ad and optionally collapses the Ad
exitOverride(exitId:string, url:string, opt_collapseOnExit:boolean, opt_pauseMedia:boolean, opt_pageId:string) Exits the Ad to the specified URL regardless of the value defined in Studio. Collapses the Ad if opt_collapseOnExit is true
incrementCounter(metric:string, opt_isCumulative:boolean) Tracks a counter event
startTimer(timerId:string) Starts an event timer
stopTimer(timerId:string) Stops an event timer
reportManualClose() Records a manual closing of a floating, pop-up, expanding, in-page with pop-up, or in-page with floating ad. This method is a proxy for Enabler.reportManualClose
 
IFrame

gwd-iframe

A component that wraps an HTMLIframeElement

Properties

Name Description
source:string The source of the iframe. This replaces the src attribute on the native Image element
scrolling:string Whether the iframe should display scrollbars.

Events

Name Description
iframeload Sent when the iframe is loaded

Methods

Name Description
setUrl(url:string) Changes the url of the iframe and loads it right away
 
Image

gwd-image

A component that wraps an HTMLImageElement to support deferred loading of the image source

Properties

Name Description
source:file The source of the image. This replaces the src attribute on the native Image element
alt:string The alternate text for the image
scaling:string Defines how the image will be scaled to fit its frame
alignment:string How the image should align within the viewing area
Image Button

gwd-imagebutton

An image button with support for up/over/down states.

Properties

Name Description
up-image:file The URL for the image of the button in the unpressed state
over-image:file The URL for the image of the button in the mouseover or hover state
down-image:file The URL for the image of the button in the pressed state
bgcolor:string The background color of the button
alignment:string How the image should align within the viewing area
scaling:string How the image should fit in the parent container
disabled:boolean Whether the button should be disabled

Events

Name Description
imagebuttonloaded Sent when all the images have loaded

Methods

Name Description
toggleEnable() Toggles between enabled / disabled.
setImages(upSrc:string, opt_overSrc:string, opt_downSrc:string) Sets the image sources for all button states.
Map

gwd-map

Extends HTMLElement to wrap Google Maps api calls

Properties

Name Description
api-key:string Google API key. See: https://developers.google.com/maps/documentation/javascript/get-api-key
query:string Search query name for returning locations from the Google Places API. Required if no fusion table ID
start-latitude:decimal Starting center latitude coordinate. Value should be between -90 and 90 (degrees)
start-longitude:decimal Starting center longitude coordinate. Value should be between -180 and 180 (degrees)
request-user-location:boolean Whether the user location must be requested. If set to true, the user will be prompted to share the location
fusion-table-id:string The ID of a public fusion table
client-id:string The Maps premier client ID
search-radius:number Minimum radius in which to conduct a location search, in meters
result-limit:number The maximum number of results to return in a single query
start-zoom:number Starting zoom level, in units used by the Google Maps API. Default is 16, which is at the neighborhood level
marker-src:string Placemarker image filename, as a sprite containing the off, on, and shadow components
gps-src:string GPS location blue dot image filename
msg-start-position-prompt:string Localization string for the dialog prompt text to select a start position
msg-gps-button-label:string Localization string for the label of the button which retrieves a the users location from the geolocation API
msg-manual-position-button-label:string Localization string for the label of the button which brings up a location search field
msg-manual-position-prompt:string Localization string for the dialog prompt text to search for a starting map position
msg-manual-position-placeholder:string Localization string for the placeholder text of the search box for finding a starting map position.
msg-geocode-failure:string Localization string for the dialog prompt text shown when an attempt to use the geolocation API fails
msg-no-results-found:string Localization string for the dialog prompt text shown when no map results were found in the chosen location

Events

Name Description
pinclick When the user selects a pin on the map

Methods

Name Description
setCenter(latitude:number, longitude:number, opt_accuracy:number) Sets the center of the map to the location specified by lat/lon
 
Page

gwd-page

A Page represents a single card in the page deck

Properties

Name Description
expanded:boolean Whether this page should be considered as an expanded page (Ad specific)
centered:boolean Whether the contents of this page should be centered
alt-orientation-page:string The page ID of the page that better represents this content in the alternate orientation

Events

Name Description
attached Sent just after the page is attached to the DOM
detached Sent just after the page is removed from the DOM
pageactivated Sent when the page is ready to be displayed
pagedeactivated Sent when the page is no longer being displayed
pageload Sent after page's contents have loaded successfully
pagepresenting Sent just before the page begins its intro animation
shake Sent when a device shake gesture is detected
tilt Sent when a device tilt is detected
rotatetoportrait Sent when a device is rotated to portrait orientation
rotatetolandscape Sent when a device is rotated to landscape orientation
Page Deck

gwd-pagedeck

A PageDeck is a container of pages. It shows one page at a time and different pages may be cycled to the front in any given order and using any of the supported page transitions.

Properties

Name Description
default-page:string ID of the default page.

Events

Name Description
pagetransitionstart Sent before a page transition occurs
pagetransitionend Sent after a page transition completes

Methods

Name Description
goToNextPage(opt_loop:boolean, opt_type:string, opt_duration:number, opt_easing:string, opt_direction:string) Navigates to the next page in the page deck
goToPreviousPage(opt_loop:boolean, opt_type:string, opt_duration:number, opt_easing:string, opt_direction:string) Navigates to the previous page in the page deck
goToPage(pageId:string, opt_type:string, opt_duration:number, opt_easing:string, opt_direction:string) Navigates to the specified page in the page deck
getCurrentPage() Returns the current page, or null if a page is not shown
getDefaultPage() Returns the default page if specified, otherwise returns the first page
getPage(pageId:string) Returns the page with the specified ID
findPageIndexByAttributeValue(attributeName:string, value:string|number|boolean) Returns the page element with the value of the attribute equal to the specified value or -1 if a page was not found
getOrientationSpecificPage(orientation:string, pageId:string) Returns the page corresponding to the specified orientation
getElementById(id:string) Finds the element with the specified id across all pages in this pagedeck. Since gwd-pagedeck only keeps the active page in the DOM, the standard document.getElementById(id) will not return the elements in the inactive pages. It is a common use case, especially in dynamic ads, to refer to elements in inactive pages. In such cases, this method can be used to dereference an element by its id

Examples

Going to the next page in your ad after a two second pause

This code example presumes you have at least two pages in your ad. Then you can create an event to change pages every 2 seconds like this:

  • Target - Choose the page. The first page will be page1.
  • Event - Choose Page > Ready to present the page
  • Action - Choose customAction > Add custom action

In the Custom Code dialog, name your function, In this case, you might use a name such as turnpage. Then use the following code:

setTimeout(nextPage, 2000);
function nextPage() {
   document.getElementById('pagedeck').goToNextPage();
}

Then add the same event to each page using the same custom action.

SpriteSheet

gwd-spritesheet

Show single keyframe or animation from spritesheet

Properties

Name Description
imagesource:file The URL for the sprite sheet image
offsetx:number

The offset, in pixels, from the left side of the sprite sheet to either:

  • the left edge of the specific image you want to use from the sprite sheet
  • the left edge of the first sprite image you're using to create an animation
offsety:number

The offset, in pixels, from the top of the sprite sheet to either:

  • the top edge of the specific image you want to use from the sprite sheet
  • the top edge of the first sprite image you're using to create an animation
clipwidth:number

The width, in pixels, of either:

  • the specific image you want to use from the sprite sheet
  • the first sprite image you're using to create an animation
clipheight:number

The height, in pixels, of either:

  • the specific image you want to use from the sprite sheet
  • the first sprite image you're using to create an animation
alignment:string Determines the position of the image within its container
scaling:string Determines how various sized images are displayed within the component
totalframecount:number The number of frames that make up the animation
duration:number The duration of each frame, in milliseconds
loopcount:number The number of times the animation repeats. Set to 0 for infinite repeat
autoplay:boolean Whether the animation plays automatically
endonstartframe:boolean Whether the animation ends on the initial frame.
reverseplay:boolean Whether the animation plays in reverse

Events

Name Description
animationend Sent when the animation ends
animationpause Sent when the animation is paused
animationplay Sent when the animation starts to play
animationrestart Sent when the animation is restarted after a pause

Methods

Name Description
newAnimation(offsetx:number, offsety:number, clipwidth:number, clipheight:number, totalframecount:number, duration:number, loopcount:number, autoplay:boolean, reverseplay:boolean) Defines a new animation
play() Plays the animation
pause() Pauses the animation
togglePlay() Switch animation between play and pause
restart() Restarts the animation
previousFrame() Shows the previous frame
nextFrame() Shows the next frame
goToFrame(id:number) Shows a specific frame by frame number
Street View

gwd-streetview

A Google Street View Component

Properties

Name Description
key:string For information about obtaining a unique key for your application, see: https://developers.google.com/maps/documentation/javascript/get-api-key.
latitude:decimal The location latitude value
longitude:decimal The location longitude value
interaction:boolean Whether view can be panned/rotated
heading:decimal Indicates the compass heading of the camera. Accepted values are from 0 to 360 (both values indicating North, with 90 indicating East, and 180 South). If no heading is specified, a value will be calculated that directs the camera towards the specified location, from the point at which the closest photograph was taken.
pitch:decimal Specifies the up or down angle of the camera relative to the Street View vehicle. This is often, but not always, flat horizontal. Positive values angle the camera up (with 90 degrees indicating straight up); negative values angle the camera down (with -90 indicating straight down).
zoom:number Specifies the zoom of the camera relative to the Street View vehicle.
Swipeable Gallery

gwd-swipegallery

A gallery object that shows its frames in a swipeable content strip.

Properties

Name Description
images:string A comma separated string of image paths used in the gallery
groups:string A comma separated string of group IDs
transition-duration:number The gallery animation speed in milliseconds
start-frame:number One-based frame to start at
num-frames-to-display:number The number of frames to display at once
frame-snap-interval:number The number of frames to advance by after each swipe
autoplay:boolean Whether to automatically rotate the gallery once
has-navigation:boolean Whether to include gallery navigation controls
navigation-thumbnails:boolean Whether thumbnails should be used for navigation instead of dots
navigation-highlight:color A CSS color code used to highlight the active frame in navigation
scaling:string How image content will be scaled to fit its frame
swipe-axis:string The axis in which swipe is detected
offset:number The amount of empty space between adjacent content frame.
frame-width:number The width of one content frame. Overrides num-frames-to-display
frame-height:number The height of one content frame
autoplay-duration:number The total duration for which to autoplay the frames
autoplay-step-interval:number The interval between each frame step during autoplay
exit-urls:string A comma separated string of exit URLs, corresponding to the images in the the gallery
disable-gesture:boolean Hides/disables the gesture component which enables touch navigation of the gallery
pause-front-media:boolean When the current frame changes, whether to pause media elements (e.g., video or audio) on the previous frame
resume-next-media:boolean When the current frame changes, whether to resume media elements (e.g., video or audio) on the new current frame

Events

Name Description
firstinteraction Sent when the user interacts with the gallery for the first time
allframesviewed Sent when all frames of the gallery were shown at least once
allframesloaded Sent when all frames of the gallery are loaded
autoplayended Sent when autoplay has ended for any reason. event.detail.completed will be true if it ended naturally by reaching the intended duration elapsing, else it will be false
frameshown Sent when a new frame is shown, after any necessary animations have completed
frameactivated Sent when a new frame has started to be activated, even if it's not yet visible
frameautoplayed Sent when a frame is activated for autoplay. This may trigger more often than 'frame shown', because it will be fired separately for each of multiple frames that are visible at once
frametap Sent when the user taps on a frame
reachleftend Sent when the gallery reaches its left end
reachrightend Sent when the gallery reaches its right end
framemouseover Sent when the user moves the mouse over a frame
framemouseout Sent when the user moves the mouse out of a frame
trackstart Sent when the mouse or touch drag begins
track The component registers the X and Y location data associated with the mouse or touch drag
trackend Sent when the mouse or touch drag ends

Methods

Name Description
goToFrame(frame:number, opt_animate:string) Goes to the frame specified
rotateOnce(opt_duration:number, opt_direction:string) Shows every frame in the gallery once
stopRotation() Halts current automatic rotation
goForwards() Moves gallery forwards by one frame
goBackwards() Moves gallery backwards by one frame

Examples

Showing a caption for each frame in a swipeable gallery

This code example lets you create captions for each image in a swipeable gallery. This presumes that you've placed a swipeable gallery component with the ID gwd-swipegallery_1 (which is the default) on stage, and have added images to the component.

For the captions, you'll also need to create a Div element, and give it the ID caption-div. Then create an event like this:

  • Target - Choose the Swipeable gallery which should have the ID gwd-swipegallery_1
  • Event - Choose Swipeable Gallery > Frame shown
  • Action - Choose customAction > Add custom action

In the Custom Code dialog, name your function, In this case, you might use a name such as showcaption. Then use the following code:

var gallery = document.getElementById('gwd-swipegallery_1');
var div = document.getElementById('caption-div');
var text = {
  1: "The text for frame 1",
  2: "The text for frame 2",
  3: "The text for frame 3"
};
div.textContent = text[gallery.currentIndex];
Tap Area

gwd-taparea

Abstraction for click / tap event

Properties

Name Description
exit-override-url:string The URL to exit to when the Tap Area is tapped.

Events

Name Description
action Sent when the user touches (mobile) or clicks (desktop) the button
Tap to Call / Text

gwd-taptocall

A component that, when clicked or touched, will call or send an SMS to the configured telephone number.

Properties

Name Description
number:string Telephone number to call or message.
action:string Choose to send an SMS message or initiate a phone call

Events

Name Description
action Sent when the user touches (mobile) or clicks (desktop) the button
taptocall Sent when a call or SMS is being initiated

Methods

Name Description
dial() Initiates the call or sends an SMS message to the configured number
Video

gwd-video

A component that wraps an HTMLVideoElement

Properties

Name Description
autoplay:boolean Whether the video should autoplay when loaded
loop:boolean Whether the video should loop when completed
muted:boolean Whether the video should start muted
controls:boolean Whether the default native player controls are enabled
sources:file A comma separated string of videos in different formats
poster:string A URL indicating a poster frame to show until the user plays or seeks

Events

Name Description
play Sent when playback of the media starts after having been paused; that is, when playback is resumed after a prior pause event
pause Sent when playback is paused
playing Sent when the media begins to play (either for the first time, after having been paused, or after ending and then restarting)
ended Sent when playback completes
volumechange Sent when the audio volume changes (both when the volume is set and when the muted attribute is changed)
seeked Sent when a seek operation completes
waiting Sent when the requested operation (such as playback) is delayed pending the completion of another operation (such as a seek)

Methods

Name Description
mute() Toggle to mute / unmute the video
pause() Pauses the video
play() Plays the video
replay() Replays the video
seek(time:number) Jumps to the specified time in the video
setVolume(volume:number) Set the volume of the video
setSources(sources:string) Set the sources for the video

Examples

Unmuting a video each time it's played

To unmute a video each time it's played, create an event like this:

  • Target - Choose the video you want to control. If you have one video, the default ID will be gwd-video_1
  • Event - Choose Video > play after pause
  • Action - Choose customAction > Add custom action

In the Custom Code dialog, name your function, In this case, you might use a name such as mutebtn. Then use the following code:

if (document.getElementById('gwd-video_1').muted) {
  document.getElementById('gwd-video_1').mute();
}
YouTube

gwd-youtube

Extends HTMLElement to wrap YouTube API calls

Properties

Name Description
video-url:string The YouTube URL for the video
autoplay:string For supported environments, the YouTube video will autoplay upon loading
preview-duration:number Set the duration of the preview. Used only when autoplay attribute is set to 'preview'
controls:string Displays the video controls ('none', 'autohide')
color:string The color theme of the player progress bar (red or white)
muted:boolean Whether the video should start muted
annotations:boolean Shows the annotations for the video
related:boolean Shows related videos once the video is complete
loop:boolean Whether the video should loop when completed
pause-on-end:boolean Pauses the video when there is 1 second left
title:boolean Show title/uploader before video plays
start-position:number Start the video at a given time (seconds)
allowfullscreen:boolean Allow fullscreen on desktop
extra-player-args:string Additional YouTube player parameters as described in https://developers.google.com/youtube/player_parameters?playerVersion=HTML5#Parameters

Events

Name Description
buffering The YouTube player is buffering
ended The YouTube video has reached the end
paused The YouTube video is paused
playing The YouTube video starts playing
replayed The YouTube video has been replayed
viewed0percent Sent when 0% of the video has been viewed
viewed25percent Sent when 25% of the video has been viewed
viewed50percent Sent when 50% of the video has been viewed
viewed75percent Sent when 75% of the video has been viewed
viewed100percent Sent when 100% of the video has been viewed
previewed0percent Sent when 0% of the preview has been viewed
previewed25percent Sent when 25% of the preview has been viewed
previewed50percent Sent when 50% of the preview has been viewed
previewed75percent Sent when 75% of the preview has been viewed
previewed100percent Sent when 100% of the preview has been viewed

Methods

Name Description
toggleMute() Toggle to mute / unmute the video
pause() Pauses the video
play() Plays the video
replay() Replays the video
seek(time:number) Jumps to the specified time in the video
setYouTubeId(id:string, opt_cueOnly:boolean) Changes the source of the YouTube video to the specified ID.
Was this article helpful?
How can we improve it?