[PR #135] [CLOSED] Refactor and split into smaller files #158

Closed
opened 2026-02-10 18:47:24 +03:00 by OVERLORD · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/dualshock-tools/dualshock-tools.github.io/pull/135
Author: @mathiasm74
Created: 9/8/2025
Status: Closed

Base: mainHead: refactor-and-split-into-smaller-files


📝 Commits (5)

  • c42c034 Define with const or let, remove unnessessary spaces, start extracting controller API calls in separate functions that don't update the UI
  • 90a2bfa Continue separating calls to controller APIs from UI updates and deduplicate related code
  • 150a58d Refactor into separate files with abstractions for controller types
  • e8d85e9 Split the code into smaller more manageble files
  • d9496c2 Bug fixes

📊 Changes

30 files changed (+5394 additions, -4382 deletions)

View changed files

assets/dualshock-controller.svg (+108 -0)
assets/icons.svg (+27 -0)
core.js (+0 -3306)
css/finetune.css (+116 -0)
css/main.css (+23 -0)
📝 index.html (+219 -1076)
js/controller-manager.js (+484 -0)
js/controllers/base-controller.js (+148 -0)
js/controllers/controller-factory.js (+101 -0)
js/controllers/ds4-controller.js (+365 -0)
js/controllers/ds5-controller.js (+434 -0)
js/controllers/ds5-edge-controller.js (+248 -0)
js/core.js (+866 -0)
js/modals/calib-center-modal.js (+237 -0)
js/modals/calib-range-modal.js (+62 -0)
js/modals/finetune-modal.js (+754 -0)
js/stick-renderer.js (+213 -0)
js/template-loader.js (+69 -0)
js/translations.js (+193 -0)
js/utils.js (+160 -0)

...and 10 more files

📄 Description

Code Refactoring and Architecture Improvements

This PR implements a comprehensive refactoring of the DualShock Calibration GUI codebase to improve maintainability, readability, and organization. The changes include:

Major Changes

  1. Modular Architecture: Implemented a proper class hierarchy with a BaseController abstract class and specific implementations for DS4, DualSense, and DualSense Edge controllers.

  2. Separation of Concerns: Decoupled controller API calls from UI updates, allowing for better testability and cleaner code organization.

  3. Component-Based Structure: Split the monolithic codebase into smaller, more manageable files organized by functionality:

    • Controller-specific logic in the controllers/ directory
    • UI components in the js/ directory
    • HTML templates in the templates/ directory
    • CSS styles in dedicated files
  4. Modern JavaScript Practices: Updated code to use ES6+ features like const/let declarations, classes, and modules.

Technical Details

  • Created a factory pattern for controller instantiation
  • Implemented a controller manager to handle device connections
  • Extracted UI components into separate modules (calibration modals, stick renderer)
  • Organized assets and templates for better maintainability
  • Improved code style consistency throughout the codebase

These changes provide a solid foundation for future feature development while making the codebase more maintainable and easier to understand for new contributors.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/dualshock-tools/dualshock-tools.github.io/pull/135 **Author:** [@mathiasm74](https://github.com/mathiasm74) **Created:** 9/8/2025 **Status:** ❌ Closed **Base:** `main` ← **Head:** `refactor-and-split-into-smaller-files` --- ### 📝 Commits (5) - [`c42c034`](https://github.com/dualshock-tools/dualshock-tools.github.io/commit/c42c0345df81f8f4771ce6d8f006427024da99b6) Define with const or let, remove unnessessary spaces, start extracting controller API calls in separate functions that don't update the UI - [`90a2bfa`](https://github.com/dualshock-tools/dualshock-tools.github.io/commit/90a2bfae283cd95f812b17527de15872060254de) Continue separating calls to controller APIs from UI updates and deduplicate related code - [`150a58d`](https://github.com/dualshock-tools/dualshock-tools.github.io/commit/150a58d8ad9826a3c26c4cfbb152d777fd06dc55) Refactor into separate files with abstractions for controller types - [`e8d85e9`](https://github.com/dualshock-tools/dualshock-tools.github.io/commit/e8d85e949a2731142e7d9b1015c183fb0399c257) Split the code into smaller more manageble files - [`d9496c2`](https://github.com/dualshock-tools/dualshock-tools.github.io/commit/d9496c2e38e95326aa9927b3a076ca253090f594) Bug fixes ### 📊 Changes **30 files changed** (+5394 additions, -4382 deletions) <details> <summary>View changed files</summary> ➕ `assets/dualshock-controller.svg` (+108 -0) ➕ `assets/icons.svg` (+27 -0) ➖ `core.js` (+0 -3306) ➕ `css/finetune.css` (+116 -0) ➕ `css/main.css` (+23 -0) 📝 `index.html` (+219 -1076) ➕ `js/controller-manager.js` (+484 -0) ➕ `js/controllers/base-controller.js` (+148 -0) ➕ `js/controllers/controller-factory.js` (+101 -0) ➕ `js/controllers/ds4-controller.js` (+365 -0) ➕ `js/controllers/ds5-controller.js` (+434 -0) ➕ `js/controllers/ds5-edge-controller.js` (+248 -0) ➕ `js/core.js` (+866 -0) ➕ `js/modals/calib-center-modal.js` (+237 -0) ➕ `js/modals/calib-range-modal.js` (+62 -0) ➕ `js/modals/finetune-modal.js` (+754 -0) ➕ `js/stick-renderer.js` (+213 -0) ➕ `js/template-loader.js` (+69 -0) ➕ `js/translations.js` (+193 -0) ➕ `js/utils.js` (+160 -0) _...and 10 more files_ </details> ### 📄 Description ### Code Refactoring and Architecture Improvements This PR implements a comprehensive refactoring of the DualShock Calibration GUI codebase to improve maintainability, readability, and organization. The changes include: ### Major Changes 1. Modular Architecture: Implemented a proper class hierarchy with a BaseController abstract class and specific implementations for DS4, DualSense, and DualSense Edge controllers. 1. Separation of Concerns: Decoupled controller API calls from UI updates, allowing for better testability and cleaner code organization. 1. Component-Based Structure: Split the monolithic codebase into smaller, more manageable files organized by functionality: - Controller-specific logic in the controllers/ directory - UI components in the js/ directory - HTML templates in the templates/ directory - CSS styles in dedicated files 1. Modern JavaScript Practices: Updated code to use ES6+ features like const/let declarations, classes, and modules. ### Technical Details - Created a factory pattern for controller instantiation - Implemented a controller manager to handle device connections - Extracted UI components into separate modules (calibration modals, stick renderer) - Organized assets and templates for better maintainability - Improved code style consistency throughout the codebase These changes provide a solid foundation for future feature development while making the codebase more maintainable and easier to understand for new contributors. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
OVERLORD added the pull-request label 2026-02-10 18:47:24 +03:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: dualshock-tools/dualshock-tools.github.io#158