Skip to main content

Reveal Methods

The Reveal component allows you to create interactive experiences where users can participate to discover outcomes. The methods below provide programmatic control over the Reveal component's behavior, allowing you to lock/unlock participation, select outcomes, and manage the participation lifecycle.

caution

Breaking changes were made on October 26, 2022. Please check if you are using the following deprecated calls and change them to the new format:

// Deprecated
revealComponentSelectOutcome('reveal_123', { outcomeName: 'Outcome 1'});
revealComponentSelectOutcome('reveal_123', 'Outcome 1');
// Deprecated
revealComponentResetOutcome('reveal_123');
revealComponentResetParticipation('reveal_123');

revealComponentLock

Lock pre-reveal content so user cannot participate. Use this to gate or limit participation based on some custom logic.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component to lock

Example

window.wyng['_WYNG_ID_'].revealComponentLock('reveal_123');

revealComponentUnlock

Unlock pre-reveal content so user can start to participate. Use this to gate or limit participation based on some custom logic.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component to unlock

Example

window.wyng['_WYNG_ID_'].revealComponentUnlock('reveal_123');

revealComponentSelectOutcome

Select a specific outcome to display to the user. If the Outcome selection mode is "random", outcomeName is not required and will be ignored if present. If the Outcome selection mode is "custom", outcomeName is required.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component
outcomeNamestring - optionalThe name of the outcome to display (for custom mode)

Example

window.wyng['_WYNG_ID_'].revealComponentSelectOutcome('reveal_123', 'Outcome 1');

revealComponentGetOutcome

Access information about the outcome displayed to the user.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component

Example

window.wyng['_WYNG_ID_'].revealComponentGetOutcome('reveal_123');

revealComponentStartParticipation

Start the participation phase for a reveal component. Can be called only when a component is unlocked. This will change the component state to 'IN_PROGRESS' and send the relevant SDK and metrics events. Can be used for starting participation via SDK when you are using Custom pre-reveal or Spin-to-Win.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component
optionsobject - optionalOptions object containing additional settings

Example

window.wyng['_WYNG_ID_'].revealComponentStartParticipation('reveal_123', {'outcomeName': 'Outcome 1'});

revealComponentStopParticipation

Stop the participation phase and display an outcome via SDK. This will change the component state to 'STOPPED', send the relevant SDK and metrics events, display an outcome, and update the participation state in Local Storage. This can be called for any pre-reveal type.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component

Example

window.wyng['_WYNG_ID_'].revealComponentStopParticipation('reveal_123');

revealComponentResetParticipation

Reset outcome and participation state in Local Storage to allow a user to participate again.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component

Example

window.wyng['_WYNG_ID_'].revealComponentResetParticipation('reveal_123');

revealComponentSpinWheelAndStop

Spin the wheel and show the outcome. This is an alias wrapping revealComponentStartParticipation for convenience when using Spin-to-Win pre-reveal.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component
optionsobject - requiredOptions object
options.speednumber - optionalSpeed of the wheel spin
options.durationnumber - optionalDuration of the spin in milliseconds

Example

window.wyng['_WYNG_ID_'].revealComponentSpinWheelAndStop('reveal_123', { speed: 3, duration: 5000 });

revealComponentIsLocked

Check the lock/unlock status of the Reveal component.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component

Example

window.wyng['_WYNG_ID_'].revealComponentIsLocked('reveal_123');

revealComponentSetScratchOffImage

Set a new overlay image for "Scratch Off" style Reveal components.

Arguments

ArgumentTypeDescription
componentIdstring - requiredThe id of the reveal component
urlstring - requiredURL of the new overlay image
widthnumber - requiredWidth of the overlay image in pixels
heightnumber - requiredHeight of the overlay image in pixels

Example

window.wyng['_WYNG_ID_'].revealComponentSetScratchOffImage({ 
componentId: 'reveal_123',
url: 'https://example.com/overlay.png',
width: 600,
height: 400
});