Playable ad best practices

Consider the following when configuring your playable assets.

mraid.open

mraid.open

To redirect a user on click, use the mraid.open method with the URL string for your game's app store page.

case "Android":mraid.open("https://play.google.com/store/apps/details?id=yourgame"); break;

case "iOS":mraid.open("https://itunes.apple.com/us/yourgame?mt=8");

Bootstrap

Bootstrap

Consider the following example of how to initialize the playable ad.

// Wait for the SDK to become ready: 
function Start() {
    if (mraid.getState()==='loading') {
        // If the SDK is still loading, add a listener for the 'ready' event:
        mraid.addEventListener('ready', onSdkReady);
        // Otherwise, if the SDK is ready, execute your function:
    } else {
        onSdkReady(); 
    }
}

// Implement a function that shows the ad when it first renders:
function onSdkReady() {
    // The viewableChange event fires if the ad container's viewability status changes.
    // Add a listener for the viewabilityChange event, to handle pausing and resuming: 
    mraid.addEventListener('viewableChange',viewableChangeHandler);
	// The isViewable method returns whether the ad container is viewable on the screen.
    if (mraid.isViewable()) {
        // If the ad container is visible, play the ad:
        showMyAd(); 
    }
}

// Implement a function for executing the ad:
function showMyAd() {
    // Insert code for showing your playable ad. 
}

// Implement a function that handles pausing and resuming the ad based on visibility:
function viewableChangeHandler(viewable) {
    if(viewable) {
        // If the ad is viewable, show the ad:
        showMyAd(); 
    } else {
        // If not, pause the ad.
    }
}