Code-based Actions: Obtain user device information

Using JavaScript you can detect if the user is on a mobile or desktop device. This enables you to change the workflow based on the user's device. Foe example, the code can check if the user is on a desktop device and automatically opens the Web Widget after 5 seconds.

To get the code working you need to incorporate it in the following 3 steps:

1. Create a function to check the device.
2. Use the function to check the device.
3. Add delayed opening & trigger event.

Javascript can also be used to check if the user is on a Homepage or Specific Page or you can Combine Functions to check if the user is on the homepage with a desktop device.

Create a function to check the device

To check if the user is desktop or mobile, in this example, we are check for the 'innerWidth' by creating a function that will return true or false. If the width is greater than 768 px it is a desktop device and the function should return true when we call the function:

<script>
window.desktopcheck = function() {
  var check = false;
  if(window.innerWidth>768){
      check=true;
  }
  return check;
}
</script>

Check if on desktop

The function returns a boolean (true or false). If it's true that the user is on a desktop then:

<script>
if(window.desktopcheck()){
  // add code here
}
</script>

Add delayed opening and start event

Add the code to ensure that the Web Widget will open after 5 seconds and the event 'START_CHAT' is triggered:

<script>
// Delayed Opening
setTimeout(function() {
   __flowai_webclient_app.open()
  }, 5000) // 5 secs


  // Trigger Event  
  window.\_\_flowai_webclient_autoTriggerEvent = 'START_CHAT'

</script>

Find the complete code below:

<script>
  window.desktopcheck = function() {
  var check = false;
  if(window.innerWidth>768){
    check=true;
    }
    return check;
  }

  if(window.desktopcheck()){  
    setTimeout(function() {  
      \_\_flowai_webclient_app.open()  
      }, 5000) // 5 secs
      </script>