Untitled

<!doctype html>

<html lang="en">
<head>
	<meta charset="utf-8">

	<title>view clickstream</title>
	<meta name="description" content="view clickstream">
	<meta name="author" content="str8up.media">

	<script
	  src="https://code.jquery.com/jquery-3.1.1.min.js"></script>


	<link
	  rel="stylesheet"
	  href="https://cdn.jsdelivr.net/npm/rrweb-player@latest/dist/style.css"
	/>
	<script src="https://cdn.jsdelivr.net/npm/rrweb-player@latest/dist/index.js"></script>

</head>

<body>
  test21
  <div id="streamshower"></div>

  <script>

	class ClickStreamEvent {
	  constructor(type, data, timestamp) {
		this.type = type;
		this.data = data;
		this.timestamp = timestamp;
	  }
	}

	$.getJSON( "/api/getclickstream?uuid={{ ouruid }}", function( data ) {
		var session_events = data['session_events'];

		const events = [];

		$.each(session_events, function(n, session_event) {

			var ourtype = session_event['type'];
			var ourdata = session_event['data'];
			var ourtimestamp = session_event['timestamp'];

			myobj = new ClickStreamEvent(ourtype,ourdata,ourtimestamp);


			events.push(myobj);
		});


		new rrwebPlayer({
		  target: document.getElementById("streamshower"), // customizable root element
		  data: {
			events,
			autoPlay: true,
			showDebug: true,
			showWarning: true
		  },
		});

	});


  </script>

</body>
</html>