2
ModuleClientAPIPrincipals
Mees van der Wijk edited this page 2025-04-29 19:29:42 +02:00

ModuleClientApi - Important Principals

When creating the client side of a module there are some really important things to take account of!

  • Never use document.getElementById or document.querySelector! Always use api.dom().querySelector so the element are always in the correct scope.
  • Never use event 'DOMContentLoaded' since the DOM content is always ready when the code is executed.
  • Never use event 'resize' instead use api.onResize()
  • Never create HTML scaffolding like head, meta, title tags. The module html is already the body!
  • Never use global scss styling, always try to use specific queries so it only applies to this module.
  • Never style global elements like body, html, head, p, h1 etc....
  • Try to avoid using element ids as references as there can be multiple instances of a module at the same time.
  • You do not need to specify
  • When using reference properties try to use api.onPropertyUpdate as much as possible. This way it also get's live updates from the editor. Try to avoid sending them from the server side as much as possible.
  • Use api.getTime() for any time calculations, this time is synced with the server.
  • Module should not have a background since the are global backgrounds for each module.
  • Module should not have any css filters applied to them since the are global filters for each module.
  • Module should not have any css blending applied to them since the are global blending for each module.
  • Module should not have any css borders applied to them since the are global borders for each module.
  • Module should not have any css padding applied to them since the are global padding for each module.
  • Never log directly to ModuleLog.info/ModuleLog.warn/ModuleLog.error! Always use console.log/console.error/console.warn