Triggering events from an inner iFrame into the parent window

• Trigger events from inner Page

Trigger events from inner Page

This is the list of events we allow triggering from an inner page to our parent window.

const lpActions = {
	showLogin: () => window.parent.postMessage({ "banner-click": { action: 'show-login'}}, '*'),
    showJoin: () => window.parent.postMessage({ "banner-click": { action: 'show-join'}}, '*'),
    showDeposits: () => window.parent.postMessage({ "banner-click": { action: 'show-deposits'}}, '*'),
    showPayouts: () => window.parent.postMessage({ 'banner-click': { action: 'show-payouts' } }, '*'),
    showSports: () => window.parent.postMessage({ 'banner-click': { action: 'show-sport', params: { partnerProduct: 'prematch' } }}, '*'),
    showLiveBetting: () => window.parent.postMessage({ 'banner-click': { action: 'show-sport', params: { partnerProduct: 'live' } }}, '*')
};

In order to trigger one of those, you just copy-paste the object and use the corresponding code version for your programming choice.

/** VanillaJS

// Assuming the following html
<button id="login-trigger">Login</button>

// You'd have to attach an event listener like this:
<script>
  const loginButton = document.querySelector('#login-trigger');
  loginButton.addEventListener('click', () => {
    lpActions.showLogin();
  })
</script>

**/


// React Version
const myLPLoginButton = () => <button onClick={() => lpActions.showLogin())>I'm a login button</button>

// Angular Version
<button (click)={() => lpActions.showLogin())>I'm a login button</button>