@smoud/playable-sdk 1.0.0

package/dist/index.js

@@ -0,0 +1,631 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  default: () => sdk,
+  sdk: () => sdk
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/events.ts
+var registeredEvents = {};
+function onEvent(event, fn, context, once) {
+  let listeners = registeredEvents[event];
+  if (!listeners) {
+    listeners = registeredEvents[event] = {
+      list: []
+    };
+  }
+  listeners.list.push(fn, context || null, once || false);
+}
+function offEvent(event, fn, context) {
+  const listeners = registeredEvents[event];
+  if (!listeners) return;
+  var fnArray = listeners.list;
+  if (!fn) {
+    fnArray.length = 0;
+  } else {
+    let i = fnArray.length;
+    while (i > 0) {
+      i -= 3;
+      if (fnArray[i] == fn && (context !== void 0 || fnArray[i + 1] == context)) {
+        fnArray.splice(i, 3);
+      }
+    }
+  }
+  if (fnArray.length == 0) {
+    delete registeredEvents[event];
+  }
+}
+function emitEvent(event, a1, a2, a3) {
+  var listeners = registeredEvents[event];
+  if (!listeners) return;
+  const fnArray = listeners.list;
+  const len = arguments.length;
+  let fn, ctx;
+  for (var i = 0; i < fnArray.length; i += 3) {
+    fn = fnArray[i];
+    ctx = fnArray[i + 1];
+    if (fnArray[i + 2]) {
+      fnArray.splice(i, 3);
+      i -= 3;
+    }
+    if (len <= 1) fn.call(ctx);
+    else if (len == 2) fn.call(ctx, a1);
+    else if (len == 3) fn.call(ctx, a1, a2);
+    else fn.call(ctx, a1, a2, a3);
+  }
+  if (fnArray.length == 0) {
+    delete registeredEvents[event];
+  }
+}
+
+// src/protocols.ts
+var uid = 0;
+var NONE = uid++;
+var MRAID = uid++;
+var DAPI = uid++;
+var NUCLEO = uid++;
+var FACEBOOK = uid++;
+var GOOGLE = uid++;
+var MINTEGRAL = uid++;
+var TAPJOY = uid++;
+var TIKTOK = uid++;
+var actualProtocol = NONE;
+function isMraid() {
+  return actualProtocol === MRAID;
+}
+function isDapi() {
+  return actualProtocol === DAPI;
+}
+function isNucleo() {
+  return actualProtocol === NUCLEO;
+}
+function isFacebook() {
+  return actualProtocol === FACEBOOK;
+}
+function isGoogle() {
+  return actualProtocol === GOOGLE;
+}
+function isMintegral() {
+  return actualProtocol === MINTEGRAL;
+}
+function isTapjoy() {
+  return actualProtocol === TAPJOY;
+}
+function isTikTok() {
+  return actualProtocol === TIKTOK;
+}
+function ensureProtocol() {
+  if ("mraid" === AD_PROTOCOL) {
+    try {
+      mraid.getState();
+      actualProtocol = MRAID;
+    } catch (error) {
+    }
+  } else if ("dapi" === AD_PROTOCOL) {
+    try {
+      dapi.isReady();
+      actualProtocol = DAPI;
+    } catch (error) {
+    }
+  } else if ("facebook" === AD_NETWORK) {
+    try {
+      if (FbPlayableAd) actualProtocol = FACEBOOK;
+    } catch (error) {
+    }
+  } else if ("google" === AD_NETWORK) {
+    try {
+      if (ExitApi) actualProtocol = GOOGLE;
+    } catch (error) {
+    }
+  } else if ("mintegral" === AD_NETWORK) {
+    if (window.gameReady) actualProtocol = MINTEGRAL;
+  } else if ("tapjoy" === AD_NETWORK) {
+    if (window.TJ_API) actualProtocol = TAPJOY;
+  } else if ("tiktok" === AD_NETWORK) {
+    if (window.openAppStore) actualProtocol = TIKTOK;
+  }
+}
+
+// src/core.ts
+var destinationUrl = /android/i.test(navigator.userAgent) ? GOOGLE_PLAY_URL : APP_STORE_URL;
+var isSDKInitialized = false;
+var isProtocolInitialized = false;
+var isForcePaused = false;
+var isInstallClicked = false;
+var initCallback = () => {
+};
+function bootAd() {
+  if (sdk.isReady) return;
+  emitEvent("boot");
+  document.body.oncontextmenu = function() {
+    return false;
+  };
+  initCallback(sdk.maxWidth, sdk.maxHeight);
+  emitEvent("ready");
+  sdk.isReady = true;
+}
+function changeVolume(value) {
+  emitEvent("volume", value);
+}
+function handlePause() {
+  changeVolume(0);
+  sdk.isPaused = true;
+  emitEvent("pause");
+}
+function handleResume() {
+  if (isForcePaused) return;
+  changeVolume(sdk.volume);
+  sdk.isPaused = false;
+  emitEvent("resume");
+}
+function mraidIsViewable(viewable) {
+  if ("mraid" !== AD_PROTOCOL) return;
+  if (viewable) {
+    if (sdk.isReady) {
+      handleResume();
+    } else {
+      if (AD_NETWORK == "ironsource") {
+        const maxSize = mraid.getMaxSize();
+        sdk.maxWidth = Math.floor(maxSize.width);
+        sdk.maxHeight = Math.floor(maxSize.height);
+      }
+      bootAd();
+    }
+  } else {
+    handlePause();
+  }
+}
+function dapiIsViewable(event) {
+  if ("dapi" !== AD_PROTOCOL) return;
+  if (event.isViewable) {
+    if (sdk.isReady) {
+      handleResume();
+    } else {
+      var screenSize = dapi.getScreenSize();
+      screenSize.width = Math.floor(screenSize.width);
+      screenSize.height = Math.floor(screenSize.height);
+      bootAd();
+    }
+  } else {
+    handlePause();
+  }
+}
+function fireResizeEvent(width, height) {
+  handleResize(width, height);
+}
+function startMraidProtocol() {
+  if ("mraid" !== AD_PROTOCOL) return;
+  if (!isProtocolInitialized) {
+    mraid.removeEventListener("ready", startMraidProtocol);
+    mraid.addEventListener("viewableChange", function() {
+      var isViewable = mraid.isViewable();
+      mraidIsViewable(isViewable);
+    });
+    if (mraid.isViewable() || AD_NETWORK == "adcolony") {
+      mraidIsViewable(true);
+    }
+    mraid.addEventListener("audioVolumeChange", function(newVolume) {
+      if (newVolume !== null) {
+        if (newVolume > 0) {
+          changeVolume(sdk.volume);
+        } else {
+          changeVolume(0);
+        }
+      }
+    });
+    mraid.addEventListener("error", function(t, e) {
+      console.log("mraid error: " + t + "   action: " + e);
+    });
+    mraid.addEventListener("sizeChange", function() {
+      var maxSize = mraid.getMaxSize();
+      fireResizeEvent(maxSize.width, maxSize.height);
+    });
+    isProtocolInitialized = true;
+  }
+}
+function startDapiProtocol() {
+  if ("dapi" !== AD_PROTOCOL) return;
+  if (!isProtocolInitialized) {
+    dapi.removeEventListener("ready", startDapiProtocol);
+    var isAudioEnabled = !!dapi.getAudioVolume();
+    dapi.addEventListener("audioVolumeChange", function(volume) {
+      var isAudioEnabled2 = !!volume;
+      if (isAudioEnabled2) {
+        changeVolume(sdk.volume);
+      } else {
+        changeVolume(0);
+      }
+    });
+    dapi.addEventListener("adResized", function(event) {
+      var maxSize = dapi.getScreenSize();
+      fireResizeEvent(event.width || maxSize.width, event.height || maxSize.height);
+    });
+    if (dapi.isViewable()) {
+      dapiIsViewable({ isViewable: true });
+    }
+    dapi.addEventListener("viewableChange", dapiIsViewable);
+    isProtocolInitialized = true;
+  }
+}
+function startDefaultProtocol() {
+  if ("none" !== AD_PROTOCOL) return;
+  if (!isProtocolInitialized) {
+    if ("mintegral" === AD_NETWORK) {
+      window.mintGameStart = function() {
+        handleResume();
+        handleResize(sdk.maxWidth, sdk.maxHeight);
+      };
+      window.mintGameClose = function() {
+        handlePause();
+      };
+    }
+    document.addEventListener("visibilitychange", () => {
+      if (document.visibilityState === "visible") {
+        if (sdk.isReady) {
+          handleResume();
+        } else {
+          bootAd();
+        }
+      } else {
+        handlePause();
+      }
+    });
+    if (document.readyState === "complete" || document.visibilityState === "visible") {
+      bootAd();
+    } else {
+      window.addEventListener("load", () => {
+        bootAd();
+      });
+    }
+    window.addEventListener("resize", function() {
+      handleResize();
+    });
+    if ("tapjoy" === AD_NETWORK && isTapjoy()) {
+      var tapjoyApi = {
+        skipAd: function() {
+          try {
+            sdk.finish();
+          } catch (e) {
+            console.warn("Could not skip ad! | " + e);
+          }
+        }
+      };
+      window.TJ_API.setPlayableAPI && window.TJ_API.setPlayableAPI(tapjoyApi);
+    }
+    isProtocolInitialized = true;
+  }
+}
+function finishTapjoy() {
+  window.TJ_API.objectiveComplete && window.TJ_API.objectiveComplete();
+  window.TJ_API.playableFinished && window.TJ_API.playableFinished();
+  window.TJ_API.gameplayFinished && window.TJ_API.gameplayFinished();
+}
+function handleResize(width, height) {
+  sdk.maxWidth = Math.floor(width || window.innerWidth);
+  sdk.maxHeight = Math.floor(height || window.innerHeight);
+  sdk.isLandscape = sdk.maxWidth > sdk.maxHeight;
+  emitEvent("resize", sdk.maxWidth, sdk.maxHeight);
+}
+var isListeningToTouchEvents = false;
+var isTouchEventRegistered = false;
+function onUserInteraction(event) {
+  if (typeof TouchEvent !== "undefined" && event instanceof TouchEvent) {
+    isListeningToTouchEvents = true;
+  }
+  if (isListeningToTouchEvents && event instanceof MouseEvent) return;
+  sdk.interactions += 1;
+  emitEvent("interaction", sdk.interactions);
+}
+function registerTouchHandlers() {
+  if (!isTouchEventRegistered) {
+    document.addEventListener("mousedown", onUserInteraction);
+    document.addEventListener("touchstart", onUserInteraction);
+    isTouchEventRegistered = true;
+  }
+}
+var _sdk = class _sdk {
+  /**
+   * Initializes the SDK and sets up protocol-specific handlers.
+   * This must be called as earlier as possible.
+   * 
+   * @param callback Optional function called when ad container is ready
+   * @example
+   * // Basic initialization
+   * sdk.init();
+   * 
+   * // Initialization with callback
+   * sdk.init((width, height) => {
+   *   new App(width, height)
+   * });
+   * 
+   * @fires init When initialization starts
+   * @fires boot When the ad begins booting
+   * @fires ready When Ad Network is ready and playable ad can be initialized
+   */
+  static init(callback) {
+    if (isSDKInitialized) return;
+    ensureProtocol();
+    if (callback) initCallback = callback;
+    if ("mraid" === AD_PROTOCOL && isMraid()) {
+      if (mraid.getState() !== "ready" && "adcolony" !== AD_NETWORK) {
+        mraid.addEventListener("ready", startMraidProtocol);
+      } else {
+        startMraidProtocol();
+      }
+    } else if ("dapi" === AD_PROTOCOL && isDapi()) {
+      window.addEventListener("load", function() {
+        dapi.isReady() ? startDapiProtocol() : dapi.addEventListener("ready", startDapiProtocol);
+      });
+    } else {
+      startDefaultProtocol();
+    }
+    emitEvent("init");
+    isSDKInitialized = true;
+  }
+  /**
+   * Starts the playable ad experience.
+   * Should be called after all resources are loaded and first frame is rendered.
+   * 
+   * @example
+   * // Call just after all resources are preloaded and first frame is rendered
+   * sdk.start();
+   * 
+   * @fires start When the playable ad starts
+   * @fires resize When the ad container is initially sized
+   */
+  static start() {
+    if (_sdk.isStarted) return;
+    _sdk.isStarted = true;
+    emitEvent("start");
+    registerTouchHandlers();
+    if ("mintegral" === AD_NETWORK && isMintegral()) {
+      _sdk.resize();
+      handlePause();
+      window.gameReady && window.gameReady();
+    } else {
+      if ("tapjoy" === AD_NETWORK && isTapjoy()) {
+        window.TJ_API.setPlayableBuild({
+          orientation: this.isLandscape ? "landscape" : "portrait",
+          buildID: __BUILD_ID__
+        });
+      }
+      _sdk.resize();
+    }
+  }
+  /**
+   * Marks the playable ad as finished.
+   * This triggers network-specific completion handlers.
+   * 
+   * @example
+   * // Call when game/experience is complete
+   * sdk.finish();
+   * 
+   * @fires finish When the playable ad is marked as finished
+   */
+  static finish() {
+    _sdk.isFinished = true;
+    if ("tapjoy" === AD_NETWORK && isTapjoy()) {
+      finishTapjoy();
+    } else if ("mintegral" === AD_NETWORK && isMintegral()) {
+      window.gameEnd && window.gameEnd();
+    } else if ("vungle" === AD_NETWORK) {
+      parent.postMessage("complete", "*");
+    }
+    emitEvent("finish");
+  }
+  /**
+   * Triggers a retry/restart of the playable ad.
+   * Behavior varies by ad network.
+   * 
+   * @example
+   * // Allow user to try again
+   * retryButton.onclick = () => sdk.retry();
+   * 
+   * @fires retry When a retry is triggered
+   */
+  static retry() {
+    if ("mintegral" === AD_NETWORK && isMintegral()) {
+      window.gameRetry && window.gameRetry();
+    } else if ("nucleo" === AD_PROTOCOL && isNucleo()) {
+      NUC.trigger.tryAgain();
+    }
+    emitEvent("retry");
+  }
+  /**
+   * Triggers the install/download action for the advertised app.
+   * Handles different store opening methods across ad networks.
+   * 
+   * @example
+   * // Call when user wants to install
+   * installButton.onclick = () => sdk.install();
+   * 
+   * @fires finish If the ad hasn't been marked as finished
+   * @fires install When the install action is triggered
+   */
+  static install() {
+    if (!_sdk.isFinished) {
+      _sdk.isFinished = true;
+      let timeout = 0;
+      if ("tapjoy" === AD_NETWORK && isTapjoy()) {
+        finishTapjoy();
+        timeout = 300;
+      }
+      emitEvent("finish");
+      setTimeout(function() {
+        _sdk.install();
+      }, timeout);
+      return;
+    }
+    if (isInstallClicked) return;
+    isInstallClicked = true;
+    setTimeout(function() {
+      isInstallClicked = false;
+    }, 500);
+    emitEvent("install");
+    if ("mraid" === AD_PROTOCOL && isMraid()) {
+      mraid.openStoreUrl ? mraid.openStoreUrl() : mraid.open(destinationUrl);
+    } else if ("dapi" === AD_PROTOCOL && isDapi()) {
+      dapi.openStoreUrl();
+    } else if ("nucleo" === AD_PROTOCOL && isNucleo()) {
+      NUC.trigger.convert(destinationUrl);
+    } else if ("facebook" == AD_NETWORK && isFacebook()) {
+      FbPlayableAd.onCTAClick();
+    } else if ("vungle" == AD_NETWORK) {
+      parent.postMessage("download", "*");
+    } else if ("google" == AD_NETWORK && isGoogle()) {
+      ExitApi.exit();
+    } else if ("mintegral" === AD_NETWORK && isMintegral()) {
+      window.install && window.install();
+    } else if ("tapjoy" === AD_NETWORK && isTapjoy()) {
+      window.TJ_API.click();
+    } else if ("tiktok" === AD_NETWORK && isTikTok()) {
+      window.openAppStore();
+    } else {
+      window.open(destinationUrl);
+    }
+  }
+  /**
+   * Trigger force resize event
+   * Useful when container size changes need to be manually propagated.
+   * 
+   * @example
+   * sdk.resize();
+   * 
+   * @fires resize With current maxWidth and maxHeight
+   */
+  static resize() {
+    handleResize(_sdk.maxWidth, _sdk.maxHeight);
+  }
+  /**
+   * Forces the playable ad into a paused state.
+   * 
+   * @example
+   * // Pause the experience
+   * pauseButton.onclick = () => sdk.pause();
+   * 
+   * @fires pause When the ad enters paused state
+   */
+  static pause() {
+    if (!isForcePaused) {
+      isForcePaused = true;
+      handlePause();
+    }
+  }
+  /**
+   * Resumes the playable ad from a forced pause state.
+   * Only works if the ad was paused via sdk.pause().
+   * 
+   * @example
+   * // Resume from pause
+   * resumeButton.onclick = () => sdk.resume();
+   * 
+   * @fires resume When the ad resumes from pause
+   */
+  static resume() {
+    if (isForcePaused) {
+      isForcePaused = false;
+      handleResume();
+    }
+  }
+  /**
+   * Registers an event listener.
+   * 
+   * @param event Name of the event to listen for
+   * @param fn Callback function to execute when event occurs
+   * @param context Optional 'this' context for the callback
+   * 
+   * @example
+   * // Listen for user interactions
+   * sdk.on('interaction', (count) => {
+   *   console.log(`User interaction #${count}`);
+   * });
+   * 
+   * // Listen for resize with context
+   * sdk.on('resize', function(width, height) {
+   *   this.updateLayout(width, height);
+   * }, gameInstance);
+   */
+  static on(event, fn, context) {
+    onEvent(event, fn, context);
+  }
+  /**
+   * Registers a one-time event listener that removes itself after execution.
+   * 
+   * @param event Name of the event to listen for
+   * @param fn Callback function to execute when event occurs
+   * @param context Optional 'this' context for the callback
+   * 
+   * @example
+   * // Listen for first interaction only
+   * sdk.once('interaction', () => {
+   *   console.log('First user interaction occurred!');
+   * });
+   */
+  static once(event, fn, context) {
+    onEvent(event, fn, context, true);
+  }
+  /**
+   * Removes an event listener.
+   * 
+   * @param event Name of the event to stop listening for
+   * @param fn Optional callback function to remove (if not provided, removes all listeners for the event)
+   * @param context Optional 'this' context to match when removing
+   * 
+   * @example
+   * // Remove specific listener
+   * const handler = () => console.log('Interaction');
+   * sdk.off('interaction', handler);
+   * 
+   * // Remove all listeners for an event
+   * sdk.off('interaction');
+   */
+  static off(event, fn, context) {
+    offEvent(event, fn, context);
+  }
+};
+/** Current version of the SDK */
+_sdk.version = "1.0.0";
+/** Current maximum width of the playable ad container in pixels */
+_sdk.maxWidth = Math.floor(window.innerWidth);
+/** Current maximum height of the playable ad container in pixels */
+_sdk.maxHeight = Math.floor(window.innerHeight);
+/** Indicates if the current orientation is landscape (width > height) */
+_sdk.isLandscape = window.innerWidth > window.innerHeight;
+/** Indicates if the Ad Network is ready and playable ad can be initialized */
+_sdk.isReady = false;
+/** Indicates if all playable ad resources are loaded and gameplay has started */
+_sdk.isStarted = false;
+/** Indicates if the playable ad is currently paused */
+_sdk.isPaused = false;
+/** Indicates if the playable ad has finished */
+_sdk.isFinished = false;
+/** Current volume level (0-1) */
+_sdk.volume = 1;
+/** Number of user interactions with the playable ad */
+_sdk.interactions = 0;
+var sdk = _sdk;
+window.PlayableSDK = sdk;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  sdk
+});

package/package.json

@@ -0,0 +1,81 @@
+{
+  "name": "@smoud/playable-sdk",
+  "version": "1.0.0",
+  "description": "It's unified Playable SDK that supports MRAID, Google, Facebook, Vungle, and many more Ad Networks, simplifying playable ad development with a standardized interface for seamless cross-network compatibility.",
+  "main": "dist/index.js",
+  "module": "dist/esm/index.js",
+  "browser": "dist/iife/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    "import": "./dist/esm/index.js",
+    "require": "./dist/index.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/smoudjs/playable-sdk.git"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "defines.d.ts"
+  ],
+  "scripts": {
+    "build": "npx tsup src/index.ts --format esm,cjs,iife --out-dir dist --legacy-output --dts --clean",
+    "test": "jest"
+  },
+  "author": "Smoud",
+  "license": "MIT",
+  "devDependencies": {
+    "@types/jest": "^29.5.14",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "ts-jest": "^29.2.5",
+    "tsup": "^8.4.0",
+    "typescript": "^5.7.2"
+  },
+  "bugs": {
+    "mail": "peter.hutsul@gmail.com",
+    "url": "https://github.com/smoudjs/playable-sdk/issues"
+  },
+  "homepage": "https://github.com/smoudjs/playable-sdk",
+  "keywords": [
+    "playable",
+    "sdk",
+    "playable-sdk",
+    "PlayableSDK",
+    "playable-ads",
+    "html5",
+    "html5-playable",
+    "playable-ad-sdk",
+    "playable-ads-sdk",
+    "html5-playable-ads",
+    "interactive-ads",
+    "ads",
+    "ad-sdk",
+    "ad-network",
+    "ad-monetization",
+    "mraid",
+    "mraid-sdk",
+    "google-ads",
+    "facebook-playable",
+    "unity-ads",
+    "vungle",
+    "ironsource",
+    "mintegral",
+    "tiktok-ads",
+    "pangle-sdk",
+    "applovin",
+    "chartboost",
+    "adcolony",
+    "snapchat-ads",
+    "appreciate-ads",
+    "liftoff",
+    "mytarget",
+    "javascript-sdk",
+    "typescript-sdk",
+    "game-ad-sdk",
+    "html5-sdk",
+    "interactive-ads",
+    "playable-ads-engine"
+  ]
+}