@alepot55/chessboardjs 2.3.6 → 2.3.8

package/src/services/ValidationService.js

@@ -1,5 +1,5 @@
 /**
- * Service for input validation and data sanitization
+ * ValidationService - Handles input validation and data sanitization
  * @module services/ValidationService
  * @since 2.0.0
  */
@@ -51,45 +51,39 @@ const SIZE_CONSTRAINTS = Object.freeze({
 /**
  * Service responsible for validating inputs and data
  * Implements caching for performance optimization
- * @class
+ * @class ValidationService
  */
 export class ValidationService {
     /**
-     * Creates a new ValidationService instance
+     * Create a new ValidationService instance
      */
     constructor() {
-        // Cache for validation results to improve performance
         this._validationCache = new Map();
         this._cacheMaxSize = 1000;
-        
-        // Compile patterns for reuse
         this._patterns = VALIDATION_PATTERNS;
         this._validValues = VALID_VALUES;
         this._constraints = SIZE_CONSTRAINTS;
     }
 
     /**
-     * Validates a square identifier with caching
+     * Validate a square identifier with caching
      * @param {string} square - Square to validate (e.g., 'e4')
      * @returns {boolean} True if valid
      */
     isValidSquare(square) {
         const cacheKey = `square:${square}`;
-        
         if (this._validationCache.has(cacheKey)) {
             return this._validationCache.get(cacheKey);
         }
-        
-        const isValid = typeof square === 'string' && 
-                        square.length === 2 && 
-                        this._patterns.square.test(square);
-        
+        const isValid = typeof square === 'string' &&
+            square.length === 2 &&
+            this._patterns.square.test(square);
         this._cacheValidationResult(cacheKey, isValid);
         return isValid;
     }
 
     /**
-     * Validates a piece identifier with enhanced format support
+     * Validate a piece identifier with enhanced format support
      * @param {string} piece - Piece to validate (e.g., 'wK', 'bp')
      * @returns {boolean} True if valid
      */
@@ -97,28 +91,22 @@ export class ValidationService {
         if (typeof piece !== 'string' || piece.length !== 2) {
             return false;
         }
-        
         const cacheKey = `piece:${piece}`;
-        
         if (this._validationCache.has(cacheKey)) {
             return this._validationCache.get(cacheKey);
         }
-        
         const [first, second] = piece.split('');
-        
-        // Check both formats: [type][color] and [color][type]
-        const format1 = PIECE_TYPES.includes(first.toLowerCase()) && 
-                       PIECE_COLORS.includes(second);
-        const format2 = PIECE_COLORS.includes(first) && 
-                       PIECE_TYPES.includes(second.toLowerCase());
-        
+        const format1 = PIECE_TYPES.includes(first.toLowerCase()) &&
+            PIECE_COLORS.includes(second);
+        const format2 = PIECE_COLORS.includes(first) &&
+            PIECE_TYPES.includes(second.toLowerCase());
         const isValid = format1 || format2;
         this._cacheValidationResult(cacheKey, isValid);
         return isValid;
     }
 
     /**
-     * Validates a FEN string with comprehensive checks
+     * Validate a FEN string with comprehensive checks
      * @param {string} fen - FEN string to validate
      * @returns {boolean} True if valid
      */
@@ -126,86 +114,64 @@ export class ValidationService {
         if (typeof fen !== 'string') {
             return false;
         }
-        
         const cacheKey = `fen:${fen}`;
-        
         if (this._validationCache.has(cacheKey)) {
             return this._validationCache.get(cacheKey);
         }
-        
-        // Basic pattern check
         if (!this._patterns.fen.test(fen)) {
             this._cacheValidationResult(cacheKey, false);
             return false;
         }
-        
-        // Additional FEN validation
         const isValid = this._validateFenStructure(fen);
         this._cacheValidationResult(cacheKey, isValid);
         return isValid;
     }
 
     /**
-     * Validates FEN structure in detail
+     * Validate FEN structure in detail
      * @private
      * @param {string} fen - FEN string to validate
      * @returns {boolean} True if valid
      */
     _validateFenStructure(fen) {
         const parts = fen.split(' ');
-        
         if (parts.length !== 6) {
             return false;
         }
-        
-        // Validate piece placement
         const ranks = parts[0].split('/');
         if (ranks.length !== 8) {
             return false;
         }
-        
-        // Validate each rank
         for (const rank of ranks) {
             if (!this._validateRank(rank)) {
                 return false;
             }
         }
-        
-        // Validate active color
         if (!['w', 'b'].includes(parts[1])) {
             return false;
         }
-        
-        // Validate castling rights
         if (!/^[KQkq-]*$/.test(parts[2])) {
             return false;
         }
-        
-        // Validate en passant target
         if (parts[3] !== '-' && !this.isValidSquare(parts[3])) {
             return false;
         }
-        
-        // Validate halfmove clock and fullmove number
         const halfmove = parseInt(parts[4], 10);
         const fullmove = parseInt(parts[5], 10);
-        
-        return !isNaN(halfmove) && !isNaN(fullmove) && 
-               halfmove >= 0 && fullmove >= 1;
+        return !isNaN(halfmove) && !isNaN(fullmove) &&
+            halfmove >= 0 && fullmove >= 1;
     }
 
     /**
-     * Validates a single rank in FEN notation
+     * Validate a single rank in FEN notation
      * @private
      * @param {string} rank - Rank to validate
      * @returns {boolean} True if valid
      */
     _validateRank(rank) {
         let squares = 0;
-        
         for (let i = 0; i < rank.length; i++) {
             const char = rank[i];
-            
             if (/[1-8]/.test(char)) {
                 squares += parseInt(char, 10);
             } else if (/[prnbqkPRNBQK]/.test(char)) {
@@ -214,12 +180,11 @@ export class ValidationService {
                 return false;
             }
         }
-        
         return squares === 8;
     }
 
     /**
-     * Validates a move string with comprehensive format support
+     * Validate a move string with comprehensive format support
      * @param {string} move - Move string to validate (e.g., 'e2e4', 'e7e8q')
      * @returns {boolean} True if valid
      */
@@ -227,20 +192,17 @@ export class ValidationService {
         if (typeof move !== 'string') {
             return false;
         }
-        
         const cacheKey = `move:${move}`;
-        
         if (this._validationCache.has(cacheKey)) {
             return this._validationCache.get(cacheKey);
         }
-        
         const isValid = this._validateMoveFormat(move);
         this._cacheValidationResult(cacheKey, isValid);
         return isValid;
     }
 
     /**
-     * Validates move format in detail
+     * Validate move format in detail
      * @private
      * @param {string} move - Move string to validate
      * @returns {boolean} True if valid
@@ -249,21 +211,15 @@ export class ValidationService {
         if (move.length < 4 || move.length > 5) {
             return false;
         }
-        
-        const from = move.slice(0, 2);
-        const to = move.slice(2, 4);
-        const promotion = move.slice(4, 5);
-        
+        const from = move.substring(0, 2);
+        const to = move.substring(2, 4);
         if (!this.isValidSquare(from) || !this.isValidSquare(to)) {
             return false;
         }
-        
-        if (promotion && !this._validValues.promotionPieces.includes(promotion)) {
+        if (move.length === 5 && !/[qrnb]/i.test(move[4])) {
             return false;
         }
-        
-        // Additional move validation (e.g., source and target different)
-        return from !== to;
+        return true;
     }
 
     /**
@@ -293,11 +249,9 @@ export class ValidationService {
         if (size === 'auto') {
             return true;
         }
-        
         if (typeof size === 'number') {
             return size >= this._constraints.min && size <= this._constraints.max;
         }
-        
         return false;
     }
 
@@ -307,9 +261,9 @@ export class ValidationService {
      * @returns {boolean} True if valid
      */
     isValidTime(time) {
-        return typeof time === 'number' && 
-               time >= 0 && 
-               time <= this._constraints.maxTime;
+        return typeof time === 'number' &&
+            time >= 0 &&
+            time <= this._constraints.maxTime;
     }
 
     /**
@@ -327,10 +281,10 @@ export class ValidationService {
      * @returns {boolean} True if valid
      */
     isValidElementId(id) {
-        return typeof id === 'string' && 
-               id.length > 0 && 
-               id.length <= 100 && // Reasonable length limit
-               /^[a-zA-Z][\w:-]*$/.test(id); // Valid HTML ID format
+        return typeof id === 'string' &&
+            id.length > 0 &&
+            id.length <= 100 && // Reasonable length limit
+            /^[a-zA-Z][\w:-]*$/.test(id); // Valid HTML ID format
     }
 
     /**
@@ -370,24 +324,20 @@ export class ValidationService {
         if (typeof color !== 'string') {
             return false;
         }
-        
         // Check for hex colors
         if (this._patterns.color.test(color)) {
             return true;
         }
-        
         // Check for named colors (basic set)
         const namedColors = ['white', 'black', 'red', 'green', 'blue', 'yellow', 'cyan', 'magenta'];
         if (namedColors.includes(color.toLowerCase())) {
             return true;
         }
-        
         // Check for rgb/rgba format
         if (/^rgb\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*\)$/.test(color) ||
             /^rgba\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*,\s*[0-1](\.\d+)?\s*\)$/.test(color)) {
             return true;
         }
-        
         return false;
     }
 
@@ -400,8 +350,8 @@ export class ValidationService {
     validateSquare(square) {
         if (!this.isValidSquare(square)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_square + square, 
-                'square', 
+                ERROR_MESSAGES.invalid_square + square,
+                'square',
                 square
             );
         }
@@ -417,8 +367,8 @@ export class ValidationService {
     validatePiece(piece) {
         if (!this.isValidPiece(piece)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_piece + piece, 
-                'piece', 
+                ERROR_MESSAGES.invalid_piece + piece,
+                'piece',
                 piece
             );
         }
@@ -434,8 +384,8 @@ export class ValidationService {
     validateFen(fen) {
         if (!this.isValidFen(fen)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_fen + fen, 
-                'fen', 
+                ERROR_MESSAGES.invalid_fen + fen,
+                'fen',
                 fen
             );
         }
@@ -451,8 +401,8 @@ export class ValidationService {
     validateMove(move) {
         if (!this.isValidMove(move)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_move + move, 
-                'move', 
+                ERROR_MESSAGES.invalid_move + move,
+                'move',
                 move
             );
         }
@@ -468,16 +418,15 @@ export class ValidationService {
     validateOrientation(orientation) {
         if (!this.isValidOrientation(orientation)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_orientation + orientation, 
-                'orientation', 
+                ERROR_MESSAGES.invalid_orientation + orientation,
+                'orientation',
                 orientation
             );
         }
-        
         // Normalize to 'w' or 'b'
-        return orientation === 'white' ? 'w' : 
-               orientation === 'black' ? 'b' : 
-               orientation;
+        return orientation === 'white' ? 'w' :
+            orientation === 'black' ? 'b' :
+                orientation;
     }
 
     /**
@@ -489,16 +438,15 @@ export class ValidationService {
     validateColor(color) {
         if (!this.isValidColor(color)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_color + color, 
-                'color', 
+                ERROR_MESSAGES.invalid_color + color,
+                'color',
                 color
             );
         }
-        
         // Normalize to 'w' or 'b'
-        return color === 'white' ? 'w' : 
-               color === 'black' ? 'b' : 
-               color;
+        return color === 'white' ? 'w' :
+            color === 'black' ? 'b' :
+                color;
     }
 
     /**
@@ -510,8 +458,8 @@ export class ValidationService {
     validateSize(size) {
         if (!this.isValidSize(size)) {
             throw new ValidationError(
-                ERROR_MESSAGES.invalid_size + size, 
-                'size', 
+                ERROR_MESSAGES.invalid_size + size,
+                'size',
                 size
             );
         }
@@ -527,36 +475,29 @@ export class ValidationService {
     validateConfig(config) {
         if (!config || typeof config !== 'object') {
             throw new ValidationError(
-                'Configuration must be an object', 
-                'config', 
+                'Configuration must be an object',
+                'config',
                 config
             );
         }
-        
         const errors = [];
-        
         // Validate required fields
         if (!config.id && !config.id_div) {
             errors.push('Configuration must include id or id_div');
         }
-        
         // Validate optional fields
         if (config.orientation && !this.isValidOrientation(config.orientation)) {
             errors.push(ERROR_MESSAGES.invalid_orientation + config.orientation);
         }
-        
         if (config.size && !this.isValidSize(config.size)) {
             errors.push(ERROR_MESSAGES.invalid_size + config.size);
         }
-        
         if (config.movableColors && !this.isValidMovableColors(config.movableColors)) {
             errors.push(ERROR_MESSAGES.invalid_color + config.movableColors);
         }
-        
         if (config.dropOffBoard && !this.isValidDropOffBoard(config.dropOffBoard)) {
             errors.push(ERROR_MESSAGES.invalid_dropOffBoard + config.dropOffBoard);
         }
-                
         // Validate callbacks
         const callbacks = ['onMove', 'onMoveEnd', 'onChange', 'onDragStart', 'onDragMove', 'onDrop', 'onSnapbackEnd'];
         for (const callback of callbacks) {
@@ -564,7 +505,6 @@ export class ValidationService {
                 errors.push(`Invalid ${callback} callback`);
             }
         }
-        
         // Validate colors
         const colorFields = ['whiteSquare', 'blackSquare', 'highlight', 'hintColor'];
         for (const field of colorFields) {
@@ -572,15 +512,13 @@ export class ValidationService {
                 errors.push(`Invalid ${field} color: ${config[field]}`);
             }
         }
-        
         if (errors.length > 0) {
             throw new ValidationError(
-                `Configuration validation failed: ${errors.join(', ')}`, 
-                'config', 
+                `Configuration validation failed: ${errors.join(', ')}`,
+                'config',
                 config
             );
         }
-        
         return config;
     }
 
@@ -596,7 +534,6 @@ export class ValidationService {
             const firstKey = this._validationCache.keys().next().value;
             this._validationCache.delete(firstKey);
         }
-        
         this._validationCache.set(key, result);
     }
 
@@ -628,7 +565,6 @@ export class ValidationService {
         return validations.map(validation => {
             try {
                 const { type, value } = validation;
-                
                 switch (type) {
                     case 'square':
                         return { valid: this.isValidSquare(value), value };

package/src/services/index.js

@@ -12,3 +12,4 @@ export { MoveService } from './MoveService.js';
 export { PieceService } from './PieceService.js';
 export { PositionService } from './PositionService.js';
 export { ValidationService } from './ValidationService.js';
+export { ListenerManager } from '../utils/listenerManager.js';

package/src/styles/board.css

@@ -105,4 +105,12 @@
 
 .highlighted {
     box-shadow: inset 0 0 10px var(--highlightSquare);
+}
+
+body.chessboardjs-dragging {
+  touch-action: none !important;
+  overscroll-behavior: contain !important;
+  position: fixed !important;
+  width: 100vw !important;
+  overflow: hidden !important;
 }

package/src/utils/listenerManager.js

@@ -0,0 +1,62 @@
+/**
+ * ListenerManager - Utility per la gestione centralizzata dei listener DOM
+ * Permette di aggiungere, rimuovere e pulire tutti i listener in modo sicuro e senza duplicazioni.
+ * @module utils/listenerManager
+ * @since 2.0.0
+ */
+
+export class ListenerManager {
+    constructor() {
+        /**
+         * Lista di tutti i listener registrati
+         * @type {Array<{element: EventTarget, type: string, handler: Function, options?: any}>}
+         */
+        this.listeners = [];
+    }
+
+    /**
+     * Aggiunge un listener e lo traccia per la rimozione automatica
+     * @param {EventTarget} element - Elemento su cui aggiungere il listener
+     * @param {string} type - Tipo di evento
+     * @param {Function} handler - Funzione handler
+     * @param {Object|boolean} [options] - Opzioni per addEventListener
+     */
+    add(element, type, handler, options) {
+        if (!element || !type || !handler) return;
+        element.addEventListener(type, handler, options);
+        this.listeners.push({ element, type, handler, options });
+    }
+
+    /**
+     * Rimuove un listener specifico
+     * @param {EventTarget} element
+     * @param {string} type
+     * @param {Function} handler
+     */
+    remove(element, type, handler) {
+        if (!element || !type || !handler) return;
+        element.removeEventListener(type, handler);
+        this.listeners = this.listeners.filter(
+            l => !(l.element === element && l.type === type && l.handler === handler)
+        );
+    }
+
+    /**
+     * Rimuove tutti i listener registrati
+     */
+    removeAll() {
+        for (const { element, type, handler, options } of this.listeners) {
+            element.removeEventListener(type, handler, options);
+        }
+        this.listeners = [];
+    }
+
+    /**
+     * Pulizia risorse
+     */
+    destroy() {
+        this.removeAll();
+    }
+}
+
+export default ListenerManager;