taye/interact.js
Interact.js
interact.js ist eine JavaScript-Interaktionsbibliothek, die verwendet wird, um Drag-and-Drop, Größenänderung und Multi-Touch-Gesten in Webbrowsern zu implementieren. Sie bietet ein spezialisiertes Interaktions-Framework für skalierbare Vektorgrafiken, das es ermöglicht, diese Elemente zu verschieben und in der Größe zu ändern.
Die Bibliothek verfügt über eine Multi-Touch-Gesten-Engine, die komplexe Muster wie Pinch und Rotate erkennt, sowie eine Koordinaten-Snapping-Engine zum Ausrichten von Elementen an Rastern oder zum Einschränken von Bewegungen innerhalb von Grenzen. Sie enthält zudem einen Cross-Frame-Zustandssynchronisierer, um Interaktionszustände und Eingabeereignisse über mehrere Browserfenster oder eingebettete Frames hinweg zu teilen.
Das Projekt deckt breite Fähigkeitsbereiche ab, einschließlich Bewegungsphysik für trägheitsbasierte Geschwindigkeitsberechnungen und Eingabenormalisierung zur Vereinheitlichung von Maus- und Touch-Ereignissen über Browser hinweg. Zusätzliche Funktionen umfassen die koordinatenbasierte Zustandsverfolgung und quantisiertes Snapping, um Positionen und Größen an vordefinierte Intervalle anzupassen.
Features
- Drag and Drop - Provides a comprehensive framework for implementing drag-and-drop interfaces with support for inertia and boundaries.
- Interactive Element Dragging - Enables moving elements across a screen with support for snapping and inertia.
- Interactive SVG Elements - Provides specialized tools to make SVG elements interactive through drag and resize capabilities.
- Drag and Drop Libraries - Provides a specialized library for implementing drag-and-drop, resizing, and multi-touch gestures in the browser.
- Movement Constraints - Applies restrictions to element movement, including axis locking and boundary clamping.
- Input Normalization Utilities - Unifies disparate mouse and touch pointer events into a consistent coordinate stream for cross-browser compatibility.
- Element Resizers - Provides utilities for interactively updating the bounding box dimensions of web elements.
- Grid Snapping - Aligns element positions and sizes to configurable grid increments during interactive movement or resizing.
- Interaction Coordinate Snapping - Provides a mechanism for aligning moving elements to grids or restricting movement boundaries.
- Multi-Touch Gesture Detections - Recognizes complex multi-touch patterns including pinch and rotate for web applications.
- Multi-Touch Gesture Systems - Processes simultaneous multi-finger inputs to recognize complex patterns like pinch and rotate.
- Boundary Constraints - Implements logic to restrict the movement of elements within defined containers or viewport areas.
- Event Normalizers - Translates native browser mouse and touch events into a unified internal coordinate system.
- Resize Mapping Logic - Provides logic that translates interactions on specific element perimeters into dimensional changes.
- Inertia Calculations - Computes movement decay based on input velocity to simulate natural physical momentum and smooth sliding.
- Spatial State Tracking - Tracks real-time X and Y coordinates of elements to maintain an accurate internal state of position and size.
- Coordinate Quantization - Rounds raw interaction coordinates to predefined intervals to ensure precise alignment of UI components.
- Cross-Frame Interaction Synchronization - Shares real-time interaction states and input events across multiple browser windows or embedded frames.
- Mobile Web Libraries - Library for drag, drop, and multi-touch gesture interactions.
