cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Code-based Actions: Obtain user device information

Code-based Actions: Obtain user device information

Adjust the interaction based on the device that your user is using.

JavaScript is a powerful language that can be used to detect if the user is on a mobile or desktop device. That allows you to change the work flow based on the device. In this guide we will create code that will check if the user is on a desktop device and if that's the case we will automatically open the Web Widget after 5 seconds. To get the code working we will incorporate it by 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 one the homepage with a desktop device.

1. Create function to check the device

To check if the user is desktop or mobile, in this example, we will check for the innerWidth by creating a function that will return true or false. If the width is greater than 768 px we consider it as a desktop device 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>

2. Check if on desktop

The function is created and we can now call it. The function returns a boolean (true or false). The code below can be translated to something like: If it's true that user is on desktop then ...

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

3. Add delayed opening and start event

The last step is to add some code to make sure the Web Widget will open after 5 seconds and the event 'START_CHAT' will be 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

    window.__flowai_webclient_autoTriggerEvent = 'START_CHAT'
  }

</script>
Labels (1)

Code-based Actions: Obtain user device information

Adjust the interaction based on the device that your user is using.

JavaScript is a powerful language that can be used to detect if the user is on a mobile or desktop device. That allows you to change the work flow based on the device. In this guide we will create code that will check if the user is on a desktop device and if that's the case we will automatically open the Web Widget after 5 seconds. To get the code working we will incorporate it by 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 one the homepage with a desktop device.

1. Create function to check the device

To check if the user is desktop or mobile, in this example, we will check for the innerWidth by creating a function that will return true or false. If the width is greater than 768 px we consider it as a desktop device 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>

2. Check if on desktop

The function is created and we can now call it. The function returns a boolean (true or false). The code below can be translated to something like: If it's true that user is on desktop then ...

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

3. Add delayed opening and start event

The last step is to add some code to make sure the Web Widget will open after 5 seconds and the event 'START_CHAT' will be 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

    window.__flowai_webclient_autoTriggerEvent = 'START_CHAT'
  }

</script>
Labels (1)

Code-based Actions: Obtain user device information

Adjust the interaction based on the device that your user is using.

JavaScript is a powerful language that can be used to detect if the user is on a mobile or desktop device. That allows you to change the work flow based on the device. In this guide we will create code that will check if the user is on a desktop device and if that's the case we will automatically open the Web Widget after 5 seconds. To get the code working we will incorporate it by 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 one the homepage with a desktop device.

1. Create function to check the device

To check if the user is desktop or mobile, in this example, we will check for the innerWidth by creating a function that will return true or false. If the width is greater than 768 px we consider it as a desktop device 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>

2. Check if on desktop

The function is created and we can now call it. The function returns a boolean (true or false). The code below can be translated to something like: If it's true that user is on desktop then ...

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

3. Add delayed opening and start event

The last step is to add some code to make sure the Web Widget will open after 5 seconds and the event 'START_CHAT' will be 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

    window.__flowai_webclient_autoTriggerEvent = 'START_CHAT'
  }

</script>
Labels (1)
Version history
Last update:
‎06-19-2021 11:28 AM
Updated by:
Contributors