camallen/zooniverse-public-stream-debug.html

## zooniverse-public-stream-debug.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8"/>
  <title>Zooniverse Public Stream Debug</title>
  <script src="https://js.pusher.com/5.1/pusher.min.js"></script>
</head>
<body>
  <h1>Zooniverse Public Stream Debug</h1>
  <p>
    See the console log statements for the json event payloads.
  </p>
  <p>
    <h4>Session Counts:</h4>
    <p>Classifications: <span id="classificationCount">0</span></p>
    <p>Comments: <span id="commentCount"></span>0</p>
  </p>
</body>
<script defer>
    // Enable pusher logging - don't include this in production
    // Pusher.logToConsole = true;

    var pusher = new Pusher('79e8e05ea522377ba6db', {
        cluster: 'mt1',
        forceTLS: true
    });

    var classificationCount = 0;
    var commentCount = 0;
    var domClassificationCountNode = document.getElementById("classificationCount");
    var domCommentCountNode = document.getElementById("commentCount");

    var zooniverseApi = pusher.subscribe('panoptes');
    zooniverseApi.bind('classification', function (data) {
          console.log(data);
        classificationCount++;
        domClassificationCountNode.innerHTML = classificationCount;
    });
    var zooniverseTalkApi = pusher.subscribe('talk');
    zooniverseTalkApi.bind('comment', function (data) {
          console.log(data);
        commentCount++;
        domCommentCountNode.innerHTML = commentCount;
    });

</script>
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8"/>
	<title>Zooniverse Public Stream Debug</title>
	<script src="https://js.pusher.com/5.1/pusher.min.js"></script>
	</head>
	<body>
	<h1>Zooniverse Public Stream Debug</h1>
	<p>
	See the console log statements for the json event payloads.
	</p>
	<p>
	<h4>Session Counts:</h4>
	<p>Classifications: <span id="classificationCount">0</span></p>
	<p>Comments: <span id="commentCount"></span>0</p>
	</p>
	</body>
	<script defer>
	// Enable pusher logging - don't include this in production
	// Pusher.logToConsole = true;

	var pusher = new Pusher('79e8e05ea522377ba6db', {
	cluster: 'mt1',
	forceTLS: true
	});

	var classificationCount = 0;
	var commentCount = 0;
	var domClassificationCountNode = document.getElementById("classificationCount");
	var domCommentCountNode = document.getElementById("commentCount");

	var zooniverseApi = pusher.subscribe('panoptes');
	zooniverseApi.bind('classification', function (data) {
	console.log(data);
	classificationCount++;
	domClassificationCountNode.innerHTML = classificationCount;
	});
	var zooniverseTalkApi = pusher.subscribe('talk');
	zooniverseTalkApi.bind('comment', function (data) {
	console.log(data);
	commentCount++;
	domCommentCountNode.innerHTML = commentCount;
	});

	</script>