Invisible DOM Element for Graphical Object Repositioning
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Existing web browser technologies do not provide a direct mechanism to reposition individual graphical objects rendered as pixels within a shared pixel buffer, limiting user interaction capabilities such as dragging and rearranging graphical elements.
Innovation Solution
A graphical object management module is introduced that creates an invisible element within the DOM to listen to mouse and touchscreen events, allowing the repositioning of graphical objects within the pixel buffer by processing the movement of the invisible element, thereby enabling user interactions like dragging and rearranging graphical objects.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Productivity
If a shared pixel buffer is used to render multiple graphical objects, then system resource utilization is efficient, but individual graphical objects cannot be repositioned or manipulated
Solution Approach 1:
The patent segments the shared pixel buffer into individual graphical object regions by creating separate DOM elements for each graphical object. Each DOM element can be independently manipulated while rendering to the shared pixel buffer, enabling both efficient resource utilization and individual object manipulation.
Solution Approach 2:
The patent introduces an intermediary layer of DOM elements that act as mediators between the user interface and the shared pixel buffer. These invisible DOM elements listen to mouse and touchscreen events, translating user interactions into repositioning operations for the corresponding graphical objects within the pixel buffer.
2Ease of operation
If invisible DOM elements are created for each graphical object to enable manipulation, then user interaction capability is enhanced, but DOM element quantity increases
Solution Approach 1:
The patent applies local quality by making DOM elements invisible (with transparent backgrounds) only where needed for event listening, while keeping the actual graphical objects visible in the pixel buffer. This allows event handling functionality to be added locally without affecting the visual presentation or requiring additional visible elements.
3Adaptability or versatility
If graphical objects are rendered as pixels in a canvas element, then rendering flexibility is improved, but individual shape information is lost
Solution Approach 1:
The patent creates a copy of the graphical object information in the form of DOM elements that mirror the pixel-based graphical objects. These DOM element copies retain the positional and dimensional information needed for manipulation, while the original pixel-based rendering maintains rendering flexibility. The DOM elements serve as information proxies that enable interaction without altering the pixel-based rendering approach.
Data Source
AI summary
A graphical object is rendered to a pixel buffer, such that a software application executing on a computing device displays the contents of the pixel buffer via a user interface. An invisible element is created and positioned under the cursor in response to detecting that the cursor is positioned over the feature being displayed via the user interface. The software application automatically repositions the invisible element in accordance with a movement of the cursor. A change in the position of the invisible element is determined, and the graphical object is repositioned within the pixel buffer in accordance with the change in the position of the invisible element.