If you are loading the GrooveWidget code inside your <body>...</body> tag like this:
...other body content...
<script type='text/javascript'>
//<![CDATA[
(function() {var s=document.createElement('script');
s.type='text/javascript';s.async=true;
s.src=('https:'==document.location.protocol?'https':'http') +
'://YOURSUBDOMAIN.groovehq.com/widgets/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx/ticket.js'; var q = document.getElementsByTagName('script')[0];q.parentNode.insertBefore(s, q);})();
//]]>
</script>
</body>
Then Turbolinks will reload the Groove Widget on each page load without a problem.
The problem happens when you have your Groove Widget code in the <head>...</head> tag. It's not a bad thing, in fact we recommend it. It's just that it doesn't work right off with Turbolinks. To make working with Turbolinks easier, as well as other circumstances that might present the need, we've added two utility methods to the GrooveWidget global object:
GrooveWidget.add();
GrooveWidget.remove();
Pretty self explanatory. The .add() method will reset the widget even if it is/was already loaded. The .remove() method well... removes the widget.
As an example of implementation with jQuery for Turbolinks, you'll need to add this code to your <head>...</head> tag:
$(document).on('page:load', function() {
GrooveWidget.add();
});
It's that simple.