23 repositorios
Mechanisms for linking user interface events to application logic for immediate updates.
Distinct from Bi-Directional State Synchronizations: Distinct from state synchronization or serialization; focuses on the event-to-logic trigger in a UI.
Explore 23 awesome GitHub repositories matching user interface & experience · Event-Driven User Interactions. Refine with filters or upvote what's useful.
ngx-bootstrap es un conjunto de widgets y componentes de interfaz de usuario con estilo Bootstrap construidos específicamente para el framework Angular. Proporciona una librería de elementos de interfaz reutilizables diseñados para trabajar con el motor de compilación y renderizado Angular Ivy. La librería permite la integración de componentes de Bootstrap en aplicaciones Angular para crear interfaces de usuario receptivas sin requerir CSS o JavaScript manual. Reemplaza la necesidad de jQuery utilizando directivas de Angular para la gestión de estado y un motor de posicionamiento adaptativo para elementos flotantes. El conjunto de componentes cubre una amplia gama de elementos interactivos, incluyendo controles de navegación como pestañas y paginación, ventanas superpuestas como modales y popovers, y herramientas de entrada de datos como selectores de fecha y hora. También incluye widgets de diseño y retroalimentación como acordeones, barras de progreso y alertas.
Implements an asynchronous event system to trigger UI updates and manage transitions across the component tree.
tui.chart es un motor de gráficos estadísticos y una librería de visualización de datos diseñada para renderizar gráficos interactivos para conjuntos de datos numéricos complejos. Funciona como un framework de gráficos responsivo capaz de producir diversas representaciones estadísticas, incluyendo gráficos de líneas, barras, dispersión, burbujas y treemaps. La librería se distingue por un sistema de visualización interactivo que soporta tooltips sincronizados a través de múltiples gráficos, zoom basado en rangos y selección de series de datos. Incluye un motor de diseño que ajusta automáticamente las dimensiones y animaciones de los gráficos según el tamaño del contenedor de visualización. El sistema cubre una amplia gama de capacidades de renderizado, incluyendo mapeo de datos jerárquicos mediante treemaps, mapas de calor codificados por colores y la capacidad de manejar actualizaciones de datos en tiempo real para monitoreo en vivo. Áreas de utilidad adicionales incluyen funcionalidad de exportación de datos y actualizaciones de configuración dinámica para modificar la apariencia de las visualizaciones activas.
Features an event-driven system for tracking mouse and touch positions to trigger interactive tooltips and data selection.
Joint es una biblioteca de JavaScript para crear diagramas visuales interactivos y diagramas de flujo utilizando Scalable Vector Graphics (SVG). Proporciona un entorno programable para crear un lienzo SVG interactivo con soporte integrado para zoom, desplazamiento y gestos táctiles. El framework incluye un sistema de componentes para definir formas personalizadas y elementos programáticos dentro de un sistema de coordenadas basado en vectores. Cuenta con un serializador de diagramas basado en JSON para guardar y cargar estados de diagramas, así como algoritmos de diseño automatizados y mapeo de relaciones para renderizar nodos y aristas. La biblioteca cubre una amplia gama de capacidades de diagramación, incluyendo la gestión de estructuras jerárquicas para elementos anidados, enrutamiento de enlaces basado en rutas con puntas de flecha personalizables y un sistema de interacción basado en eventos. También incluye herramientas para el recorrido de datos de grafos y la disposición automatizada de elementos para optimizar la claridad visual.
Captures raw browser input and translates it into semantic diagram events to trigger custom application logic.
Este proyecto es un frontend de video basado en React diseñado como un clon de YouTube. Proporciona una interfaz de usuario para navegar y reproducir contenido de video, recreando el diseño y la navegación de una plataforma profesional de intercambio de videos. La interfaz está construida utilizando Tailwind CSS para implementar un diseño web receptivo. Se centra en el desarrollo de un diseño de transmisión de video, incluyendo la implementación de reproductores de video, barras laterales y elementos de navegación.
Links browser-level mouse and keyboard events to trigger interface updates and playback controls.
Este proyecto es una interfaz basada en web y cliente RPC diseñado para controlar el cliente BitTorrent Transmission. Sirve como un dashboard accesible desde el navegador para gestionar descargas y subidas de torrents, permitiendo a los usuarios organizar archivos y seguir el progreso de las transferencias. El controlador proporciona herramientas especializadas para la optimización de trackers, incluyendo el reemplazo por lotes de trackers y monitoreo de salud para mejorar el descubrimiento de pares. También permite la organización remota del sistema de archivos, permitiendo a los usuarios reubicar directorios de almacenamiento de datos para entradas específicas sin eliminar los datos subyacentes. El sistema cubre una amplia gama de capacidades de gestión, incluyendo filtrado y ordenamiento de metadatos, importación de torrents mediante arrastrar y soltar, y la capacidad de exportar rutas de archivos. Los usuarios también pueden ajustar la configuración global del cliente y los parámetros operativos a través de una interfaz de configuración centralizada.
Links user interface events like button clicks and drag-and-drop actions to API calls and UI refreshes.
Este proyecto es un framework de UI multiplataforma y biblioteca de componentes diseñada para el framework Weex. Proporciona una colección de componentes de interfaz interactivos de alto rendimiento y un kit de herramientas de elementos prefabricados, como botones y ventanas emergentes, para crear interfaces de usuario consistentes en diferentes plataformas a partir de una única base de código. La biblioteca se centra en acelerar la construcción de interfaces de aplicaciones móviles ofreciendo un conjunto de elementos de diseño reutilizables y herramientas interactivas. Esto permite el desarrollo de pantallas móviles funcionales y diseños de UI multiplataforma a través de una biblioteca de componentes compartida.
Links native touch events to JavaScript handlers through an asynchronous event-driven interaction model.
Este proyecto es una experiencia web 3D y galería interactiva diseñada como portafolio personal. Utiliza una simulación de habitación virtual para crear una representación espacial de un entorno físico donde los usuarios pueden navegar y explorar arte digital y trabajos creativos. El entorno se renderiza directamente en el navegador como una galería 3D interactiva, permitiendo a los usuarios explorar una muestra espacial mediante navegación en primera persona. El proyecto utiliza renderizado por GPU basado en WebGL y sombreadores personalizados para mostrar entornos espaciales complejos. Incorpora carga asíncrona de recursos y un sistema basado en eventos para gestionar las interacciones del usuario y las animaciones dentro de la escena.
Links user interactions with 3D objects to specific animation and sound sequences.
Este proyecto es un plugin de frontend para jQuery y una biblioteca de componentes de UI diseñada para construir interfaces web móviles. Funciona como un framework de UI web móvil, proporcionando una colección de componentes visuales y controles prefabricados. La biblioteca se centra en el desarrollo de UI web móvil y el diseño de interfaces con jQuery. Se utiliza para crear páginas web móviles consistentes y para mantener o actualizar proyectos web móviles heredados que dependen de jQuery para la estructura del frontend y la presentación visual.
Implements a system of listeners to link user interface events to specific JavaScript callback functions.
This project is a translated historical chronicle and programming language reference documenting the technical evolution and standardization of JavaScript over two decades. It serves as a software engineering archive that tracks version drafts and the influence of various standards bodies on the development of the language. The repository provides a Chinese translation of a comprehensive history, analyzing the socio-political and technical milestones of the ecosystem. It maps language milestones and chronicles the development of official specifications to provide historical context on how the
Documents the implementation of event-driven logic to handle user interactions.
Este proyecto es un plugin de clustering de marcadores y herramienta de visualización de mapas para Leaflet. Funciona como una biblioteca de agrupación que organiza grandes conjuntos de datos de puntos geográficos en clusters para reducir el desorden visual y mejorar el rendimiento y la legibilidad del navegador. La biblioteca incluye un gestor de marcadores que organiza los puntos superpuestos en un diseño radial, asegurando que los marcadores individuales que comparten las mismas coordenadas permanezcan visualmente distintos y clicables. Proporciona capacidades para iconografía de grupo personalizada, vistas previas de límites geográficos para grupos de marcadores y ajustes automáticos de zoom para adaptarse a los límites de un cluster seleccionado. El sistema también maneja la gestión masiva de marcadores utilizando carga fragmentada para evitar que la interfaz del navegador se congele durante el procesamiento de grandes conjuntos de datos.
Maps internal cluster state changes and user clicks to custom callback events for external application logic.
This project is a structured JavaScript programming course and learning path designed for beginners. It functions as an interactive coding tutorial and frontend web development guide, providing a curriculum centered on the JavaScript language. The project focuses on building dynamic web interfaces through the manipulation of the Document Object Model. It provides a series of instructional guides and practical challenges that allow for interactive coding practice and the verification of code execution within a dedicated environment. The curriculum covers core programming fundamentals, includi
Guides students in linking user interface events, such as clicks, to application logic for immediate updates.
Esta es una biblioteca de JavaScript de navegación responsiva utilizada para crear menús amigables para móviles con detección de tamaño de pantalla y soporte táctil. Funciona como un menú de navegación accesible y un selector de diseño del lado del cliente que transiciona entre vistas móviles y de escritorio sin dependencias externas. El proyecto sirve como una herramienta de animación de menús que permite transiciones CSS suaves y animaciones basadas en altura al alternar superposiciones de navegación. Utiliza APIs nativas del navegador para gestionar los estados de la interfaz y garantizar que la navegación siga siendo funcional para lectores de pantalla y usuarios sin JavaScript. La biblioteca cubre capacidades para detectar puntos de ruptura (breakpoints) de pantalla, gestionar la visibilidad de la navegación alternada e implementar transiciones de diseño para interfaces táctiles.
Links user interaction events to navigation visibility logic for immediate UI updates.
zoom.js es un plugin de zoom de imágenes para jQuery y visor de imágenes frontend diseñado para gestionar la expansión de imágenes y la visualización de alta resolución. Funciona como una biblioteca de magnificación de imágenes que permite transiciones suaves desde miniaturas a vistas de tamaño completo dentro de un navegador web. La biblioteca proporciona magnificación de detalles visuales para aumentar la visibilidad de detalles finos e incluye un disparador para abrir versiones de alta resolución de las imágenes en nuevas pestañas del navegador. Estas capacidades se implementan mediante el mapeo de posiciones basado en coordenadas y animaciones impulsadas por transiciones CSS para manejar las interacciones de la galería de imágenes.
Links user interactions like clicks and key presses to toggle between thumbnail and zoomed image states.
Este proyecto es una biblioteca de referencia de ejemplos de código funcional y demostraciones ejecutables. Proporciona guías de implementación y fragmentos prácticos para utilizar APIs del navegador, características de CSS, manipulaciones del DOM y componentes web. La colección incluye demostraciones en vivo de capacidades de estilo modernas, incluyendo patrones de diseño avanzados y APIs de pintura. También incluye muestras de referencia para construir elementos personalizados reutilizables utilizando estructuras de Shadow DOM para el desarrollo de interfaces de usuario modulares. La biblioteca cubre una amplia gama de capacidades del navegador, incluyendo procesamiento de flujos multimedia con modificación de fotogramas de video en tiempo real, patrones de comunicación entre contextos entre ventanas e iframes, y manipulación programática de elementos del DOM. Además, proporciona ejemplos de integración de hardware del dispositivo, como detección de postura para pantallas plegables y puentes de interfaz de sistema nativo para tareas como la selección de contactos. El repositorio contiene ejemplos basados en JavaScript diseñados para ser ejecutados dentro de un entorno de navegador en vivo.
Demonstrates linking browser interface events to application logic for immediate state updates.
Esta es una colección de pequeños proyectos de JavaScript y ejemplos de código que demuestran la implementación de conceptos fundamentales de programación a través de aplicaciones prácticas. El repositorio sirve como referencia para construir interfaces de usuario interactivas, gestionar el estado de la aplicación e integrar APIs externas utilizando JavaScript vanilla. El proyecto se centra en el uso de JavaScript estándar sin frameworks externos para crear elementos de interfaz como modales, sliders y galerías. Proporciona ejemplos de organización de lógica de aplicación compleja a través de patrones orientados a objetos utilizando clases y objetos para asegurar que el código esté estructurado y sea reutilizable. Las capacidades cubiertas incluyen la obtención de datos asíncronos para poblar contenido dinámico, la manipulación de elementos del DOM para actualizaciones de interfaz de usuario en tiempo real y el desarrollo de sistemas funcionales como temporizadores y paginación.
Links user interface events like clicks and key presses to application logic for immediate updates.
This project is a frontend development tutorial and web programming educational resource. It serves as a structured JavaScript web development course and a step-by-step guide designed to teach the core technologies used to create interactive and modern user interfaces. The curriculum focuses on mastering the combination of HTML, CSS, and JavaScript through a series of exercises and projects. It covers frontend development training and JavaScript programming education to help users learn modern web development standards. The material covers the construction of interactive websites, front end
Teaches how to link browser event listeners to JavaScript functions for interactive user experiences.
Diagram Maker es una biblioteca basada en web diseñada para construir herramientas interactivas de visualización de gráficos y modelado de datos. Proporciona un marco para renderizar estructuras de nodos y enlaces, permitiendo a los usuarios crear entornos de edición personalizados donde las relaciones de datos complejas pueden visualizarse y manipularse directamente en el navegador. La biblioteca utiliza una arquitectura modular impulsada por complementos que permite a los desarrolladores extender la funcionalidad de edición central para cumplir con requisitos específicos sin alterar el código fuente subyacente. Gestiona el estado de la aplicación a través de un almacén centralizado e inmutable, asegurando que las interacciones y las actualizaciones de datos permanezcan consistentes en todo el espacio de trabajo. El marco admite una gama de capacidades visuales y analíticas, incluida la capacidad de anotar metadatos en conexiones, calcular límites espaciales para un posicionamiento preciso de objetos y aplicar temas de color alternativos. Maneja las interacciones del usuario a través de un sistema impulsado por eventos que coordina las actualizaciones entre la interfaz visual y el modelo de datos subyacente.
Coordinates updates between the visual interface and the underlying data model using a centralized event-driven system.
Relation-graph is a frontend library designed for building interactive node-link diagrams and relationship visualizations within web applications. It provides a framework for rendering complex network structures that support manual manipulation, including zooming, dragging, and real-time structural editing. The library distinguishes itself through a framework-agnostic core that separates graph layout logic from the rendering layer. This architecture enables developers to inject custom HTML or framework-specific components directly into graph nodes and edges, allowing for highly tailored visua
Processes user inputs like dragging and zooming through a centralized event bus that triggers real-time updates to the graph topology.
Ant Design Charts is a data visualization framework and declarative component library designed for React applications. It provides a collection of reusable components that map complex datasets to graphical representations, enabling the creation of interactive charts, plots, and maps within web interfaces. The library utilizes a grammar-based mapping system to transform raw data into visual properties, supported by a layered graphic abstraction that separates data representation from interactive elements. It employs a canvas-based rendering engine to maintain performance when handling large da
Implements an event-driven system to manage user interactions and provide real-time visual feedback.
This project is a browser-based PDF editor that allows users to modify documents by inserting and repositioning text, images, and signatures. It functions as a client-side document editor, enabling the rendering, editing, and saving of files entirely within the user's browser environment. By processing all binary data locally, the application ensures that documents are never uploaded to a remote server, maintaining data privacy throughout the editing workflow. The tool utilizes an object-oriented model to manage individual elements, allowing for independent manipulation and transformation of
Captures user input through coordinate-based tracking to enable precise positioning and resizing of elements on the document canvas.