AppLixir Sample

### Sample HTML5 Integration with Button Click Source: https://support.applixir.com/download-samples-and-other-sdk-support-items A complete HTML5 integration example. It includes a button to trigger an ad, an anchor div for the player, and grants a reward upon ad completion. Ensure to reconcile rewards with your server webhook. ```html AppLixir Sample ``` -------------------------------- ### HTML5 SDK Installation Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/overview-html-integration-360055393693 Add this script tag to the `` of your HTML page to include the AppLixir SDK. It is recommended to pin to a specific version like `v6.1.0` for stable updates. ```html ``` -------------------------------- ### Initialize and Play Ad in Android App Source: https://support.applixir.com/applixir-integration/android-app-integration/applixir-ads-android-sdk-5418083969687 Example of initializing the AppLixirAdPlayer and playing an ad when a button is clicked. Ensure you replace 'APPLIXIR_API_KEY' with your actual API key. The callback will be invoked upon ad completion. ```kotlin class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { TestApplixirAdsSDKLibraryTheme { Scaffold( modifier = Modifier .fillMaxSize() .systemBarsPadding() // replaces enableEdgeToEdge() ) { innerPadding -> Box( modifier = Modifier .fillMaxSize() .padding(innerPadding), contentAlignment = Alignment.Center ) { Button(onClick = { val player = AppLixirAdPlayer(this@MainActivity) player.setApiKey("APPLIXIR_API_KEY") player.playAd(this@MainActivity) { println("Ad completed") } }) { Text("Open Ad", fontSize = 18.sp) } } } } } } } ``` -------------------------------- ### Declare Event Handler in Start Method Source: https://support.applixir.com/applixir-integration/cocos-integration/the-integration-4409722907671 In the start method, register an event listener for 'ApplixirStatusChange' to handle updates from the AppLixir SDK. This ensures your game reacts to ad status changes. ```typescript Start () { this.applixir?,node.on(“ApplixirStatusChange”, this.onApplixirStatusUpdate, this); } ``` -------------------------------- ### Clone AppLixir iOS SDK Repository Source: https://support.applixir.com/applixir-integration/ios-app-integration/applixir-ads-ios-integration-360054041033 Clone the AppLixir iOS SDK repository to your local machine to get started. ```bash cd existing_repo git remote add origin https://github.com/applixirinc/iOS-sdk git branch -M main git push -uf origin main ``` -------------------------------- ### Initialize and Control Player with Application Class Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/step-3-initializing-video-ad-360053982853 Utilize the Application class for a more structured approach to initializing and controlling the video ad player. This method allows for better management of the player's lifecycle. Ensure all prerequisites are met, create an Application instance, and call initialize() on window load before opening the player. ```javascript ``` -------------------------------- ### Initialize and Open Player with initializeAndOpenPlayer Function Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/step-3-initializing-video-ad-360053982853 Use this function for a straightforward initialization and immediate opening of the video ad player. Ensure the Applixir script and necessary div element are included, and replace placeholder values with your actual API key and injection element ID. Define callback functions for ad status and error handling. ```javascript ``` -------------------------------- ### Initialize and Show Ad Source: https://support.applixir.com/hc/article_attachments/11974265793815 Call this function after the SDK is loaded to initialize the ad player. Provide your API key and a callback function to handle ad completion and reward granting. ```javascript initializeAndOpenPlayer({ apiKey: "xxxx-xxxx-xxxx-xxxx", adStatusCallbackFn: (s) => s === "ad-watched" && grantReward() }); ``` -------------------------------- ### JavaScript Function to Get Error Details Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/local-callback-error-codes This JavaScript snippet demonstrates how to access the `getError()` function from the Applixir player to retrieve detailed error information when an error occurs. It shows the structure of the returned object, including the error type, code, message, and any inner error details. ```javascript { getError: () => { return { data: { type: "adsRequestNetworkError" | "assetFallbackFailed" | "autoplayDisallowed" | "companionAdLoadingFailed" | "companionRequiredError" | "consentManagementProviderNotReady" | "failedToRequestAds" | "invalidAdTag" | "invalidArguments" | "nonlinearDimensionsError" | "overlayAdLoadingFailed" | "overlayAdPlayingFailed" | "protectedAudienceApiError" | "streamInitializationFailed" | "unknownAdResponse" | "unknownError" | "unsupportedUrl" | "vastAssetNotFound" | "vastEmptyResponse" | "vastLinearAssetMismatch" | "vastLoadTimeout" | "vastMalformedResponse" | "vastMediaLoadTimeout" | "vastNoAdsAfterWrapper" | "vastNonlinearAssetMismatch" | "vastProblemDisplayingMediaFile" | "vastSchemaValidationError" | "vastTooManyRedirects" | "vastTraffickingError" | "vastUnexpectedDurationError" | "vastUnexpectedLinearity" | "vastUnsupportedVersion" | "vastWrapperError" | "videoPlayError" | "vpaidError", errorCode: number, errorMessage: string, innerError: string, }, }; } } ``` -------------------------------- ### Initialize and Play Video Ad (v6 SDK) Source: https://support.applixir.com/frequently-asked-questions/integration-questions/applixir-integration-faq-360053980273 Call this JavaScript function to initialize the AppLixir player and display a video ad. Use the `adStatusCallbackFn` to handle ad completion events and grant rewards. ```javascript initializeAndOpenPlayer({ apiKey: "xxxx-xxxx-xxxx-xxxx", adStatusCallbackFn: (status) => { if (status.type === "complete") grantReward(); } }); ``` -------------------------------- ### Initialize AppLixirAdPlayer Source: https://support.applixir.com/applixir-integration/ios-app-integration/applixir-ads-ios-integration-360054041033 Initialize the AppLixirAdPlayer instance to begin using the SDK. ```swift let adPlayer = AppLixirAdPlayer() ``` -------------------------------- ### Configure Ad Options with User and Custom Data Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/overview-html-integration-360055393693 Set up ad options including API key, injection element, user ID, and custom session data. Use the adStatusCallbackFn to handle ad completion and trigger UI updates. ```javascript const options = { apiKey: "xxxx-xxxx-xxxx-xxxx", injectionElementId: "applixir-ad-container", userId: "player-7890", customData: { sessionId, levelId }, adStatusCallbackFn: (status) => { if (status.type === "complete") optimisticRewardUi(); } }; ``` -------------------------------- ### HTML5 Web SDK Integration Source: https://support.applixir.com/download-samples-and-other-sdk-support-items Integrate the v6 Web SDK directly from the CDN by including the script tag. Initialize the player with your API key and handle ad status callbacks. ```html ``` -------------------------------- ### Preload Ad for Instant Reveal Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/overview-html-integration-360055393693 Preload an ad ahead of user interaction for a faster reveal time. The preloadAd function takes similar options to initializeAndOpenPlayer and returns a handle with a show method. Each handle is single-use; preloading must be called again after each show. ```javascript const ad = await preloadAd({ apiKey: "xxxx-xxxx-xxxx-xxxx", injectionElementId: "applixir-ad-container", adStatusCallbackFn: (status) => { if (status.type === "complete") grantReward(); }, }); watchButton.addEventListener("click", () => ad.show()); ``` -------------------------------- ### Include AppLixir JavaScript Library Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/step-2-adding-an-anchor-360053188754 Add this script tag to the body of your HTML file to load the AppLixir library. This is necessary for the Reward Video functionality to work. ```javascript ``` -------------------------------- ### Preload Ad for Instant Reveal Source: https://support.applixir.com/frequently-asked-questions/best-practices-ad-serving/applixir-best-practices-360056835154 Use `preloadAd()` to pre-load an ad before the user clicks to watch. This prevents 'ad lag' and ensures an instant reveal. Enable the button only after an ad is confirmed ready. ```javascript applixir.preloadAd(); // Enable button only when ad is ready ``` -------------------------------- ### Lightweight HTML5/Web Integration Source: https://support.applixir.com/frequently-asked-questions/best-practices-ad-serving/applixir-best-practices-360056835154 For HTML5 and web integrations, keep the AppLixir SDK integration lightweight. The v6 SDK is designed to be minimal. ```javascript // The v6 SDK is three lines — don't over-wrap. ``` -------------------------------- ### Handle No-Ad Gracefully Source: https://support.applixir.com/frequently-asked-questions/best-practices-ad-serving/applixir-best-practices-360056835154 If `preloadAd()` does not return a ready ad within 2-3 seconds, hide the offer to prevent users from seeing a non-functional call-to-action. ```javascript // If preloadAd() doesn't return a ready ad within 2-3 seconds, hide the offer. ``` -------------------------------- ### Load AppLixir SDK v6 Source: https://support.applixir.com/hc/article_attachments/11974265793815 Include this script tag in your HTML to load the AppLixir v6 SDK from their CDN. This makes the SDK functions available in your project. ```html ``` -------------------------------- ### Passing Context to Web Callback Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/step-4-setting-up-local-callback-360053188774 Pass userId and customData in the player initialization options to include them in the web callback payload for reward attribution. ```javascript window.invokeApplixirVideoUnit({ appKey: "YOUR-API-KEY", userId: "player-7890", customData: { level: 12, sessionId: "abc-123" }, // ... other options }); ``` -------------------------------- ### Set AppLixir API Key Source: https://support.applixir.com/applixir-integration/ios-app-integration/applixir-ads-ios-integration-360054041033 Set your unique AppLixir API key for ad playback. ```swift adPlayer.setApiKey("Your API key") ``` -------------------------------- ### Rewarded Video Ad Status Callback Function Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/overview-html-integration-360055393693 Implement this function to handle lifecycle events of the rewarded video ad. The reward should only be granted when the status type is 'complete'. ```javascript adStatusCallbackFn: (status) => { if (status.type === "complete") { grantReward(); } } ``` -------------------------------- ### HTML5 Ad Container Source: https://support.applixir.com/hc/article_attachments/11974265793815 Add this div to your HTML to serve as the anchor for the ad player. Ensure it is present before loading the SDK. ```html ``` -------------------------------- ### Persistent 'Watch Ad' Button Keep-Alive Pattern Source: https://support.applixir.com/applixir-integration/integration-for-html5-sites-apps/overview-html-integration-360055393693 This pattern keeps an ad preloaded for users who have a persistent 'Watch Ad' button visible. It refreshes the ad periodically to stay ahead of the bid TTL and also refreshes if the tab becomes visible after a period of inactivity. Includes a fallback to initialize the player directly if no ad handle is available. ```javascript let adHandle = null; let lastRefresh = 0; async function refreshAd() { try { adHandle = await preloadAd(options); lastRefresh = Date.now(); } catch (e) { adHandle = null; } } refreshAd(); // first render setInterval(refreshAd, 4 * 60 * 1000); // stay ahead of TTL document.addEventListener("visibilitychange", () => { if (document.visibilityState === "visible" && Date.now() - lastRefresh > 60_000) refreshAd(); }); watchBtn.addEventListener("click", () => { if (adHandle) adHandle.show(); else initializeAndOpenPlayer(options); // slow-path fallback }); ``` -------------------------------- ### Preload Rewarded Video Ad Source: https://support.applixir.com/frequently-asked-questions Preload an ad before the user requests it to prevent lag. Enable the button only when the ad is ready. If the ad is not ready within a few seconds, hide the offer. ```javascript preloadAd(); // Enable button only when ad is ready // If not ready within 2-3 seconds, hide offer ``` -------------------------------- ### Play AppLixir Ad Source: https://support.applixir.com/applixir-integration/ios-app-integration/applixir-ads-ios-integration-360054041033 Play an ad using the AppLixir Ads SDK. Requires a UIViewController to present the ad. ```swift adPlayer.playAd(from: self) ``` -------------------------------- ### Insert Applixir Ad Shortcode Source: https://support.applixir.com/applixir-integration/wordpress-integration/step-4-inserting-the-ad-11792673584791 Use this shortcode to insert the Applixir video ad into your WordPress page content. It is recommended to place it after some initial content to encourage user engagement. ```html [insert-Applixir] ``` -------------------------------- ### Add Applixir Ads SDK Dependency Source: https://support.applixir.com/applixir-integration/android-app-integration/applixir-ads-android-sdk-5418083969687 Add this dependency to your app's build.gradle file to include the Applixir Ads SDK. ```gradle dependencies { implementation("com.init.applixiradssdk:applixiradssdk:1.1.0") } ```