Event Logger

Displaying the event data:

Source Code

Find the source code used to catch the JS events and log them to a textbox HTML element below. Note: you need a textarea HTML element with the ID event-data for this code to work:

 // Select the text box element on your page
const textBox = document.querySelector('#event-data');

// Define a function to update the text box with the latest event data
/*function updateEventData(eventData) {
  // Append the latest event data to the text box
  textBox.value += JSON.stringify(eventData, null, 2) + '\n\n';
  textBox.scrollTop = textBox.scrollHeight;
function updateEventData(eventData) {
  const { isRiddle2Event, riddleId, blockId, category, action, name } = eventData;
  const output = `isRiddle2Event: ${isRiddle2Event}\n` +
                 `riddleId: ${riddleId}\n` +
                 `blockId: ${blockId}\n` +
                 `category: ${category}\n` +
                 `action: ${action}\n` +
                 `name: ${name}\n\n`;
  textBox.value += output;
  textBox.scrollTop = textBox.scrollHeight;
window.addEventListener("message", (event) => {
  // Check that the message is from the iframe
  // Check that the message is a riddleEvent message
  if (event.data.type !== "riddleEvent") {
  // Log the event data received from the iframe
  console.log("Riddle Event (from iframe): ", event.data.data);
  // Update the text box with the event data