Custom script

Custom coding

To help with custom coding, the module exposes several "stores" that are accessible under window.tsn.stores

You can use the listen function to listen to changes in the store:

{
    calculator: 'Contains the calculated prices',
    ui: 'Represents the ui state'
}

window.tsn.stores.calculator.listen(function (prices) {
  console.log('Calculator store value changed:', prices);
});

Detect the interface display

You can detect when the designer is loaded by listening for the tsn.load event.

document.addEventListener('tsn.load', function () {
  console.log('Designer loaded');
});

Load the interface

You can load the interface by calling the scrollToDesigner method. The page will scroll to the designer automatically, or the popup will open if the popup mode is enabled.

window.tsn.methods.scrollToDesigner();

Close the interface

You can close the interface by calling the closeDesigner method.

window.tsn.methods.closeDesigner();