Developer Documentation

Everything you need to hack on ScreenSquid

The Javascript Plugin

No matter which method you use to install ScreenSquid, you’ll end up with the ScreenSquid javascript plugin on your webpage. It looks something like this:

<!-- SceenSquid Satellite Uplink -->
<script id="screensquid">
 var __squid = [];
 var __squid_id = "your_id_here";
  !function(s,q,u,i,d){s.ScreenSquidObject=u;s[u]||(s[u]=function(){
  (s[u].q=s[u].q||[]).push(arguments)});s[u].l=+new Date;i=q.createElement('script');
  d=q.scripts[0];i.src='https://www.screensquid.tv/embed/screensquid.js';
  d.parentNode.insertBefore(i,d)}(window,document,'screensquid');
</script>
<!-- https://screensquid.com -->

The ScreenSquid javascript code is super simple and works just like Google Analytics. Read on to learn about some cool features.

Ignoring Passwords

ScreenSquid doesn’t record any password input. Password fields look like:

<input type="password" />

Ignoring Other Input Fields

If you want to ignore other types of input fields, you can add the css class “__screensquid_invisible” to the form input. Look at the following text field for an example:

<input class="__screensquid_invisible" type="text" />

Identifying Users

If you attach an email address to your recordings, you’ll be able to search for specific users later. You can identify users by their email address using the following code:

<script type="text/javascript">
window.__squid.push(['identity', {
  email: "[email protected]"
}]);
</script>

Adding Custom Data to Recordings

In addition to identifying users by email address, you can attach custom data to recordings which will appear in the replay window. Use the same code as above, but specify a data field like so:

<script type="text/javascript">
window.__squid.push(['identity', {
  email: "[email protected]",
  data: {
    id: 1,
    username: "username",
    level: 1,
    first_name: "John",
    last_name: "Snow",
    display_name: "John Snow"
  }
}]);
</script>