_r2c3.md

Real Remote Chaos Experience (r2c3)

Remote, as in, from the couch. Allows the rc3 world to be navigated using a gamepad. Install Greasemonkey, then click on the Raw button of the r2c3.user.js file below. An installation window should open. If not, just create an empty script and paste the code below.

Controls

• axis 0/1: mapped to up, down, left, right (movement).
• button 5 (right top shoulder button): mapped to shift (running)
• button 0 (A button): mapped to Enter
• button 1 (X button): mapped to Mic Mute toggle
• button 2 (Y button): mapped to Camera toggle

r2c3.user.js

// ==UserScript==
// @name     r2c3
// @version  1
// @grant    none
// @include  https://*.at.rc3.world/*
// ==/UserScript==

const KEYCODES = {
  up: 38,
  down: 40,
  left: 37,
  right: 39,
  button0: 13, // enter
  button5: 16 // shift
}

const state = {
  up: false,
  down: false,
  left: false,
  right: false,
  button0: false,
  button5: false,
  mute: false,
  cam: false
};

const THRESHOLD = 0.1;

window.addEventListener('gamepadconnected', (event) => {
  const update = () => {
    for (const gamepad of navigator.getGamepads()) {
      if (!gamepad) continue;
      
      const { axes, buttons }  = gamepad;
      
      checkAxis(axes[0], 'right', 'left');
      checkAxis(axes[1], 'down', 'up');
      
      checkButton(buttons[0], 'button0');
      checkButton(buttons[5], 'button5');
      
      mute(buttons[2], 'mute', 'microphone');
      mute(buttons[3], 'cam', 'cinema');
    }
    
    requestAnimationFrame(update);
  };
  
  update();
});

function checkAxis(axis, direction1, direction2) {
  if (axis > THRESHOLD) {
    move(direction1);
  } else if (axis < -THRESHOLD) {
    move(direction2);
  } else if (axis === 0) {
    reset(direction1, direction2);
  }
}

function checkButton(button, event) {
  if (button.pressed) {
    move(event);
  } else {
    reset(event);
  }
}

function mute(button, key, id) {
  if (button.pressed) {
    if (!state[key]) {
      state[key] = true;
    }
  } else if (state[key]) {
    state[key] = false;

    const turnOn = document.querySelector(`#${id}`);
    const turnOff = document.querySelector(`#${id}-close`);

    if (turnOn.style.display === 'block') {
      turnOn.click();
    } else {
      turnOff.click();
    }
  }
}

function move(direction) {
  const keyCode = KEYCODES[direction];
  
  if (!state[direction]) {
    state[direction] = true;
  	window.dispatchEvent(new KeyboardEvent(`keydown`, { keyCode }));
  }
}

function reset(...directions) {
  for (const direction of directions) {
    const keyCode = KEYCODES[direction];
    
    if (state[direction]) {
      state[direction] = false;
      window.dispatchEvent(new KeyboardEvent(`keyup`, { keyCode }));
    }
  }
}