+
+ +
+
+
+
+
+
+
+404
+There's nothing here.
++ +
+
+ 
+ 
+
+ 
+
+
+
+ `;
+ } else {
+ buttonContent.innerHTML = `
+
+
+ `;
+ }
+
+ buttonDiv.appendChild(progressLeft);
+ buttonDiv.appendChild(progressRight);
+ buttonDiv.appendChild(buttonContent);
+
+ buttonsContainer.appendChild(buttonDiv);
+ }
+ }
+
+ // Initialize gamepad axes UI elements
+ function initGamepadAxes() {
+ const axesContainer = document.getElementById('axes-container');
+ axesContainer.innerHTML = '';
+
+ const gamepad = navigator.getGamepads()[activeGamepadIndex];
+ if (!gamepad) return;
+
+ const controllerType = gamepadHelper.detectControllerType(gamepad.id);
+
+ for (let i = 0; i < gamepad.axes.length; i++) {
+ const axis = document.createElement('div');
+ axis.className = 'gamepad-axis';
+
+ const axisName = gamepadHelper.getAxisName(controllerType, i);
+
+ axis.innerHTML = `
+
+ ${axisName}
+
+
+
+
+
+
+ `;
+
+ axesContainer.appendChild(axis);
+ }
+ }
+
+ // Update gamepad status message
+ function updateStatus(message, status) {
+ const resolvedStatus = status || (Object.keys(gamepads).length > 0 ? 'success' : 'warning');
+ gamepadStatusMessage.textContent = message;
+ gamepadStatus.classList.remove('alert-success', 'alert-warning', 'alert-danger');
+ gamepadStatus.classList.add(`alert-${resolvedStatus}`);
+ }
+
+ function updateTextContent(elementId, value) {
+ const element = document.getElementById(elementId);
+ const text = String(value);
+
+ if (element.textContent !== text) {
+ element.textContent = text;
+ }
+ }
+
+ // Update the gamepad info function to include vibration status
+ function updateGamepadInfo(gamepad) {
+ const gamepadInfo = gamepadHelper.getGamepadInfo(gamepad.id);
+ const vibrationCapabilities = gamepadHelper.getVibrationCapabilities(gamepad);
+
+ updateTextContent('gamepad-id', gamepad.id);
+ updateTextContent('gamepad-index', gamepad.index);
+ updateTextContent('gamepad-connected', gamepad.connected);
+ updateTextContent('gamepad-mapping', gamepad.mapping || 'No mapping');
+ updateTextContent('gamepad-buttons-count', gamepad.buttons.length);
+ updateTextContent('gamepad-axes-count', gamepad.axes.length);
+ updateTextContent('gamepad-type', gamepadInfo.type);
+ updateTextContent('gamepad-name', gamepadInfo.name);
+
+ // Update vibration controls based on capabilities
+ updateVibrationControls(vibrationCapabilities);
+ }
+
+ // Update vibration controls based on device capabilities
+ function updateVibrationControls(vibrationCapabilities) {
+ const vibrationStatus = document.getElementById('vibration-status');
+ const dualRumbleControls = document.getElementById('dual-rumble-controls');
+ const simpleVibrationControls = document.getElementById('simple-vibration-controls');
+ const vibrationDurationControls = document.getElementById('vibration-duration-controls');
+ const vibrationButtons = document.getElementById('vibration-buttons');
+ const vibrationUnsupported = document.getElementById('vibration-unsupported');
+
+ // Hide all controls first
+ dualRumbleControls.classList.add('d-none');
+ simpleVibrationControls.classList.add('d-none');
+ vibrationDurationControls.classList.add('d-none');
+ vibrationButtons.classList.add('d-none');
+ vibrationUnsupported.classList.add('d-none');
+
+ if (!vibrationCapabilities.supported) {
+ vibrationStatus.textContent = '';
+ vibrationUnsupported.classList.remove('d-none');
+ return;
+ }
+
+ // Show information about the actuator type
+ const capabilityBadge = document.createElement('span');
+ capabilityBadge.className = 'gamepad-capability-badge';
+ capabilityBadge.textContent = 'Vibration supported';
+
+ const capabilityType = document.createElement('span');
+ capabilityType.className = 'gamepad-capability-type';
+ capabilityType.textContent = vibrationCapabilities.type;
+
+ vibrationStatus.replaceChildren(capabilityBadge, capabilityType);
+ vibrationButtons.classList.remove('d-none');
+
+ // Show appropriate controls based on an actuator type
+ if (vibrationCapabilities.type === 'dual-rumble') {
+ dualRumbleControls.classList.remove('d-none');
+ } else {
+ simpleVibrationControls.classList.remove('d-none');
+ }
+
+ // Show duration controls for all types
+ vibrationDurationControls.classList.remove('d-none');
+ }
+
+ // Update button UI states
+ function updateButtons(gamepad) {
+ for (let i = 0; i < gamepad.buttons.length; i++) {
+ const button = gamepad.buttons[i];
+ const buttonElement = document.getElementById(`button-${i}`);
+ const buttonValueElement = document.getElementById(`button-value-${i}`);
+ const progressBarLeftElement = document.getElementById(`progress-bar-left-${i}`);
+ const progressBarRightElement = document.getElementById(`progress-bar-right-${i}`);
+
+ if (buttonElement && progressBarLeftElement && progressBarRightElement && buttonValueElement) {
+ const value = button.value;
+ const isPressed = button.pressed || value > 0.1;
+
+ // Update the value display
+ buttonValueElement.textContent = value.toFixed(2);
+ buttonElement.setAttribute('aria-valuenow', value.toFixed(2));
+
+ // Calculate rotation degrees based on value (0 to 1)
+ // For a full circle: right part goes from 0 to 180 degrees, left part from 0 to 180 degrees
+ const degrees = value * 360;
+
+ // Reset transforms
+ progressBarRightElement.style.transform = 'rotate(0deg)';
+ progressBarLeftElement.style.transform = 'rotate(0deg)';
+
+ if (degrees <= 180) {
+ // Only the right side rotates for the first half
+ progressBarRightElement.style.transform = `rotate(${degrees}deg)`;
+ } else {
+ // The right side is at full rotation, the left side rotates for the remainder
+ progressBarRightElement.style.transform = 'rotate(180deg)';
+ progressBarLeftElement.style.transform = `rotate(${degrees - 180}deg)`;
+ }
+
+ // Add/remove the active class based on the button state
+ if (isPressed) {
+ buttonElement.classList.add('active');
+ } else {
+ buttonElement.classList.remove('active');
+ }
+ }
+ }
+ }
+
+
+ // Update axes UI states
+ function updateAxes(gamepad) {
+ for (let i = 0; i < gamepad.axes.length; i++) {
+ const axisValue = gamepad.axes[i];
+ const axisValueElement = document.getElementById(`axis-value-${i}`);
+ const axisProgressElement = document.getElementById(`axis-progress-${i}`);
+ const axisMeterElement = document.getElementById(`axis-meter-${i}`);
+
+ if (axisValueElement && axisProgressElement && axisMeterElement) {
+ // Display the value
+ axisValueElement.textContent = axisValue.toFixed(2);
+ axisMeterElement.setAttribute('aria-valuenow', axisValue.toFixed(2));
+
+ // Fill away from the zero marker in the direction of travel.
+ const progressWidth = Math.abs(axisValue) * 50;
+ axisProgressElement.style.left = axisValue < 0 ? `${50 - progressWidth}%` : '50%';
+ axisProgressElement.style.width = `${progressWidth}%`;
+
+ // Change color based on the direction
+ if (axisValue > 0.1) {
+ axisProgressElement.classList.remove('is-negative');
+ axisProgressElement.classList.add('is-positive');
+ } else if (axisValue < -0.1) {
+ axisProgressElement.classList.remove('is-positive');
+ axisProgressElement.classList.add('is-negative');
+ } else {
+ axisProgressElement.classList.remove('is-positive', 'is-negative');
+ }
+ }
+ }
+
+ // Update stick visualizations
+ updateStickVisuals(gamepad);
+ }
+
+ // Update sticks visual representation
+ function updateStickVisuals(gamepad) {
+ const leftStick = document.getElementById('left-stick-position');
+ const rightStick = document.getElementById('right-stick-position');
+
+ if (gamepad.axes.length >= 2 && leftStick) {
+ const range = (leftStick.parentElement.clientWidth / 2) - (leftStick.clientWidth / 2) - 2;
+ const x = gamepad.axes[0] * range;
+ const y = gamepad.axes[1] * range;
+
+ // Center position is 50%, then offset by the calculated amounts
+ leftStick.style.left = `calc(50% + ${x}px)`;
+ leftStick.style.top = `calc(50% + ${y}px)`;
+ }
+
+ if (gamepad.axes.length >= 4 && rightStick) {
+ const range = (rightStick.parentElement.clientWidth / 2) - (rightStick.clientWidth / 2) - 2;
+ const x = gamepad.axes[2] * range;
+ const y = gamepad.axes[3] * range;
+
+ rightStick.style.left = `calc(50% + ${x}px)`;
+ rightStick.style.top = `calc(50% + ${y}px)`;
+ }
+ }
+
+ // Update raw data display
+ function updateRawData(gamepad) {
+ const rawDataElement = document.getElementById('raw-data');
+
+ const buttons = Array.from(gamepad.buttons).map((button, index) => {
+ return `Button ${index}: { pressed: ${button.pressed}, value: ${button.value.toFixed(2)} }`;
+ });
+
+ const axes = Array.from(gamepad.axes).map((axis, index) => {
+ return `Axis ${index}: ${axis.toFixed(2)}`;
+ });
+
+ rawDataElement.textContent = `Gamepad: ${gamepad.id}\nType: ${gamepadHelper.detectControllerType(gamepad.id)}\n\nButtons:\n${buttons.join('\n')}\n\nAxes:\n${axes.join('\n')}`;
+ }
+
+ // Event listeners for vibration controls
+ document.getElementById('vibration-weak').addEventListener('input', function() {
+ document.getElementById('weak-value').textContent = this.value;
+ });
+
+ document.getElementById('vibration-strong').addEventListener('input', function() {
+ document.getElementById('strong-value').textContent = this.value;
+ });
+
+ document.getElementById('vibration-magnitude').addEventListener('input', function() {
+ document.getElementById('magnitude-value').textContent = this.value;
+ });
+
+ document.getElementById('vibration-duration').addEventListener('input', function() {
+ document.getElementById('duration-value').textContent = this.value;
+ });
+
+ // Vibrate the gamepad with appropriate parameters
+ function vibrateGamepad() {
+ if (activeGamepadIndex !== null) {
+ const gamepad = navigator.getGamepads()[activeGamepadIndex];
+ if (!gamepad) return;
+
+ const vibrationCapabilities = gamepadHelper.getVibrationCapabilities(gamepad);
+ if (!vibrationCapabilities.supported) return;
+
+ const duration = Number.parseInt(document.getElementById('vibration-duration').value);
+ let vibrationOptions = { duration };
+
+ if (vibrationCapabilities.type === 'dual-rumble') {
+ vibrationOptions.weakMagnitude = Number.parseFloat(document.getElementById('vibration-weak').value);
+ vibrationOptions.strongMagnitude = Number.parseFloat(document.getElementById('vibration-strong').value);
+ } else {
+ const magnitude = Number.parseFloat(document.getElementById('vibration-magnitude').value);
+ vibrationOptions.weakMagnitude = magnitude;
+ vibrationOptions.strongMagnitude = magnitude;
+ vibrationOptions.magnitude = magnitude;
+ }
+
+ gamepadHelper.vibrate(gamepad, vibrationOptions)
+ .then(() => console.log('Vibration started'))
+ .catch(e => console.error('Vibration error:', e));
+ }
+ }
+
+ // Stop vibration
+ function stopVibration() {
+ if (activeGamepadIndex !== null) {
+ const gamepad = navigator.getGamepads()[activeGamepadIndex];
+ if (gamepad) {
+ gamepadHelper.stopVibration(gamepad).catch(e => {
+ console.error('Stop vibration error:', e);
+ });
+ }
+ }
+ }
+
+ // Start the gamepad polling loop
+ function startGamepadLoop() {
+ // Make sure UI elements are initialized when starting the loop
+ initGamepadButtons();
+ initGamepadAxes();
+ initGamepadVisual();
+
+ gamepadLoop();
+ }
+
+ // Stop the gamepad polling loop
+ function stopGamepadLoop() {
+ cancelAnimationFrame(animationFrameId);
+ animationFrameId = null;
+ }
+
+ // The main gamepad polling loop
+ function gamepadLoop() {
+ // Get the latest gamepad state
+ const gamepads = navigator.getGamepads();
+
+ if (activeGamepadIndex !== null && gamepads[activeGamepadIndex]) {
+ const gamepad = gamepads[activeGamepadIndex];
+
+ // Update all the UI elements
+ updateGamepadInfo(gamepad);
+ updateButtons(gamepad);
+ gamepadVisualizer.update(gamepad);
+ updateAxes(gamepad);
+ updateRawData(gamepad);
+ }
+
+ animationFrameId = requestAnimationFrame(gamepadLoop);
+ }
+
+ // Initial check for already connected gamepads
+ const initialGamepads = navigator.getGamepads();
+ for (const element of initialGamepads) {
+ if (element) {
+ gamepads[element.index] = element;
+ }
+ }
+
+ // If we have gamepads already, activate the first one
+ if (Object.keys(gamepads).length > 0) {
+ activeGamepadIndex = Number.parseInt(Object.keys(gamepads)[0]);
+ updateStatus(`Gamepad ${gamepads[activeGamepadIndex].id} connected`);
+ updateGamepadSelector(); // Update after setting activeGamepadIndex
+ startGamepadLoop();
+ }
+});
diff --git a/assets/js/lucide-init.js b/assets/js/lucide-init.js
new file mode 100644
index 0000000..e3540df
--- /dev/null
+++ b/assets/js/lucide-init.js
@@ -0,0 +1,12 @@
+/**
+ * Replace Lucide icon placeholders with inline SVGs.
+ */
+(function() {
+ 'use strict';
+
+ if (!globalThis.lucide) {
+ return;
+ }
+
+ globalThis.lucide.createIcons({ icons: globalThis.lucide.icons });
+})();
diff --git a/assets/js/mouse-tester.js b/assets/js/mouse-tester.js
new file mode 100644
index 0000000..1bbde85
--- /dev/null
+++ b/assets/js/mouse-tester.js
@@ -0,0 +1,331 @@
+function formatSigned(value) {
+ const roundedValue = Math.round(value);
+ return roundedValue > 0 ? `+${roundedValue}` : `${roundedValue}`;
+}
+
+function wheelUnit(deltaMode) {
+ if (deltaMode === WheelEvent.DOM_DELTA_LINE) return 'lines';
+ if (deltaMode === WheelEvent.DOM_DELTA_PAGE) return 'pages';
+ return 'px';
+}
+
+function wheelModeName(deltaMode) {
+ if (deltaMode === WheelEvent.DOM_DELTA_LINE) return 'Lines';
+ if (deltaMode === WheelEvent.DOM_DELTA_PAGE) return 'Pages';
+ return 'Pixels';
+}
+
+function wheelDirection(deltaX, deltaY) {
+ if (Math.abs(deltaY) >= Math.abs(deltaX) && deltaY !== 0) {
+ return deltaY < 0 ? '↑ Up' : '↓ Down';
+ }
+ if (deltaX !== 0) {
+ return deltaX < 0 ? '← Left' : '→ Right';
+ }
+ return 'Idle';
+}
+
+function preventBrowserAction(event) {
+ event.preventDefault();
+}
+
+document.addEventListener('DOMContentLoaded', function() {
+ const buttonConfigs = [
+ { number: 0, bit: 1, name: 'primary' },
+ { number: 1, bit: 4, name: 'wheel' },
+ { number: 2, bit: 2, name: 'secondary' },
+ { number: 3, bit: 8, name: 'back' },
+ { number: 4, bit: 16, name: 'forward' }
+ ];
+ const browserNavigationButtons = new Set([3, 4]);
+ const buttonPressCounts = new Map(buttonConfigs.map(config => [config.number, 0]));
+ const pressedButtons = new Set();
+ const suppressedNavigationButtons = new Set();
+ const captureSurface = document.getElementById('mouse-capture-surface');
+ const positionIndicator = document.getElementById('mouse-position-indicator');
+ const status = document.getElementById('mouse-status');
+ const statusMessage = document.getElementById('mouse-status-message');
+ const activeButtonsOutput = document.getElementById('mouse-active-buttons');
+ const lastEventOutput = document.getElementById('mouse-last-event');
+ const wheelModeOutput = document.getElementById('mouse-wheel-mode');
+ const browserSupportOutput = document.getElementById('mouse-browser-support');
+ const firefoxMouseButtonsWarning = document.getElementById('firefox-mouse-buttons-warning');
+ const movementXOutput = document.getElementById('mouse-movement-x');
+ const movementYOutput = document.getElementById('mouse-movement-y');
+ const positionOutput = document.getElementById('mouse-position');
+ const distanceOutput = document.getElementById('mouse-distance');
+ const moveEventsOutput = document.getElementById('mouse-move-events');
+ const doubleClicksOutput = document.getElementById('mouse-double-clicks');
+ const wheelXOutput = document.getElementById('mouse-wheel-x');
+ const wheelYOutput = document.getElementById('mouse-wheel-y');
+ const wheelDirectionOutput = document.getElementById('mouse-wheel-direction');
+ const wheelEventsOutput = document.getElementById('mouse-wheel-events');
+ let hasReceivedInput = false;
+ let scrollArrowTimer = null;
+ let motionFrameId = null;
+ let movementX = 0;
+ let movementY = 0;
+ let positionX = 0;
+ let positionY = 0;
+ let totalDistance = 0;
+ let moveEvents = 0;
+ let doubleClicks = 0;
+ let wheelX = 0;
+ let wheelY = 0;
+ let wheelEvents = 0;
+ let wheelDeltaMode = 0;
+
+ firefoxMouseButtonsWarning.hidden = !navigator.userAgent.includes('Firefox/');
+
+ function updateStatus(message, type) {
+ status.classList.remove('alert-warning', 'alert-success', 'alert-danger');
+ status.classList.add(`alert-${type}`);
+ statusMessage.textContent = message;
+ }
+
+ function markInput(eventName) {
+ lastEventOutput.textContent = eventName;
+ if (!hasReceivedInput) {
+ hasReceivedInput = true;
+ updateStatus('Mouse input detected. Keep testing buttons, movement, and scrolling.', 'success');
+ }
+ }
+
+ function getButtonElements(buttonNumber) {
+ return {
+ card: document.querySelector(`.mouse-button-card[data-mouse-button="${buttonNumber}"]`),
+ count: document.getElementById(`mouse-button-${buttonNumber}-count`),
+ state: document.getElementById(`mouse-button-${buttonNumber}-state`),
+ visual: document.querySelector(`.mouse-svg-control[data-mouse-button="${buttonNumber}"]`)
+ };
+ }
+
+ function renderButton(buttonNumber) {
+ const elements = getButtonElements(buttonNumber);
+ const isActive = pressedButtons.has(buttonNumber);
+ elements.card.classList.toggle('is-active', isActive);
+ elements.visual.classList.toggle('is-active', isActive);
+ elements.state.textContent = isActive ? 'Pressed' : 'Released';
+ elements.count.textContent = buttonPressCounts.get(buttonNumber);
+ }
+
+ function renderAllButtons() {
+ buttonConfigs.forEach(config => renderButton(config.number));
+ }
+
+ function renderActiveButtons(buttonsBitmask) {
+ const activeNames = buttonConfigs
+ .filter(config => (buttonsBitmask & config.bit) !== 0)
+ .map(config => config.name);
+ activeButtonsOutput.textContent = activeNames.length === 0
+ ? '0 (none)'
+ : `${buttonsBitmask} (${activeNames.join(' + ')})`;
+ }
+
+ function syncPressedButtons(buttonsBitmask) {
+ pressedButtons.clear();
+ buttonConfigs.forEach(config => {
+ if ((buttonsBitmask & config.bit) !== 0) {
+ pressedButtons.add(config.number);
+ }
+ });
+ renderActiveButtons(buttonsBitmask);
+ renderAllButtons();
+ }
+
+ function renderMotion() {
+ movementXOutput.textContent = formatSigned(movementX);
+ movementYOutput.textContent = formatSigned(movementY);
+ positionOutput.textContent = `${Math.round(positionX)}, ${Math.round(positionY)}`;
+ distanceOutput.textContent = Math.round(totalDistance);
+ moveEventsOutput.textContent = moveEvents;
+ positionIndicator.style.left = `${positionX}px`;
+ positionIndicator.style.top = `${positionY}px`;
+ positionIndicator.hidden = false;
+ motionFrameId = null;
+ }
+
+ function scheduleMotionRender() {
+ if (motionFrameId === null) {
+ motionFrameId = requestAnimationFrame(renderMotion);
+ }
+ }
+
+ function showScrollArrows(deltaX, deltaY) {
+ if (scrollArrowTimer !== null) {
+ clearTimeout(scrollArrowTimer);
+ }
+ const activeDirections = new Set();
+ if (deltaX < 0) activeDirections.add('left');
+ if (deltaX > 0) activeDirections.add('right');
+ if (deltaY < 0) activeDirections.add('up');
+ if (deltaY > 0) activeDirections.add('down');
+ document.querySelectorAll('.mouse-svg-scroll-indicator').forEach(indicator => {
+ indicator.classList.toggle('is-active', activeDirections.has(indicator.dataset.scrollDirection));
+ });
+ scrollArrowTimer = setTimeout(function() {
+ document.querySelectorAll('.mouse-svg-scroll-indicator').forEach(indicator => {
+ indicator.classList.remove('is-active');
+ });
+ scrollArrowTimer = null;
+ }, 450);
+ }
+
+ function recordButtonDown(event) {
+ const wasPressed = pressedButtons.has(event.button);
+ captureSurface.focus({ preventScroll: true });
+ markInput(`Button ${event.button} down`);
+ syncPressedButtons(event.buttons);
+ if (!wasPressed && buttonPressCounts.has(event.button)) {
+ buttonPressCounts.set(event.button, buttonPressCounts.get(event.button) + 1);
+ renderButton(event.button);
+ }
+ }
+
+ function handleMouseDown(event) {
+ event.preventDefault();
+ recordButtonDown(event);
+ }
+
+ function handleSideButtonPointerDown(event) {
+ if (!browserNavigationButtons.has(event.button)) return;
+ event.preventDefault();
+ suppressedNavigationButtons.add(event.button);
+ recordButtonDown(event);
+ }
+
+ function handleSideButtonPointerUp(event) {
+ if (!browserNavigationButtons.has(event.button) || !suppressedNavigationButtons.has(event.button)) return;
+ event.preventDefault();
+ syncPressedButtons(event.buttons);
+ markInput(`Button ${event.button} up`);
+ suppressedNavigationButtons.delete(event.button);
+ }
+
+ function handleMouseMove(event) {
+ const surfaceBounds = captureSurface.getBoundingClientRect();
+ movementX = event.movementX;
+ movementY = event.movementY;
+ positionX = Math.min(Math.max(event.clientX - surfaceBounds.left, 0), surfaceBounds.width);
+ positionY = Math.min(Math.max(event.clientY - surfaceBounds.top, 0), surfaceBounds.height);
+ totalDistance += Math.hypot(movementX, movementY);
+ moveEvents += 1;
+ markInput('Mouse move');
+ syncPressedButtons(event.buttons);
+ scheduleMotionRender();
+ }
+
+ function handleWheel(event) {
+ event.preventDefault();
+ wheelDeltaMode = event.deltaMode;
+ wheelX += event.deltaX;
+ wheelY += event.deltaY;
+ wheelEvents += 1;
+ const unit = wheelUnit(wheelDeltaMode);
+ wheelXOutput.textContent = `${formatSigned(wheelX)} ${unit}`;
+ wheelYOutput.textContent = `${formatSigned(wheelY)} ${unit}`;
+ wheelDirectionOutput.textContent = wheelDirection(event.deltaX, event.deltaY);
+ wheelEventsOutput.textContent = wheelEvents;
+ wheelModeOutput.textContent = wheelModeName(wheelDeltaMode);
+ markInput('Mouse wheel');
+ showScrollArrows(event.deltaX, event.deltaY);
+ }
+
+ function releaseButtons(event) {
+ syncPressedButtons(event?.buttons ?? 0);
+ if (event && captureSurface.contains(event.target)) {
+ event.preventDefault();
+ markInput(`Button ${event.button} up`);
+ }
+ }
+
+ function preventSideButtonBrowserAction(event) {
+ if (browserNavigationButtons.has(event.button)) {
+ event.preventDefault();
+ }
+ }
+
+ function releaseAllButtons() {
+ suppressedNavigationButtons.clear();
+ syncPressedButtons(0);
+ }
+
+ function resetTester() {
+ hasReceivedInput = false;
+ buttonConfigs.forEach(config => buttonPressCounts.set(config.number, 0));
+ pressedButtons.clear();
+ suppressedNavigationButtons.clear();
+ if (scrollArrowTimer !== null) {
+ clearTimeout(scrollArrowTimer);
+ scrollArrowTimer = null;
+ }
+ document.querySelectorAll('.mouse-svg-scroll-indicator').forEach(indicator => {
+ indicator.classList.remove('is-active');
+ });
+ if (motionFrameId !== null) {
+ cancelAnimationFrame(motionFrameId);
+ motionFrameId = null;
+ }
+ movementX = 0;
+ movementY = 0;
+ positionX = 0;
+ positionY = 0;
+ totalDistance = 0;
+ moveEvents = 0;
+ doubleClicks = 0;
+ wheelX = 0;
+ wheelY = 0;
+ wheelEvents = 0;
+ wheelDeltaMode = 0;
+ movementXOutput.textContent = '0';
+ movementYOutput.textContent = '0';
+ positionOutput.textContent = '0, 0';
+ distanceOutput.textContent = '0';
+ moveEventsOutput.textContent = '0';
+ doubleClicksOutput.textContent = '0';
+ wheelXOutput.textContent = '0 px';
+ wheelYOutput.textContent = '0 px';
+ wheelDirectionOutput.textContent = 'Idle';
+ wheelEventsOutput.textContent = '0';
+ wheelModeOutput.textContent = 'Pixels';
+ lastEventOutput.textContent = 'None';
+ positionIndicator.hidden = true;
+ renderActiveButtons(0);
+ renderAllButtons();
+ updateStatus('Move, click, or scroll inside the test area to begin.', 'warning');
+ }
+
+ if (globalThis.MouseEvent === undefined || globalThis.WheelEvent === undefined) {
+ browserSupportOutput.textContent = 'Not supported';
+ updateStatus('Mouse events are not supported in this browser.', 'danger');
+ captureSurface.removeAttribute('tabindex');
+ return;
+ }
+
+ browserSupportOutput.textContent = 'Supported';
+ captureSurface.addEventListener('pointerdown', handleSideButtonPointerDown, { capture: true });
+ captureSurface.addEventListener('mousedown', handleMouseDown);
+ captureSurface.addEventListener('mousemove', handleMouseMove);
+ captureSurface.addEventListener('mouseup', preventBrowserAction);
+ captureSurface.addEventListener('wheel', handleWheel, { passive: false });
+ captureSurface.addEventListener('contextmenu', preventBrowserAction);
+ captureSurface.addEventListener('click', preventSideButtonBrowserAction, { capture: true });
+ captureSurface.addEventListener('auxclick', preventSideButtonBrowserAction, { capture: true });
+ captureSurface.addEventListener('dblclick', function(event) {
+ event.preventDefault();
+ doubleClicks += 1;
+ doubleClicksOutput.textContent = doubleClicks;
+ markInput('Double click');
+ });
+ globalThis.addEventListener('pointerup', handleSideButtonPointerUp, { capture: true });
+ globalThis.addEventListener('pointercancel', releaseAllButtons, { capture: true });
+ globalThis.addEventListener('mouseup', releaseButtons);
+ globalThis.addEventListener('blur', releaseAllButtons);
+ document.addEventListener('visibilitychange', function() {
+ if (document.hidden) {
+ releaseAllButtons();
+ }
+ });
+ document.getElementById('mouse-reset').addEventListener('click', resetTester);
+ resetTester();
+});
diff --git a/assets/js/projects.js b/assets/js/projects.js
new file mode 100644
index 0000000..b5f46a7
--- /dev/null
+++ b/assets/js/projects.js
@@ -0,0 +1,347 @@
+// projects section script
+
+// get project container
+let container
+let org_name = "LizardByte"
+let base_url = `https://app.${org_name.toLowerCase()}.dev`
+let cache_repo = "dashboard"
+const organizations_url = "https://raw.githubusercontent.com/LizardByte/.github/master/organizations.json"
+let shared_web_url = "https://cdn.jsdelivr.net/npm/@lizardbyte/shared-web@2026.1107.31840"
+
+
+function onDocumentReady(callback) {
+ if (document.readyState === "loading") {
+ document.addEventListener("DOMContentLoaded", callback)
+ return
+ }
+
+ callback()
+}
+
+function fetchWithNoCache(url, options = {}) {
+ return fetch(url, {
+ ...options,
+ cache: "no-store",
+ })
+}
+
+function fetchJson(url) {
+ return fetchWithNoCache(url)
+ .then(function (response) {
+ if (!response.ok) {
+ throw new Error(`Request failed for ${url}: ${response.status}`)
+ }
+
+ return response.json()
+ })
+}
+
+function shouldProcessRepo(repo) {
+ if (repo['private'] === true) return false;
+ if (repo['archived'] === true) return false;
+ if (repo['description'] === null) return false;
+ return !(repo['fork'] === true && !repo['topics'].includes("featured-fork"));
+}
+
+function projectUrl(repo) {
+ try {
+ const homepage = new URL(repo.homepage)
+ if (["https:", "http:"].includes(homepage.protocol)) return homepage.href
+ } catch {
+ // Repositories without a valid homepage link to GitHub.
+ }
+ return repo.html_url
+}
+
+function githubIdentity(value) {
+ try {
+ const url = new URL(value.replace(/^git@github\.com:/i, "https://github.com/"))
+ const parts = url.pathname.split("/").filter(Boolean)
+ if (url.hostname !== "github.com" || parts.length !== 2) return null
+ return parts.join("/").replace(/\.git$/i, "").toLowerCase()
+ } catch {
+ return null
+ }
+}
+
+function createBannerElement(repo) {
+ let banner_div = document.createElement("div")
+ banner_div.className = "hover-zoom"
+
+ let banner_link = document.createElement("a")
+ banner_link.className = "crowdin-ignore"
+ banner_link.href = projectUrl(repo)
+ banner_link.target = "_blank"
+ banner_link.rel = "noopener noreferrer"
+ banner_div.append(banner_link)
+
+ let banner = document.createElement("img")
+ banner.className = "card-img-top rounded-0"
+ banner.src = `${base_url}/${cache_repo}/${repo.dashboard_paths.banner_small}`
+ banner.alt = ""
+ banner_link.append(banner)
+
+ return banner_div
+}
+
+function createCardBody(repo) {
+ let card_body = document.createElement("div")
+ card_body.className = "card-body p-4 rounded-0"
+
+ let card_title_link = document.createElement("a")
+ card_title_link.className = "text-decoration-none project-card-link crowdin-ignore"
+ card_title_link.href = projectUrl(repo)
+ card_title_link.target = "_blank"
+ card_title_link.rel = "noopener noreferrer"
+ card_body.appendChild(card_title_link)
+
+ let card_title_text = document.createElement("h5")
+ card_title_text.className = "card-title mb-3 fw-bolder crowdin-ignore"
+ card_title_text.textContent = repo['name']
+
+ if (repo['fork'] === true && repo['topics'].includes("featured-fork")) {
+ let fork_badge = document.createElement("span")
+ fork_badge.className = "badge bg-info ms-2"
+ fork_badge.textContent = "Fork"
+ card_title_text.appendChild(fork_badge)
+ }
+
+ card_title_link.appendChild(card_title_text)
+
+ const organization = document.createElement("p")
+ organization.className = "project-organization small text-muted crowdin-ignore"
+ organization.textContent = repo.owner.login
+ card_body.appendChild(organization)
+
+ let card_paragraph = document.createElement("p")
+ card_paragraph.className = "card-text mb-0"
+ card_paragraph.textContent = repo['description']
+ card_body.appendChild(card_paragraph)
+
+ return card_body
+}
+
+function loadCommitActivity(repo, card_footer) {
+ fetchJson(`${base_url}/${cache_repo}/github/commitActivity/${repo.dashboard_key}.json`)
+ .then(function (commitActivity) {
+ let activity_container = document.createElement("div")
+ activity_container.className = "commit-activity-graph mt-2 mb-2 mx-3"
+ activity_container.style.cssText = "display: flex; gap: 2px; height: 32px; align-items: flex-end;"
+
+ let maxCommits = Math.max(...commitActivity.map(week => week.total), 0)
+
+ for (let week of commitActivity) {
+ let bar = document.createElement("div")
+ let height = maxCommits > 0 ? (week.total / maxCommits) * 100 : 0
+ let intensity = 0.3 + (height / 100) * 0.7
+
+ bar.className = week.total === 0 ? 'commit-bar-empty crowdin-ignore' : 'commit-bar-active crowdin-ignore'
+ bar.style.cssText = `
+ flex: 1;
+ min-width: 2px;
+ height: ${Math.max(height, 10)}%;
+ border-radius: 1px;
+ transition: all 0.2s ease;
+ --commit-bar-opacity: ${intensity};
+ `
+ bar.title = `${week.total} commits this week`
+ activity_container.appendChild(bar)
+ }
+
+ card_footer.insertBefore(activity_container, card_footer.firstChild)
+ })
+ .catch(function () {
+ console.log(`No commit activity data available for ${repo['name']}`)
+ })
+}
+
+function createRepoDataRow(repo, card_footer) {
+ let repo_data_row = document.createElement("div")
+ repo_data_row.className = "d-flex align-items-center"
+ card_footer.appendChild(repo_data_row)
+
+ let github_link = document.createElement("a")
+ github_link.className = "nav-link project-nav-link ms-3"
+ github_link.href = repo['html_url']
+ github_link.target = "_blank"
+ repo_data_row.appendChild(github_link)
+
+ let github_link_image = document.createElement("i")
+ github_link_image.className = "fa-fw fa-brands fa-github"
+ github_link.prepend(github_link_image)
+
+ let star_link = document.createElement("a")
+ star_link.className = "nav-link nav-link-sm project-nav-link ms-3 crowdin-ignore"
+ star_link.href = `https://star-history.com/#${repo['full_name']}`
+ star_link.target = "_blank"
+ star_link.textContent = globalThis.formatNumber(repo['stargazers_count'])
+ repo_data_row.appendChild(star_link)
+
+ let star_link_image = document.createElement("i")
+ star_link_image.className = "fa-fw fa-solid fa-star"
+ star_link.prepend(star_link_image)
+
+ let fork_link = document.createElement("a")
+ fork_link.className = "nav-link nav-link-sm project-nav-link ms-3 crowdin-ignore"
+ fork_link.href = `https://github.com/${repo['full_name']}/network/members`
+ fork_link.target = "_blank"
+ fork_link.textContent = globalThis.formatNumber(repo['forks'])
+ repo_data_row.appendChild(fork_link)
+
+ let fork_link_image = document.createElement("i")
+ fork_link_image.className = "fa-fw fa-solid fa-code-fork"
+ fork_link.prepend(fork_link_image)
+
+ return repo_data_row
+}
+
+function addDocsLink(repo, readthedocs, repo_data_row) {
+ for (let docs in readthedocs) {
+ const docs_repo = githubIdentity(readthedocs[docs]['repository']['url']);
+ if (!repo.dashboard_aliases.some(alias => alias.toLowerCase() === docs_repo)) continue;
+
+ let docs_url = readthedocs[docs]['urls']['documentation']
+ try {
+ let parsedUrl = new URL(docs_url);
+ if (parsedUrl.host !== "docs.lizardbyte.dev") continue;
+ } catch (e) {
+ console.error("Invalid URL:", docs_url, e);
+ continue;
+ }
+
+ let docs_link = document.createElement("a")
+ docs_link.className = "nav-link ms-3"
+ docs_link.href = docs_url
+ docs_link.target = "_blank"
+ repo_data_row.appendChild(docs_link)
+
+ let docs_link_image = document.createElement("img")
+ docs_link_image.className = "readthedocs-icon"
+ docs_link_image.src = "https://cdn.jsdelivr.net/npm/simple-icons@16/icons/readthedocs.svg"
+ docs_link_image.alt = "ReadTheDocs"
+ docs_link_image.title = "ReadTheDocs"
+ docs_link_image.style.width = "24px"
+ docs_link_image.style.height = "24px"
+ docs_link.prepend(docs_link_image)
+ }
+}
+
+function loadLanguageIcons(repo, card_footer) {
+ fetchJson(`${base_url}/${cache_repo}/github/languages/${repo.dashboard_key}.json`)
+ .then(function (languages) {
+ let language_data_row = document.createElement("div")
+ language_data_row.className = "card-group p-3 align-items-center"
+ card_footer.appendChild(language_data_row)
+
+ for (let language in languages) {
+ let language_file = encodeURIComponent(`${language}.svg`)
+ let language_icon = document.createElement("img")
+ language_icon.className = "language-logo crowdin-ignore"
+ language_icon.src = `${shared_web_url}/dist/language-icons/${language_file}`
+ language_icon.alt = language
+ language_icon.title = language
+ language_data_row.append(language_icon)
+ }
+ })
+ .catch(function () {})
+}
+
+function buildRepoCard(repo, readthedocs) {
+ let column = document.createElement("div")
+ column.className = "col-lg-4 mb-5"
+ container.appendChild(column)
+
+ let card = document.createElement("div")
+ card.className = "card h-100 shadow border-0 rounded-0"
+ column.appendChild(card)
+
+ card.append(createBannerElement(repo))
+
+ card.appendChild(createCardBody(repo))
+
+ let card_footer = document.createElement("div")
+ card_footer.className = "card-footer p-2 pt-0 border-0 rounded-0"
+ card.appendChild(card_footer)
+
+ loadCommitActivity(repo, card_footer)
+
+ let repo_data_row = createRepoDataRow(repo, card_footer)
+ addDocsLink(repo, readthedocs, repo_data_row)
+ loadLanguageIcons(repo, card_footer)
+ return column
+}
+
+function updateProjectFilters(cards, organizations) {
+ const organization = document.getElementById("project-organization").value
+ const terms = document.getElementById("project-search").value.toLowerCase().trim().split(/\s+/).filter(Boolean)
+ let count = 0
+ for (const { repo, column } of cards) {
+ const text = `${repo.full_name} ${repo.description}`.toLowerCase()
+ const matches = (!organization || repo.owner.login.toLowerCase() === organization.toLowerCase())
+ && terms.every(term => text.includes(term))
+ column.hidden = !matches
+ if (matches) count += 1
+ }
+ const noun = count === 1 ? "project" : "projects"
+ document.getElementById("project-status").textContent = count
+ ? `${count} ${noun}` : "No projects match your search."
+
+ const scope = organization ? [organization] : organizations
+ const query = [...scope.map(name => `org:${name}`), "archived:true"].join(" ")
+ const archive = document.getElementById("archived-projects-link")
+ archive.href = `https://github.com/search?${new URLSearchParams({ q: query, type: "repositories" })}`
+ archive.classList.remove("disabled")
+ archive.removeAttribute("aria-disabled")
+}
+
+function createProjectBrowser(repos, readthedocs, organizations) {
+ if (!Array.isArray(organizations) || !organizations.length
+ || organizations.some(name => typeof name !== "string" || !/^[a-z\d][a-z\d-]*$/i.test(name))) {
+ throw new Error("Invalid organization registry")
+ }
+ const organization = document.getElementById("project-organization")
+ organizations.sort((left, right) => left.localeCompare(right))
+ for (const name of organizations) {
+ organization.add(new Option(name, name))
+ }
+ const registered = new Set(organizations.map(name => name.toLowerCase()))
+ const sorted = repos.filter(repo => registered.has(repo.owner.login.toLowerCase()) && shouldProcessRepo(repo))
+ .sort(globalThis.rankingSorter("stargazers_count", "full_name"))
+ // Build each card once so filtering does not fetch its assets again.
+ const cards = sorted.map(repo => ({ repo, column: buildRepoCard(repo, readthedocs) }))
+ const update = () => updateProjectFilters(cards, organizations)
+ const search = document.getElementById("project-search")
+ organization.disabled = false
+ search.disabled = false
+ organization.addEventListener("change", update)
+ search.addEventListener("input", update)
+ update()
+}
+
+
+// create project cards
+onDocumentReady(function () {
+ container = document.getElementById("project-container")
+ if (!container) return
+
+ let readthedocsRequest = fetchJson(`${base_url}/${cache_repo}/readthedocs/projects.json`)
+ .then(function (data) {
+ return Object.values(data)
+ })
+ .catch(function (error) {
+ console.log("No ReadTheDocs project data available", error)
+ return []
+ })
+
+ let reposRequest = fetchJson(`${base_url}/${cache_repo}/github/repos.json`)
+ let organizationsRequest = fetchJson(organizations_url)
+
+ Promise.all([readthedocsRequest, reposRequest, organizationsRequest])
+ .then(function ([readthedocs, result, organizations]) {
+ createProjectBrowser(result, readthedocs, organizations)
+ })
+ .catch(function (error) {
+ document.getElementById("project-status").textContent = "Projects could not be loaded. Please try again later."
+ console.error("Error loading project data:", error)
+ })
+})
diff --git a/assets/js/release-versions.js b/assets/js/release-versions.js
new file mode 100644
index 0000000..95752c4
--- /dev/null
+++ b/assets/js/release-versions.js
@@ -0,0 +1,63 @@
+/**
+ * Update stable and prerelease links with release data from GitHub.
+ *
+ * @param {object} options Release display options.
+ * @param {string} options.repository GitHub repository in owner/name form.
+ * @param {string} options.stableButtonSelector Selector for the stable release link.
+ * @param {string} options.stableVersionSelector Selector for the stable version text.
+ * @param {string} options.prereleaseButtonSelector Selector for the prerelease link.
+ * @param {string} options.prereleaseVersionSelector Selector for the prerelease version text.
+ * @returns {PromiseNo roadmap items found.
'; + return; + } + + // Clear loading message + issuesList.innerHTML = ''; + + issues.forEach(issue => { + const issueCol = document.createElement('div'); + issueCol.className = 'col-lg-4 mb-5'; + + const issueEl = document.createElement('div'); + issueEl.className = 'card h-100 shadow border-0 rounded-0'; + issueEl.style.cursor = 'pointer'; + + // Store issue data for modal + issueEl.dataset.issue = JSON.stringify(issue); + + // Click event to show modal + issueEl.addEventListener('click', function() { + const issueData = JSON.parse(this.dataset.issue); + displayIssueInModal(issueData); + }); + + const cardBody = document.createElement('div'); + cardBody.className = 'card-body p-4 rounded-0'; + + // Issue title + const titleEl = document.createElement('h5'); + titleEl.className = 'card-title mb-3 fw-bolder crowdin-ignore'; + const titleText = document.createElement('span'); + titleText.textContent = issue.title; + titleText.className = 'text-decoration-none'; + titleEl.appendChild(titleText); + + // Issue metadata + const metaEl = document.createElement('div'); + metaEl.className = 'd-flex justify-content-between mb-2 small'; + + // Issue number + const numberEl = document.createElement('span'); + numberEl.className = 'badge bg-secondary crowdin-ignore'; + numberEl.textContent = `#${issue.number}`; + + // Issue date + const dateEl = document.createElement('span'); + dateEl.className = 'crowdin-ignore'; + const createdDate = new Date(issue.created_at); + dateEl.textContent = createdDate.toLocaleDateString(); + + metaEl.appendChild(numberEl); + metaEl.appendChild(dateEl); + + // Labels + const labelsEl = document.createElement('div'); + labelsEl.className = 'd-flex flex-wrap gap-1 mb-2'; + + // Sort labels alphabetically by name + const sortedLabels = [...issue.labels].sort((a, b) => + a.name.toLowerCase().localeCompare(b.name.toLowerCase()) + ); + + sortedLabels.forEach(label => { + const labelEl = document.createElement('span'); + labelEl.className = 'badge crowdin-ignore'; + labelEl.textContent = label.name; + applyLabelStyle(labelEl, label.color); + + labelsEl.appendChild(labelEl); + }); + + // Add all elements to the card body + cardBody.appendChild(titleEl); + cardBody.appendChild(metaEl); + cardBody.appendChild(labelsEl); + + issueEl.appendChild(cardBody); + issueCol.appendChild(issueEl); + issuesList.appendChild(issueCol); + }); + + }) + .catch(error => { + issuesList.innerHTML = `Error loading roadmap items: ${error.message}
`; + }); + + // Function to display issue in modal + function displayIssueInModal(issue) { + // Set modal title + issueModalLabel.textContent = `${issue.title} (#${issue.number})`; + + // Set GitHub link + viewOnGithubBtn.href = issue.html_url; + + // Create modal content + let modalContent = document.createElement('div'); + + // Issue metadata + const metaEl = document.createElement('div'); + metaEl.className = 'd-flex justify-content-between mb-3'; + + // Issue created date + const createdEl = document.createElement('span'); + const createdLabel = document.createElement('strong'); + createdLabel.textContent = 'Created:'; + createdEl.appendChild(createdLabel); + createdEl.appendChild(document.createTextNode(' ')); + + const createdValue = document.createElement('span'); + createdValue.className = 'crowdin-ignore'; + const createdDate = new Date(issue.created_at); + createdValue.textContent = createdDate.toLocaleDateString(); + createdEl.appendChild(createdValue); + + // Issue author + const authorEl = document.createElement('span'); + const authorLabel = document.createElement('strong'); + authorLabel.textContent = 'By:'; + authorEl.appendChild(authorLabel); + authorEl.appendChild(document.createTextNode(' ')); + + const authorValue = document.createElement('span'); + authorValue.className = 'crowdin-ignore'; + authorValue.textContent = issue.user.login; + authorEl.appendChild(authorValue); + + metaEl.appendChild(createdEl); + metaEl.appendChild(authorEl); + modalContent.appendChild(metaEl); + + // Labels + if (issue.labels && issue.labels.length > 0) { + const labelsContainer = document.createElement('div'); + labelsContainer.className = 'mb-3'; + + const labelsTitle = document.createElement('strong'); + labelsTitle.textContent = 'Labels:'; + labelsContainer.appendChild(labelsTitle); + + const labelsEl = document.createElement('div'); + labelsEl.className = 'd-flex flex-wrap gap-1 mt-1'; + + issue.labels.forEach(label => { + const labelEl = document.createElement('span'); + labelEl.className = 'badge crowdin-ignore'; + labelEl.textContent = label.name; + applyLabelStyle(labelEl, label.color); + + labelsEl.appendChild(labelEl); + }); + + labelsContainer.appendChild(labelsEl); + modalContent.appendChild(labelsContainer); + } + + // Issue body + const bodyContainer = document.createElement('div'); + bodyContainer.className = 'mt-3 p-3 rounded-0'; + + if (issue.body) { + // Create a container with crowdin-ignore class for the entire rendered content + const markdownContainer = document.createElement('div'); + markdownContainer.className = 'crowdin-ignore'; + + // Use Marked to parse the markdown + markdownContainer.innerHTML = marked.parse(issue.body); + + // Add the rendered content to the body container + bodyContainer.appendChild(markdownContainer); + } else { + const noContentMsg = document.createElement('div'); + noContentMsg.textContent = 'No description provided.'; + bodyContainer.appendChild(noContentMsg); + } + + modalContent.appendChild(bodyContainer); + + // Set modal content + issueModalBody.innerHTML = ''; + issueModalBody.appendChild(modalContent); + + // Show modal + issueModal.show(); + } +}); diff --git a/assets/js/staticman.js b/assets/js/staticman.js new file mode 100644 index 0000000..9b8b226 --- /dev/null +++ b/assets/js/staticman.js @@ -0,0 +1,62 @@ +document.addEventListener('DOMContentLoaded', function() { + document.getElementById('new_comment').addEventListener('submit', function(event) { + event.preventDefault(); + const form = this; + + form.classList.add('disabled'); + + const endpoint = ''; + const repository = ''; + const branch = ''; + const url = endpoint + repository + '/' + branch + '/comments'; + const data = new URLSearchParams(new FormData(form)).toString(); + + const xhr = new XMLHttpRequest(); + xhr.open("POST", url); + xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); + xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); + xhr.onreadystatechange = function () { + if(xhr.readyState === XMLHttpRequest.DONE) { + const status = xhr.status; + if (status >= 200 && status < 400) { + formSubmitted(); + } else { + formError(); + } + } + }; + + function formSubmitted() { + document.getElementById('comment-form-submit').classList.add('d-none'); + document.getElementById('comment-form-submitted').classList.remove('d-none'); + const notice = document.querySelector('.page__comments-form .js-notice'); + notice.classList.remove('alert-danger'); + notice.classList.add('alert-success'); + showAlert('success'); + } + + function formError() { + document.getElementById('comment-form-submitted').classList.add('d-none'); + document.getElementById('comment-form-submit').classList.remove('d-none'); + const notice = document.querySelector('.page__comments-form .js-notice'); + notice.classList.remove('alert-success'); + notice.classList.add('alert-danger'); + showAlert('failure'); + form.classList.remove('disabled'); + } + + xhr.send(data); + }); + + function showAlert(message) { + const notice = document.querySelector('.page__comments-form .js-notice'); + notice.classList.remove('d-none'); + if (message === 'success') { + document.querySelector('.page__comments-form .js-notice-text-success').classList.remove('d-none'); + document.querySelector('.page__comments-form .js-notice-text-failure').classList.add('d-none'); + } else { + document.querySelector('.page__comments-form .js-notice-text-success').classList.add('d-none'); + document.querySelector('.page__comments-form .js-notice-text-failure').classList.remove('d-none'); + } + } +}); diff --git a/assets/js/store.js b/assets/js/store.js new file mode 100644 index 0000000..bdaff77 --- /dev/null +++ b/assets/js/store.js @@ -0,0 +1,26 @@ +(() => { + 'use strict'; + + document.querySelectorAll('.store-gallery-modal').forEach((modalElement) => { + const carouselElement = modalElement.querySelector('.store-gallery-carousel'); + if (!carouselElement) { + return; + } + + modalElement.addEventListener('show.bs.modal', (event) => { + const requestedSlide = Number.parseInt(event.relatedTarget?.dataset.storeSlide ?? '0', 10); + const carousel = bootstrap.Carousel.getOrCreateInstance(carouselElement, { + interval: false, + keyboard: true, + touch: true, + wrap: true, + }); + + carousel.to(Number.isNaN(requestedSlide) ? 0 : requestedSlide); + }); + + modalElement.addEventListener('shown.bs.modal', () => { + carouselElement.focus(); + }); + }); +})(); diff --git a/assets/js/tabs.js b/assets/js/tabs.js new file mode 100644 index 0000000..411e285 --- /dev/null +++ b/assets/js/tabs.js @@ -0,0 +1,57 @@ +/** + * Keep matching groups of tabs in sync. + */ +(function() { + 'use strict'; + + let synchronizing = false; + + function getTabButtons(group) { + const tabList = Array.from(group.children).find((child) => child.getAttribute('role') === 'tablist'); + + if (!tabList) { + return []; + } + + return Array.from(tabList.querySelectorAll('[role="tab"][data-tab-name]')); + } + + function haveMatchingNames(firstButtons, secondButtons) { + return firstButtons.length === secondButtons.length && firstButtons.every( + (button, index) => button.dataset.tabName === secondButtons[index].dataset.tabName + ); + } + + function synchronizeTabs(event) { + const selectedTab = event.target; + + if (synchronizing || !selectedTab.matches('.tabs [role="tab"][data-tab-name]')) { + return; + } + + const selectedGroup = selectedTab.closest('.tabs'); + const selectedButtons = getTabButtons(selectedGroup); + const selectedIndex = selectedButtons.indexOf(selectedTab); + + synchronizing = true; + + try { + document.querySelectorAll('.tabs').forEach((group) => { + const groupButtons = getTabButtons(group); + const matchingTab = groupButtons[selectedIndex]; + + if ( + group !== selectedGroup && + haveMatchingNames(selectedButtons, groupButtons) && + !matchingTab.classList.contains('active') + ) { + bootstrap.Tab.getOrCreateInstance(matchingTab).show(); + } + }); + } finally { + synchronizing = false; + } + } + + document.addEventListener('shown.bs.tab', synchronizeTabs); +})(); diff --git a/assets/js/theme-init.js b/assets/js/theme-init.js new file mode 100644 index 0000000..9346345 --- /dev/null +++ b/assets/js/theme-init.js @@ -0,0 +1,26 @@ +// Beautiful Jekyll Next - Theme Initialization +// This script must run before page renders to prevent flash of wrong theme (FOUC) + +(function() { + 'use strict'; + + const getStoredTheme = () => localStorage.getItem('theme'); + + const getPreferredTheme = () => { + const storedTheme = getStoredTheme(); + if (storedTheme) { + return storedTheme; + } + return 'auto'; + }; + + const getThemeToApply = (theme) => { + if (theme === 'auto') { + return globalThis.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; + } + return theme; + }; + + const theme = getPreferredTheme(); + document.documentElement.dataset.bsTheme = getThemeToApply(theme); +})(); diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000..79620bf Binary files /dev/null and b/favicon.ico differ diff --git a/feed.xml b/feed.xml new file mode 100644 index 0000000..f1de0b8 --- /dev/null +++ b/feed.xml @@ -0,0 +1,15 @@ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ A LizardByte project + + + + +
+ libvirtualhid
+ + ++ A LizardByte project + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
++ libvirtualhid is a cross-platform C++ library for creating virtual input devices. It focuses on + gamepad support for remote streaming hosts, while keeping the public API portable and hiding + platform-specific virtual HID details behind backend implementations. +
+
+
+
+
+
+
+
+
+
+ Windows only
+
+
+ Create virtual gamepads on Windows
++ A license is required for virtual gamepads created through the Windows Virtual HID + Driver. Non-Windows backends do not currently require a license. Choose a yearly or + lifetime license at checkout. +
+
+
+Features
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Platform-neutral C++ API
+Build against portable runtime, profile, device, and report concepts while backend-specific HID details stay behind the library implementation. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Gamepad-first profiles
+Create virtual gamepads that model generic HID, Xbox, DualShock, DualSense, and Nintendo Switch Pro-style controller layouts. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Remote streaming ready
+Designed for low-latency streaming hosts that need predictable lifecycle, normalized input state, and output feedback callbacks. +
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ User-mode Windows support
+Windows gamepads are exposed through a user-mode UMDF2 control driver backed by Virtual HID Framework, without requiring a custom kernel-mode driver. +
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ Linux HID backends
+Linux gamepads use descriptor-driven uhid devices, with uinput available for keyboard, mouse, touchscreen, trackpad, and pen tablet devices. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ CMake friendly
+Consume libvirtualhid through installed packages, vendored source, add_subdirectory, or FetchContent in CMake-based projects. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Virtual HID Driver
++ Explore the separate Windows driver package for compatible applications that create + virtual HID gamepads. +
+
+
+
+
+
+
+
+
+
+
+ Documentation
++ Read the documentation to learn how to build, use, and integrate libvirtualhid. +
+
+ Read the Docs
+
+
+
+
+
+
+
+
+
+ Source
++ Browse the library source, public headers, and streaming-host-oriented examples. +
+
+
+ 
+ GitHub
+
+
+
+ Examples
+
+
+
+ GitHub
+
+
+
+ Examples
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ---
+# Name of the property. You can have multiple properties with completely
+# different config blocks for different sections of your site.
+# For example, you can have one property to handle comment submission and
+# another one to handle posts.
+# To encrypt strings, use the following endpoint:
+# https://{STATICMAN API INSTANCE}/v3/encrypt/{TEXT TO BE ENCRYPTED}
+# {STATICMAN API INSTANCE} should match the `endpoint` in the theme config
+# file.
+
+comments:
+ # (*) REQUIRED
+ #
+ # Names of the fields the form is allowed to submit. If a field that is
+ # not here is part of the request, an error will be thrown.
+ allowedFields: ["name", "email", "url", "message"]
+
+ # (*) REQUIRED WHEN USING NOTIFICATIONS
+ #
+ # When allowedOrigins is defined, only requests sent from one of the domains
+ # listed will be accepted. The origin is sent as part as the `options` object
+ # (e.g.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Blog Index
+ + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User-mode virtual gamepads for Windows + + + + +
+ Virtual HID Driver
+ + ++ User-mode virtual gamepads for Windows + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
++ Virtual HID Driver is the Windows gamepad backend for libvirtualhid. It installs the user-mode driver + component that compatible applications use to create virtual HID gamepads discoverable by Windows apps. + The driver package is separate from the portable C++ library and is currently packaged for AMD64 systems. +
+
+
+
+
+ Windows only
+
+ Buy a Windows license
+
+
+ Get your Virtual HID Driver license
++ A license is required to create virtual gamepads with this Windows driver. Non-Windows backends + do not currently require a license. Choose a yearly or lifetime license at checkout. +
+ +
+ Buy a Windows license
+
+
+
+Driver features
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User-mode by design
+Uses a UMDF2 control driver backed by Windows Virtual HID Framework, with no custom kernel-mode driver added by libvirtualhid. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Standard HID gamepads
+Publishes virtual HID devices for compatible DirectInput, SDL/HIDAPI, Windows Gaming Input, GameInput, and browser Gamepad API consumers. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Process-owned lifecycle
+Associates each virtual gamepad with the client that created it so Windows can clean up the device if that process exits or crashes. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Built-in diagnostic UI
+Includes a native tool for creating, controlling, and monitoring gamepads, device nodes, battery state, and output feedback. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Multiple controller profiles
+Supports Generic, Xbox One, Xbox Series, DualShock 4, DualSense, and Nintendo Switch Pro-style virtual controller profiles. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Output feedback
+Normalizes supported rumble, RGB LED, adaptive trigger, and raw output events for the application that owns the virtual gamepad. +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ For compatible applications
++ Applications create and update gamepads through libvirtualhid's platform-neutral C++ + API. The Windows backend communicates with the installed driver, while platform-specific + HID details stay out of consumer code. The library and driver must use matching control + protocol versions. +
+
+ The installed package also includes the virtualhid_control diagnostic UI
+ and the gamepad_adapter example for local validation.
+
+
+
+
+
+
+
+
+
+ Compatibility notes
+-
+
- + The driver is for virtual gamepads. libvirtualhid's Windows keyboard and mouse + support does not require this package. + +
- + Xbox 360 uses a dedicated user-mode XUSB companion plus a correlated VHF child; + other gamepad profiles use the VHF path directly. + +
- + Xbox 360 targets XInput directly. Xbox One and Xbox Series remain HID profiles and + do not guarantee an XInput slot; review the profile compatibility documentation. + +
+
+
+
+
+
+
+
+
+
+ License
++ The Windows UMDF driver source and generated driver package artifacts use the + LizardByte Source-Available License 1.0. Packaged helper components may use the MIT + License as documented in the repository license map. +
+