Skip to content

UI Actions ​

Use ui.actions to connect the platform's call-to-action buttons (login, subscribe, share…) to your site's own modals or flows.


js
MindtrainingPlatform.init('mindtraining', {
  ui: {
    mode: 'web', // 'web' (default) | 'app'
    actions: {
      shouldShowAccessPaywall: function (context) {
        // Return true to continue to the SDK paywall.
        // Return false to stay on the current screen and run the matching host action.
        return context.mode === 'web'
      },
      openLogin: function () {
        // open your login modal
      },
      openRegister: function () {
        // open your registration modal
      },
      openSubscribe: function () {
        // open your subscription page or modal
      },
      openUrl: function (url) {
        window.open(url, '_blank')
      },
      share: function (payload) {
        // payload: { url?: string, title?: string }
        navigator.share({ url: payload.url, title: payload.title })
      },
    },
  },
})

shouldShowAccessPaywall runs when a user selects a blocked game from Home or Subhome. Returning true continues to the blocked route and shows the SDK paywall. Returning false stays on the current screen and calls the matching host action: openLogin for login_required, or openSubscribe for subscription and usage limits.

The callback receives { action, mode, surface, reason, limit, gameType, variant }. If it is omitted, throws, or returns false without a matching host action, the integration keeps its existing behavior or safely continues to the SDK paywall. Opening a blocked route directly always renders the SDK paywall, and buttons inside that paywall always call openLogin, openRegister, or openSubscribe directly.

ui.mode provides host integration context to the callback. It does not hide or compact SDK headers by itself.

Back Navigation ​

showBackNavigation is an optional top-level boolean that controls the visibility of in-app back navigation buttons. It defaults to true.

Set it to false when the host provides its own back/forward navigation:

js
MindtrainingPlatform.init('mindtraining', {
  showBackNavigation: false,
})

This hides back buttons in the game, subhome, archive, statistics, and page-based game panels. It does not disable browser history or change navigation events, access rules, or the controls used to close dialogs and drawers.

The host must provide a way to return from these screens. To show the buttons again without remounting the platform:

js
MindtrainingPlatform.updateConfig({ showBackNavigation: true })

Unrelated updateConfig() calls preserve the current value. setConfig() replaces the configuration, so omitting this option resets it to true.

Color scheme ​

ui.colorScheme selects the color palette on sites with color scheme support enabled. Supported sites include Entrenamentes and Le Monde.

  • 'light' (default): forces the light palette.
  • 'dark': forces the dark palette.
  • 'system': follows the device preference through prefers-color-scheme and responds to changes while the platform is mounted.

Set the initial preference when mounting the platform:

js
MindtrainingPlatform.init('mindtraining', {
  ui: { colorScheme: 'system' },
})

The host can change it at runtime without remounting:

js
MindtrainingPlatform.updateConfig({ ui: { colorScheme: 'dark' } })
MindtrainingPlatform.updateConfig({ ui: { colorScheme: 'light' } })
MindtrainingPlatform.updateConfig({ ui: { colorScheme: 'system' } })

The platform does not add theme buttons or selectors; the host controls the preference and any UI used to change it. This property is independent of ui.mode ('web' / 'app'). Sites without color scheme support keep their existing presentation.

Unrelated updateConfig() calls preserve the selected preference. setConfig() replaces the configuration, so omitting ui.colorScheme returns to 'light'.

Light and dark palettes are edited separately in the admin. Existing configurations initially use the same colors for both modes, so selecting dark mode does not automatically darken the palette; customize its colors in the admin.

Game screen visibility ​

These optional top-level booleans default to true in supported game layouts.

showMobileGameHeader: false hides the mobile title/date bar below the game controls. The desktop title and game controls stay visible.

showOtherGames: false hides the other-games section below the board at every container width, including its reserved space. Directories on other screens and completion recommendations are unaffected.

Both options are independent of ui.mode and access permissions. Layouts without support keep their existing presentation.

js
MindtrainingPlatform.init('mindtraining', {
  showMobileGameHeader: false,
  showOtherGames: false,
})

Use updateConfig() to change either option without remounting. Unrelated updates preserve both values. setConfig() replaces the configuration; omitted options reset to true.

js
MindtrainingPlatform.updateConfig({
  showMobileGameHeader: true,
  showOtherGames: true,
})

Child sites inherit these options from their parent game layout unless they explicitly override that behavior.

All sites inherit the optional ui.actions.navigate callback. It receives a serializable request before SDK navigation. It works in both web and app modes. Navigation interception.

Client integration documentation maintained in-repo.