Referência do SDK

O SDK tem um único ponto de entrada, ScalarcutTiling.mount(target, options). Devolve um handle que pode usar para conduzir o widget depois de carregar.

mount(target, options)

const planner = ScalarcutTiling.mount('#sc-tiling', {
  widgetKey: 'YOUR_WIDGET_KEY',
  // ... options below
});

target é uma string de seletor CSS ou um Element. O widget renderiza num novo iframe dentro dele.

Opções

Opção	Tipo	Obrigatória	Descrição
widgetKey	string	Sim	A chave de widget da sua conta.
catalog	string	Não	Slug do catálogo ao qual fixar o planificador.
sku	string	Não	SKU a pré-selecionar ao carregar.
locale	string	Não	Locale da interface — en, ru, de, pl, it, es, fr ou pt.
currency	string	Não	Código da moeda exibida, por exemplo USD, EUR ou BYN.
height	number	Não	Altura inicial do frame de desktop em píxeis. Por omissão 880.
embedOrigin	string	Não	Origem do host de incorporação. Por omissão, a própria origem do script do SDK, pelo que raramente precisa de a definir.
onReady	() => void	Não	Chamado quando o widget termina de arrancar.
onBomUpdated	(payload) => void	Não	Chamado sempre que a lista de materiais muda.
onAddToCart	(payload) => void	Não	Chamado quando o comprador clica em «Adicionar ao carrinho».
onError	(payload) => void	Não	Chamado quando o widget reporta um erro.
onResize	(height) => void	Não	Chamado quando o widget pede uma nova altura.

Callbacks

onAddToCart(payload) é o que vai usar mais:

onAddToCart(payload) {
  // payload = { lines: [{ sku, qty, unit }], layoutFingerprint, layoutToken }
  payload.lines.forEach((line) => {
    yourStore.addToCart(line.sku, line.qty, line.unit);
  });
}

Cada linha leva um SKU, uma quantidade numérica e uma unidade (box para azulejos; kg e l para consumíveis quando essa opção está ativada na sua loja). Veja Integração do carrinho.

onBomUpdated(payload) dá-lhe um retrato em direto do orçamento, para que a sua página possa mostrar algo como «Azulejos a encomendar: 34» ao lado do widget:

onBomUpdated(payload) {
  console.log(payload); // areas, piece counts, boxes, consumables
}

onError(payload) leva um motivo legível por máquina que pode passar à sua equipa de suporte.

Métodos do handle

mount devolve um handle:

Método	Descrição
setSku(sku)	Muda o SKU ativo sem renderizar de novo o widget inteiro.
setLocale(locale)	Muda o idioma da interface e recarrega o frame.
setCurrency(currency)	Muda a moeda exibida e recarrega o frame.
exportBlueprint()	Pede ao widget para transferir o Blueprint PDF atual.
requestAddToCart()	Dispara «Adicionar ao carrinho» programaticamente, como o botão dentro do widget.
destroy()	Remove o iframe e cancela a subscrição do listener. Chame quando o widget já não for necessário, por exemplo na navegação em SPA.

const planner = ScalarcutTiling.mount('#sc-tiling', { widgetKey: 'YOUR_WIDGET_KEY' });

// Later, in response to a variant switch on your page:
planner.setSku('VARIANT_SKU');

// On navigation away:
planner.destroy();

Locale e moeda recarregam, o SKU não

setLocale e setCurrency mudam o idioma e a moeda do widget e recarregam o frame. setSku não recarrega — troca o material no sítio e mantém a disposição do comprador.

Erros

mount lança imediatamente se o alvo faltar, widgetKey estiver ausente ou a origem de incorporação não puder ser determinada. Embrulhe a chamada se a sua página renderizar o contentor condicionalmente:

try {
  ScalarcutTiling.mount('#sc-tiling', { widgetKey: 'YOUR_WIDGET_KEY' });
} catch (error) {
  console.warn('Scalarcut not mounted:', error.message);
}