Explore os métodos e eventos Metaframe

Objeto window.metaframe

Quando o script é carregado, o objeto metaframe está disponível no objeto global window do seu aplicativo. O objeto metaframe contém uma lista de métodos necessários para gerenciar o Metaframe no seu aplicativo web.

Método window.metaframe.create

Método de assinatura:

 1window.metaframe.create: (parameters: {
 2 loginProjectId: string,
 3 merchantId?: number,
 4 projectId?: number,
 5 orbsApiHostId?: string,
 6 isMobile?: boolean,
 7 isCollapsed?: boolean,
 8 layoutSettings?: {
 9     desktop: {
10       widgetMarginTop?: number,
11     },
12     mobile: {
13       widgetMarginTop?: number,
14     },
15   },
16}) => void;

Inicializa o Metaframe no seu aplicativo web.

Método window.metaframe.setIsMobile

Método de assinatura:

1window.metaframe.setIsMobile(isMobile: boolean)

Troca o Metaframe da versão desktop para a versão móvel, ou vice-versa.

Objeto window.metaframe.partnerActions

O objeto contém métodos para acionar ações no Metaframe.

Antes de usar os métodos desse objeto, você deve garantir que o Metaframe seja totalmente carregado. Para fazer isso, inscreva-se no evento de carregamento Metafraem. Se o evento foi processado, os métodos do objeto ficarão disponíveis.

Exemplo de configuração de um ouvinte ao evento de carregamento do Metaframe:

1window.addEventListener("@metaframe-partner-events:app-loaded", () => {
2
3 //Here you can use partner actions
4
5});

Método window.metaframe.partnerActions.openBackpackItemPage

Método de assinatura:

1openBackpackItemPage: (itemId: string) => void;

Abre a página para um item especificado na seção Backpack.

Para que o método funcione corretamente, as seguintes condições devem ser cumpridas:

• A função Backpack deve estar ativada na Conta de Distribuidor.
• O usuário deve estar autenticado no Metaframe.

Método window.metaframe.partnerActions.openLogin

Método de assinatura:

1openLogin: () => void;

Abre o formulário de autorização do usuário. Se o usuário já está autorizado, é exibido um erro no console do navegador.

Método window.metaframe.partnerActions.openProfile

Método de assinatura:

1openProfile: () => void;

Abre seção Profile para o usuário atual. Se o usuário não for autorizado, um erro é exibido no console do navegador.

Métodos window.metaframe.partnerActions.openWallet

Método de assinatura:

1openWallet: () => void;

Abre a seção Wallet para o usuário atual. Se o usuário não for autorizado, um erro é exibido no console do navegador.

Método window.metaframe.partnerActions.openBackpack

Método de assinatura:

1openBackpack: () => void;

Abra a seção Backpack para o usuário atual. Se o usuário não for autorizado, um erro é exibido no console do navegador.

Método window.metaframe.partnerActions.openCustomMiniApp

Método de assinatura:

1openCustomMiniApp: (params: {miniAppName: string}) => void;

Abre a seção personalizada especificada com o tipo Iframe se uma das seguintes condições for cumprida:

• Se a opção Show this app before user login estiver ativa nas configurações da seção personalizada especificada, e o usuário atual não estiver autorizado.
• Se a opção Show this app after user login estiver ativa nas configurações da seção personalizada especificada, e o usuário atual estiver autorizado.

Se as condições não forem cumpridas, é exibido um erro no console do navegador.

Métodos window.metaframe.partnerActions.pushNotification

Método de assinatura:

1pushNotification: (params: {
2  type: string; // use “success”, “warning”, “error” or “info”
3  text: string;
4  button?: {
5    text: string;
6    onClick: () => void;
7  };
8  durationInMs?: number;
9}) => void;

Coloca uma nova notificação no stack de notificações.

Método window.metaframe.partnerActions.setIsCustomMiniAppVisible

Método de assinatura:

1setIsCustomMiniAppVisible: (params: {
2  miniAppName: string;
3  isVisible: boolean;
4}) => void;

Mostra ou esconde a seção personalizada especificada.

Eventos do Widget

Você pode inscrever-se nos seguintes eventos Metaframe:

Rastreamento de eventos de seções personalizadas

Você pode adicionar ao Metaframe uma seção personalizada com o tipo Action. Essa seção aparece como um botão que realiza uma ação ao ser acionado, tal como abrir um site.

Para rastrear o evento de clicar em uma seção personalizada, você precisa se inscrever ao evento @metaframe:custom-action:<ACTION_ID>, onde <ACTION_ID> é o ID de ação gerado na Conta de Distribuidor ao configurar uma seção personalizada.

Exemplo de configuração de um ouvinte para um evento de clique de seção personalizada:

1document.addEventListener("@metaframe:custom-action:00000000-0000-0000-0000-000000000000", () => {
2
3 // Your code here...
4
5})