API

Smiley Digital comes with a few events that can be used to interact with the panel or how the survey is presented.

hideOnInit

type: boolean | undefined

Example

<script type="text/javascript">
  window.HappyOrNot.init({
    token: "{token}",
    hideOnInit: true
  });
</script>

onEvent

type: function

parameters: toggle

Toggle Smiley Pop-up in our out. Default state can be manipulated with the hideOnInit setting (example above).

// Calling togglePanel, will pop the panel in and out
const togglePanel = () => window.HappyOrNot.onEvent('toggle');
document.querySelector('button').addEventListener('click', togglePanel);

Example

1. Initialize a Smiley Digital Pop-up by using the provided script (from Analytics service):

     <script type="text/javascript" src="https://feedback.happy-or-not.com/v1/bootloader/{token}/bootloaderjs/?lang=fi-FI&init=true"></script>

2. Tell Smiley Digital that it should be hidden by default, on page load:

   <script type="text/javascript">
     window.HappyOrNot.init({
       token: '{token}',
       hideOnInit: true,
     });
   </script>

3. Define a mechanism through which to trigger the pop-out panel on demand. Can be event based, timer based, etc. Within the same script tag as the previous code example, we can write a short function that pops out the panel after a set number of seconds have passed after page load:

     const delay = 10 * 1000; // 10 seconds
     setTimeout(() => window.HappyOrNot.onEvent('toggle'), delay);

All together and in order:

<script
  type="text/javascript"
  src="https://feedback.happy-or-not.com/v1/bootloader/{token}/bootloaderjs/?lang=fi-FI&init=true"
></script>

<script type="text/javascript">
  window.HappyOrNot.init({
    token: '{token}',
    hideOnInit: true,
  });

  const delay = 10 * 1000; // 10 seconds
  setTimeout(() => window.HappyOrNot.onEvent('toggle'), delay);
</script>