App url
However this is tecnicly not a widget the interaction between the widget and the platform works exactly the same. We already explained the basics of this page on the Install page. So on this page we will only cover the events you can send back to the platform. This can be done with a post message.
Available query parameters
The parameters we will send along with the url. E.g. https://example.app?action=open
action
- Can beopen
,install
oruninstall
authtoken
- Will only be send if the app is installed.admin_id
this is the unique identifier of this administration.chain_id
this is0
by default, unless your administration is part of a chain.app_id
the unique identifier of this app.lang
the language of the user
Events
We support only the height event in this widget. This is the complete event object.
{
height: 300 // height in pixels
}
Set the height of the widget
You want to avoid that your widget gets a scrollbar of a lot of whitespace on the page. To solve this you an set the height of the widget by sending the height with an event. With the following code you can send this event.
window.top.postMessage({
height: 300 // height in pixels
}, '*') ;
Automate the height of the widget
Sometime you dont want to work with an fixed widget height, because it can be different according to the content that is in there. For this you can do something like this, whenever the size of your application changes the widget height will be updated automaticly.
const updateSize = () => {
window.top.postMessage({
height: document.body.scrollHeight // height in pixels
}, '*') ;
}
updateSize() ; // set the heigth for the first time
// monitor on size changes and update the height based on those events.
// create an Observer instance to check if the screen changes
const resizeObserver = new ResizeObserver((entries) => {
updateSize() ;
})
// start observing a DOM node
resizeObserver.observe(document.body)
We also implemented this feature in our basic apps. They can be found with in the tutorials section.