matthewhudson/current-device
Current Device
current-device is a JavaScript device detection library used to identify operating systems, device categories, and screen orientations within a web browser environment. It serves as a browser environment detector and client-side mapper that translates browser metadata and user-agent strings into predefined device labels and hardware categories.
The library provides tools for executing specific JavaScript logic based on the detected mobile or desktop platform. It also functions as a conditional styling tool and document body class injector, applying descriptive HTML classes to enable device-specific visual styling.
The system includes a screen orientation monitor to detect and react to changes between portrait and landscape modes in real time. It covers general capabilities for user-agent parsing, cross-platform web adaptation, and responsive orientation handling.
Features
- User Environment Detectors - A system for executing specific JavaScript logic based on the user's current mobile or desktop platform.
- Client Device Detection - Implements a client-side library to identify device types and operating systems for delivering optimized web experiences.
- Device and OS Detectors - Identifies the operating system, device category, and screen orientation to trigger logic specific to the user's environment.
- Device-Conditional Logic - Triggers specific JavaScript actions based on the detected device type, operating system, or current screen orientation.
- Environment-Specific Execution - Uses JavaScript logic to determine hardware characteristics and execute environment-specific code paths.
- Execution Path Detection - Detects the runtime environment to trigger specific JavaScript code execution paths based on the user platform.
- String Parsing - Extracts device and operating system information by analyzing the browser identification string.
- User-Agent Pattern Matching - Extracts operating system and device categories by matching browser identification strings against predefined regex patterns.
- Device Detection Utilities - Adds descriptive CSS classes to HTML elements based on the user's operating system, device type, and screen orientation.
- Screen Orientation Detection - Includes a real-time monitor to detect and react to changes between portrait and landscape screen orientations.
- Browser Environment Mapping - Maps raw browser metadata to a set of device categories and operating system labels during runtime.
- Client-Side Environment Mapping - Maps browser metadata and user-agent strings to predefined device labels and hardware categories.
- User Agent Parsers - Extracts device and operating system information from browser metadata to categorize the user's environment.
- Conditional CSS Styling - Provides the ability to apply specific CSS styles based on the detected hardware and operating system.
- CSS Class Utilities - Ships a utility that dynamically injects CSS classes into the document body based on device detection.
- Device-Specific Styling - Applies different CSS rules based on the user's operating system, device type, or screen orientation for a tailored visual experience.
- Orientation Change Listeners - Listens for window resize or orientation change events to trigger immediate updates to the environment state.
- Layout Orientation Recalculation - Executes custom code or updates layouts in real time when a device switches between portrait and landscape viewing modes.
- State-Based CSS Toggling - Dynamically modifies HTML element classes to adapt layouts for portrait versus landscape viewing modes.
- CSS Class-Based Styling - Adds descriptive CSS classes to HTML elements based on the detected device and orientation for custom styling.
- Environment Class Injection - Applies descriptive identifiers to the document body to allow for device-specific CSS targeting.
- Cross-Platform Web Frameworks - Tailors a website's behavior and appearance to match the specific constraints of different mobile and desktop platforms.
- Orientation Change Callbacks - Executes a callback function immediately whenever the device switches between landscape and portrait viewing modes.
