Enhance configuration options with detailed comments and add multilingual support for voice commands

This commit is contained in:
sinanisler
2025-12-22 14:13:27 +03:00
parent 7cb3c9c38e
commit f8094e9bb5
+78 -34
View File
@@ -157,28 +157,35 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
```javascript ```javascript
window.ACCESSIBILITY_WIDGET_CONFIG = { window.ACCESSIBILITY_WIDGET_CONFIG = {
// ===== Feature Toggles ===== // ===== Core Feature Toggles =====
enableHighContrast: true, enableHighContrast: true, // 3-level high contrast mode
enableBiggerText: true, enableBiggerText: true, // 4-level text size control
enableTextSpacing: true, enableTextSpacing: true, // 3-level text spacing
enablePauseAnimations: true, enablePauseAnimations: true, // Pause animations & reduced motion
enableHideImages: true, enableHideImages: true, // Hide images toggle
enableDyslexiaFont: true, enableDyslexiaFont: true, // Dyslexia-friendly fonts
enableBiggerCursor: true, enableBiggerCursor: true, // Large cursor
enableLineHeight: true, enableLineHeight: true, // 3-level line height (2em, 3em, 4em)
enableTextAlign: true, enableTextAlign: true, // Text alignment (left, center, right)
enableScreenReader: true,
enableVoiceControl: true, // ===== Advanced Features =====
enableFontSelection: true, enableScreenReader: true, // Built-in text-to-speech
enableColorFilter: true, enableVoiceControl: true, // Voice command control
enableFontSelection: true, // Font family selection
enableColorFilter: true, // Color blindness filters
// ===== Widget Layout ===== // ===== Widget Layout =====
widgetWidth: '440px', widgetWidth: '440px',
widgetColumns: 2, // Grid columns (1-4)
// ===== Grid Configuration =====
gridLayout: {
columns: '1fr 1fr', // Default 2-column grid
gap: '10px' // Gap between grid items
},
// ===== Position ===== // ===== Position =====
widgetPosition: { widgetPosition: {
side: 'right', // 'left' or 'right' side: 'right', // 'left' or 'right'
right: '20px', right: '20px',
left: '20px', left: '20px',
bottom: '20px' bottom: '20px'
@@ -186,11 +193,11 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
// ===== Colors ===== // ===== Colors =====
colors: { colors: {
primary: '#1663d7', primary: '#1663d7', // Header bg, main button, active borders
secondary: '#ffffff', secondary: '#ffffff', // Main button icon, header text
optionBg: '#ffffff', optionBg: '#ffffff', // Option button background
optionText: '#333333', optionText: '#333333', // Option button text
optionIcon: '#000000' optionIcon: '#000000' // Option button icons
}, },
// ===== Button Styling ===== // ===== Button Styling =====
@@ -201,17 +208,37 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
shadow: '0 4px 8px rgba(0, 0, 0, 0.2)' shadow: '0 4px 8px rgba(0, 0, 0, 0.2)'
}, },
// ===== Menu Styling =====
menu: {
headerHeight: '70px',
padding: '0 10px 10px 10px',
optionPadding: '20px 10px',
optionMargin: '10px',
borderRadius: '8px',
fontSize: '16px',
titleFontSize: '16px',
closeButtonSize: '44px'
},
// ===== Typography ===== // ===== Typography =====
typography: { typography: {
fontFamily: 'Arial, sans-serif', fontFamily: 'Arial, sans-serif',
fontSize: '17px', fontSize: '17px',
titleFontSize: '22px', titleFontSize: '22px',
titleFontWeight: '700' titleFontWeight: '700',
lineHeight: '1'
},
// ===== Animation =====
animation: {
transition: '0.2s',
hoverScale: '1.05'
}, },
// ===== Internationalization (i18n) ===== // ===== Internationalization (i18n) =====
lang: { lang: {
accessibilityMenu: 'Accessibility Menu', accessibilityMenu: 'Accessibility Menu',
closeAccessibilityMenu: 'Close Accessibility Menu',
accessibilityTools: 'Accessibility Tools', accessibilityTools: 'Accessibility Tools',
resetAllSettings: 'Reset All Settings', resetAllSettings: 'Reset All Settings',
screenReader: 'Screen Reader', screenReader: 'Screen Reader',
@@ -226,21 +253,38 @@ window.ACCESSIBILITY_WIDGET_CONFIG = {
colorFilter: 'Color Filter', colorFilter: 'Color Filter',
textAlign: 'Text Align', textAlign: 'Text Align',
textSize: 'Text Size', textSize: 'Text Size',
highContrast: 'High Contrast' highContrast: 'High Contrast',
defaultFont: 'Default Font',
noFilter: 'No Filter',
default: 'Default',
screenReaderOn: 'Screen reader on',
screenReaderOff: 'Screen reader off',
voiceControlActivated: 'Voice control activated',
notSupportedBrowser: 'is not supported in this browser',
close: 'Close',
reset: 'Reset',
saturation: 'Saturation',
selectLanguage: 'Select Language'
}, },
// ===== Voice Commands ===== // ===== Voice Commands (Multi-language Support) =====
voiceCommands: { voiceCommands: {
showMenu: ['show menu', 'open menu'], en: {
highContrast: ['high contrast'], showMenu: ['show menu', 'open menu', 'accessibility menu', 'access menu'],
biggerText: ['bigger text', 'large text'], highContrast: ['high contrast', 'contrast', 'dark mode', 'increase contrast'],
textSpacing: ['text spacing'], biggerText: ['bigger text', 'large text', 'text size', 'increase text', 'bigger', 'larger text', 'text bigger', 'make text bigger', 'enlarge text'],
pauseAnimations: ['pause animations'], textSpacing: ['text spacing', 'spacing', 'letter spacing', 'text space'],
hideImages: ['hide images'], pauseAnimations: ['pause animations', 'stop animations', 'disable animations', 'no animations'],
dyslexiaFont: ['dyslexia font'], hideImages: ['hide images', 'remove images', 'no images'],
biggerCursor: ['bigger cursor'], dyslexiaFont: ['dyslexia friendly', 'dyslexia font', 'readable font', 'easy font'],
screenReader: ['screen reader'], biggerCursor: ['bigger cursor', 'large cursor', 'cursor size', 'big cursor'],
resetAll: ['reset all', 'reset everything'] lineHeight: ['line height', 'line spacing', 'space between lines', 'line space'],
textAlign: ['align text', 'text align', 'center text', 'alignment'],
screenReader: ['screen reader', 'read aloud', 'voice reader'],
voiceControl: ['voice command', 'voice control', 'voice commands'],
resetAll: ['reset all', 'reset everything', 'clear all', 'reset settings', 'reset']
},
// Additional languages: de, es, it, fr, ru, tr, ar, hi, zh-cn, jp available in widget
} }
}; };
``` ```